contain-css-svelte 1.3.0 → 1.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/Card.svelte +204 -288
  2. package/dist/controls/Button.svelte +27 -1
  3. package/dist/controls/ButtonLink.svelte +27 -1
  4. package/dist/controls/Checkbox.svelte +26 -0
  5. package/dist/controls/CircleButton.svelte +27 -1
  6. package/dist/controls/Input.svelte +27 -1
  7. package/dist/controls/RadioButton.svelte +26 -0
  8. package/dist/controls/Select.svelte +26 -0
  9. package/dist/controls/Slider.svelte +27 -1
  10. package/dist/controls/TabItem.svelte +27 -1
  11. package/dist/controls/Toggle.svelte +27 -1
  12. package/dist/dropdowns/DropdownMenu.svelte +27 -1
  13. package/dist/layout/Accordion.svelte +27 -1
  14. package/dist/layout/Bar.svelte +37 -1
  15. package/dist/layout/ColumnContainer.svelte +27 -1
  16. package/dist/layout/Columns.svelte +27 -1
  17. package/dist/layout/Container.svelte +205 -292
  18. package/dist/layout/DataList.svelte +27 -1
  19. package/dist/layout/DataListItem.svelte +205 -292
  20. package/dist/layout/Fieldset.svelte +27 -1
  21. package/dist/layout/Form.svelte +205 -292
  22. package/dist/layout/FormItem.svelte +27 -1
  23. package/dist/layout/GridLayout.svelte +26 -0
  24. package/dist/layout/Hero.svelte +205 -292
  25. package/dist/layout/Inline.svelte +33 -1
  26. package/dist/layout/MenuList.svelte +27 -1
  27. package/dist/layout/Page.svelte +27 -1
  28. package/dist/layout/RowContainer.svelte +27 -1
  29. package/dist/layout/Sidebar.svelte +272 -34
  30. package/dist/layout/Sidebar.svelte.d.ts +34 -0
  31. package/dist/layout/SidebarContainer.svelte +27 -1
  32. package/dist/layout/SplitPane.svelte +27 -1
  33. package/dist/layout/Stack.svelte +33 -1
  34. package/dist/layout/TabBar.svelte +27 -1
  35. package/dist/layout/Table.svelte +238 -294
  36. package/dist/layout/Tile.svelte +204 -291
  37. package/dist/misc/CodeInner.svelte +27 -1
  38. package/dist/misc/Progress.svelte +205 -292
  39. package/dist/misc/Tag.svelte +27 -1
  40. package/dist/overlays/Dialog.svelte +205 -292
  41. package/dist/overlays/Tooltip.svelte +255 -349
  42. package/dist/sass/_typography.scss +203 -191
  43. package/dist/typography/TextLayout.svelte +482 -292
  44. package/dist/vars/defaults.css +258 -0
  45. package/dist/vars/typography-context.css +271 -0
  46. package/package.json +1 -1
@@ -26,7 +26,33 @@ const el = $derived(elementProps(restProps, "hero", [
26
26
  {@render children?.()}
27
27
  </div>
28
28
 
29
- <style>/* Logical, not top/bottom/left/right: margin-block/margin-inline already take
29
+ <style>/* Per-level heading (h1-h6) box/typography properties, resolved to PRIVATE,
30
+ inheriting custom properties (--_h1-color, --_h2-font-size, etc) rather than
31
+ assigned directly to a matched h1-h6 selector. Nothing in this file matches
32
+ an actual heading element anymore -- see typography-context.css (vars/), which
33
+ is the single, global, :where()-scoped rule that actually reads these vars
34
+ and applies them to real elements. That split is what lets a component
35
+ nested arbitrarily deep (through <article>, <Tile>, whatever) still get the
36
+ nearest ancestor's heading styling: these are ordinary inherited custom
37
+ properties, so DOM proximity decides which component's values apply, not
38
+ selector specificity or stylesheet order. See AGENTS-INTERNAL.md. */
39
+ /* All six heading levels' context vars in one call -- what every
40
+ "typography container" component (Container, Card, Tile, TextLayout, ...)
41
+ includes on itself once, alongside the shared --_heading-* vars below. */
42
+ /* Shared prose-measure group: p, blockquote, dl, ul, ol. li/dt/dd don't get
43
+ their own vars -- they're never wider than their ul/ol/dl parent's own
44
+ max-width box, so they're already bounded for free by ordinary block
45
+ layout, not by anything selector-based reaching them individually. */
46
+ /* p specifically also gets the fuller typography-props-bare treatment
47
+ (paragraph-prefixed), which -- same as in the original selector-based
48
+ version -- is declared/consumed AFTER the shared prose vars above, so it
49
+ wins for whichever properties both groups set. */
50
+ /* The first paragraph in a typography context (p:first-of-type, or a p right
51
+ after a heading) gets its own, slightly different treatment -- larger lede
52
+ text, no top margin. Structural matching (:first-of-type, `h1 + p`) still
53
+ has to happen where the real element is, in the global consumer rule; only
54
+ the VALUES move to context vars here. */
55
+ /* Logical, not top/bottom/left/right: margin-block/margin-inline already take
30
56
  one value (both sides equal) or two (start end), so there is no separate
31
57
  "which side" prop to remember and no 4-value shorthand order to get wrong.
32
58
  Defaults to 0 on purpose -- unlike padding-props above, a margin that
@@ -159,297 +185,184 @@ const el = $derived(elementProps(restProps, "hero", [
159
185
  text-indent: var(--hero-indent, var(--surface-indent, var(--indent, unset)));
160
186
  font-variant: var(--hero-font-variant, var(--surface-font-variant, var(--font-variant, unset)));
161
187
  text-align: var(--hero-text-align, var(--surface-text-align, var(--text-align, unset)));
162
- }
163
-
164
- .hero :global(p),
165
- .hero :global(blockquote),
166
- .hero :global(dl),
167
- .hero :global(ul),
168
- .hero :global(ol) {
169
- max-width: var(--hero-line-width, var(--surface-line-width, var(--line-width, 40em)));
170
- font-family: var(--hero-body-font-family, var(--surface-body-font-family, var(--body-font-family, var(--font-family))));
171
- line-height: var(--hero-line-height, var(--surface-line-height, var(--line-height, 1.5)));
172
- margin-left: auto;
173
- margin-right: auto;
174
- font-weight: var(--hero-body-font-weight, var(--surface-body-font-weight, var(--body-font-weight, unset)));
175
- }
176
-
177
- .hero :global(h1),
178
- .hero :global(h2),
179
- .hero :global(h3),
180
- .hero :global(h4),
181
- .hero :global(h5),
182
- .hero :global(h6) {
183
- max-width: var(--hero-line-width, var(--surface-line-width, var(--line-width, unset)));
184
- margin-left: auto;
185
- margin-right: auto;
186
- box-sizing: border-box;
187
- margin-bottom: var(--hero-heading-margin-bottom, var(--surface-heading-margin-bottom, var(--heading-margin-bottom, 0)));
188
- margin-top: var(--hero-heading-margin-top, var(--surface-heading-margin-top, var(--heading-margin-top, 1.5em)));
189
- }
190
-
191
- .hero :global(h1:first-child),
192
- .hero :global(h2:first-child),
193
- .hero :global(h3:first-child),
194
- .hero :global(h4:first-child),
195
- .hero :global(h5:first-child),
196
- .hero :global(h6:first-child) {
197
- margin-top: var(--hero-first-heading-margin-top, var(--surface-first-heading-margin-top, var(--first-heading-margin-top, 0)));
198
- }
199
-
200
- .hero :global(h1) {
201
- --_heading-color: var(--hero-heading-1-fg, var(--surface-heading-1-fg, var(--hero-heading-major-fg, var(--surface-heading-major-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-1-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
202
- color: var(--_heading-color);
203
- --_heading-background: var(--hero-heading-1-bg, var(--surface-heading-1-bg, var(--hero-heading-major-bg, var(--surface-heading-major-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-1-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
204
- background: var(--_heading-background);
205
- --_heading-padding: var(--hero-heading-1-padding, var(--surface-heading-1-padding, var(--hero-heading-major-padding, var(--surface-heading-major-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-1-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
206
- padding: var(--_heading-padding);
207
- --_heading-border: var(--hero-heading-1-border, var(--surface-heading-1-border, var(--hero-heading-major-border, var(--surface-heading-major-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-1-border, var(--heading-major-border, var(--heading-border, none)))))))));
208
- border: var(--_heading-border);
209
- border-width: var(--hero-heading-1-border-width, var(--surface-heading-1-border-width, var(--hero-heading-major-border-width, var(--surface-heading-major-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-1-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
210
- border-style: var(--hero-heading-1-border-style, var(--surface-heading-1-border-style, var(--hero-heading-major-border-style, var(--surface-heading-major-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-1-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
211
- border-color: var(--hero-heading-1-border-color, var(--surface-heading-1-border-color, var(--hero-heading-major-border-color, var(--surface-heading-major-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-1-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
212
- --_heading-border-radius: var(--hero-heading-1-border-radius, var(--surface-heading-1-border-radius, var(--hero-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-1-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
213
- border-radius: var(--_heading-border-radius);
214
- --_heading-box-shadow: var(--hero-heading-1-box-shadow, var(--surface-heading-1-box-shadow, var(--hero-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-1-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
215
- box-shadow: var(--_heading-box-shadow);
216
- font-family: var(--hero-heading-1-font-family, var(--surface-heading-1-font-family, var(--hero-heading-major-font-family, var(--surface-heading-major-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-1-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
217
- text-transform: var(--hero-heading-1-text-transform, var(--surface-heading-1-text-transform, var(--hero-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-1-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
218
- text-decoration: var(--hero-heading-1-text-decoration, var(--surface-heading-1-text-decoration, var(--hero-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-1-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
219
- font-size: var(--hero-heading-1-font-size, var(--surface-heading-1-font-size, var(--hero-heading-major-font-size, var(--surface-heading-major-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-1-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
220
- font-weight: var(--hero-heading-1-font-weight, var(--surface-heading-1-font-weight, var(--hero-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-1-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
221
- line-height: var(--hero-heading-1-line-height, var(--surface-heading-1-line-height, var(--hero-heading-major-line-height, var(--surface-heading-major-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-1-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
222
- letter-spacing: var(--hero-heading-1-letter-spacing, var(--surface-heading-1-letter-spacing, var(--hero-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-1-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
223
- text-indent: var(--hero-heading-1-indent, var(--surface-heading-1-indent, var(--hero-heading-major-indent, var(--surface-heading-major-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-1-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
224
- font-variant: var(--hero-heading-1-font-variant, var(--surface-heading-1-font-variant, var(--hero-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-1-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
225
- text-align: var(--hero-heading-1-text-align, var(--surface-heading-1-text-align, var(--hero-heading-major-text-align, var(--surface-heading-major-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-1-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
226
- }
227
-
228
- .hero :global(h2) {
229
- --_heading-color: var(--hero-heading-2-fg, var(--surface-heading-2-fg, var(--hero-heading-major-fg, var(--surface-heading-major-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-2-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
230
- color: var(--_heading-color);
231
- --_heading-background: var(--hero-heading-2-bg, var(--surface-heading-2-bg, var(--hero-heading-major-bg, var(--surface-heading-major-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-2-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
232
- background: var(--_heading-background);
233
- --_heading-padding: var(--hero-heading-2-padding, var(--surface-heading-2-padding, var(--hero-heading-major-padding, var(--surface-heading-major-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-2-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
234
- padding: var(--_heading-padding);
235
- --_heading-border: var(--hero-heading-2-border, var(--surface-heading-2-border, var(--hero-heading-major-border, var(--surface-heading-major-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-2-border, var(--heading-major-border, var(--heading-border, none)))))))));
236
- border: var(--_heading-border);
237
- border-width: var(--hero-heading-2-border-width, var(--surface-heading-2-border-width, var(--hero-heading-major-border-width, var(--surface-heading-major-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-2-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
238
- border-style: var(--hero-heading-2-border-style, var(--surface-heading-2-border-style, var(--hero-heading-major-border-style, var(--surface-heading-major-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-2-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
239
- border-color: var(--hero-heading-2-border-color, var(--surface-heading-2-border-color, var(--hero-heading-major-border-color, var(--surface-heading-major-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-2-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
240
- --_heading-border-radius: var(--hero-heading-2-border-radius, var(--surface-heading-2-border-radius, var(--hero-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-2-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
241
- border-radius: var(--_heading-border-radius);
242
- --_heading-box-shadow: var(--hero-heading-2-box-shadow, var(--surface-heading-2-box-shadow, var(--hero-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-2-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
243
- box-shadow: var(--_heading-box-shadow);
244
- font-family: var(--hero-heading-2-font-family, var(--surface-heading-2-font-family, var(--hero-heading-major-font-family, var(--surface-heading-major-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-2-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
245
- text-transform: var(--hero-heading-2-text-transform, var(--surface-heading-2-text-transform, var(--hero-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-2-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
246
- text-decoration: var(--hero-heading-2-text-decoration, var(--surface-heading-2-text-decoration, var(--hero-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-2-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
247
- font-size: var(--hero-heading-2-font-size, var(--surface-heading-2-font-size, var(--hero-heading-major-font-size, var(--surface-heading-major-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-2-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
248
- font-weight: var(--hero-heading-2-font-weight, var(--surface-heading-2-font-weight, var(--hero-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-2-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
249
- line-height: var(--hero-heading-2-line-height, var(--surface-heading-2-line-height, var(--hero-heading-major-line-height, var(--surface-heading-major-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-2-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
250
- letter-spacing: var(--hero-heading-2-letter-spacing, var(--surface-heading-2-letter-spacing, var(--hero-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-2-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
251
- text-indent: var(--hero-heading-2-indent, var(--surface-heading-2-indent, var(--hero-heading-major-indent, var(--surface-heading-major-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-2-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
252
- font-variant: var(--hero-heading-2-font-variant, var(--surface-heading-2-font-variant, var(--hero-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-2-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
253
- text-align: var(--hero-heading-2-text-align, var(--surface-heading-2-text-align, var(--hero-heading-major-text-align, var(--surface-heading-major-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-2-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
254
- }
255
-
256
- .hero :global(h3) {
257
- --_heading-color: var(--hero-heading-3-fg, var(--surface-heading-3-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-3-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
258
- color: var(--_heading-color);
259
- --_heading-background: var(--hero-heading-3-bg, var(--surface-heading-3-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-3-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
260
- background: var(--_heading-background);
261
- --_heading-padding: var(--hero-heading-3-padding, var(--surface-heading-3-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-3-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
262
- padding: var(--_heading-padding);
263
- --_heading-border: var(--hero-heading-3-border, var(--surface-heading-3-border, var(--hero-heading-border, var(--surface-heading-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-3-border, var(--heading-border, var(--heading-border, none)))))))));
264
- border: var(--_heading-border);
265
- border-width: var(--hero-heading-3-border-width, var(--surface-heading-3-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-3-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
266
- border-style: var(--hero-heading-3-border-style, var(--surface-heading-3-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-3-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
267
- border-color: var(--hero-heading-3-border-color, var(--surface-heading-3-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-3-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
268
- --_heading-border-radius: var(--hero-heading-3-border-radius, var(--surface-heading-3-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-3-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
269
- border-radius: var(--_heading-border-radius);
270
- --_heading-box-shadow: var(--hero-heading-3-box-shadow, var(--surface-heading-3-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-3-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
271
- box-shadow: var(--_heading-box-shadow);
272
- font-family: var(--hero-heading-3-font-family, var(--surface-heading-3-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-3-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
273
- text-transform: var(--hero-heading-3-text-transform, var(--surface-heading-3-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-3-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
274
- text-decoration: var(--hero-heading-3-text-decoration, var(--surface-heading-3-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-3-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
275
- font-size: var(--hero-heading-3-font-size, var(--surface-heading-3-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-3-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
276
- font-weight: var(--hero-heading-3-font-weight, var(--surface-heading-3-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-3-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
277
- line-height: var(--hero-heading-3-line-height, var(--surface-heading-3-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-3-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
278
- letter-spacing: var(--hero-heading-3-letter-spacing, var(--surface-heading-3-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-3-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
279
- text-indent: var(--hero-heading-3-indent, var(--surface-heading-3-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-3-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
280
- font-variant: var(--hero-heading-3-font-variant, var(--surface-heading-3-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-3-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
281
- text-align: var(--hero-heading-3-text-align, var(--surface-heading-3-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-3-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
282
- }
283
-
284
- .hero :global(h4) {
285
- --_heading-color: var(--hero-heading-4-fg, var(--surface-heading-4-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-4-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
286
- color: var(--_heading-color);
287
- --_heading-background: var(--hero-heading-4-bg, var(--surface-heading-4-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-4-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
288
- background: var(--_heading-background);
289
- --_heading-padding: var(--hero-heading-4-padding, var(--surface-heading-4-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-4-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
290
- padding: var(--_heading-padding);
291
- --_heading-border: var(--hero-heading-4-border, var(--surface-heading-4-border, var(--hero-heading-border, var(--surface-heading-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-4-border, var(--heading-border, var(--heading-border, none)))))))));
292
- border: var(--_heading-border);
293
- border-width: var(--hero-heading-4-border-width, var(--surface-heading-4-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-4-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
294
- border-style: var(--hero-heading-4-border-style, var(--surface-heading-4-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-4-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
295
- border-color: var(--hero-heading-4-border-color, var(--surface-heading-4-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-4-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
296
- --_heading-border-radius: var(--hero-heading-4-border-radius, var(--surface-heading-4-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-4-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
297
- border-radius: var(--_heading-border-radius);
298
- --_heading-box-shadow: var(--hero-heading-4-box-shadow, var(--surface-heading-4-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-4-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
299
- box-shadow: var(--_heading-box-shadow);
300
- font-family: var(--hero-heading-4-font-family, var(--surface-heading-4-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-4-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
301
- text-transform: var(--hero-heading-4-text-transform, var(--surface-heading-4-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-4-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
302
- text-decoration: var(--hero-heading-4-text-decoration, var(--surface-heading-4-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-4-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
303
- font-size: var(--hero-heading-4-font-size, var(--surface-heading-4-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-4-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
304
- font-weight: var(--hero-heading-4-font-weight, var(--surface-heading-4-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-4-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
305
- line-height: var(--hero-heading-4-line-height, var(--surface-heading-4-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-4-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
306
- letter-spacing: var(--hero-heading-4-letter-spacing, var(--surface-heading-4-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-4-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
307
- text-indent: var(--hero-heading-4-indent, var(--surface-heading-4-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-4-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
308
- font-variant: var(--hero-heading-4-font-variant, var(--surface-heading-4-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-4-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
309
- text-align: var(--hero-heading-4-text-align, var(--surface-heading-4-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-4-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
310
- }
311
-
312
- .hero :global(h5) {
313
- --_heading-color: var(--hero-heading-5-fg, var(--surface-heading-5-fg, var(--hero-heading-minor-fg, var(--surface-heading-minor-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-5-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
314
- color: var(--_heading-color);
315
- --_heading-background: var(--hero-heading-5-bg, var(--surface-heading-5-bg, var(--hero-heading-minor-bg, var(--surface-heading-minor-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-5-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
316
- background: var(--_heading-background);
317
- --_heading-padding: var(--hero-heading-5-padding, var(--surface-heading-5-padding, var(--hero-heading-minor-padding, var(--surface-heading-minor-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-5-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
318
- padding: var(--_heading-padding);
319
- --_heading-border: var(--hero-heading-5-border, var(--surface-heading-5-border, var(--hero-heading-minor-border, var(--surface-heading-minor-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-5-border, var(--heading-minor-border, var(--heading-border, none)))))))));
320
- border: var(--_heading-border);
321
- border-width: var(--hero-heading-5-border-width, var(--surface-heading-5-border-width, var(--hero-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-5-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
322
- border-style: var(--hero-heading-5-border-style, var(--surface-heading-5-border-style, var(--hero-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-5-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
323
- border-color: var(--hero-heading-5-border-color, var(--surface-heading-5-border-color, var(--hero-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-5-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
324
- --_heading-border-radius: var(--hero-heading-5-border-radius, var(--surface-heading-5-border-radius, var(--hero-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-5-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
325
- border-radius: var(--_heading-border-radius);
326
- --_heading-box-shadow: var(--hero-heading-5-box-shadow, var(--surface-heading-5-box-shadow, var(--hero-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-5-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
327
- box-shadow: var(--_heading-box-shadow);
328
- font-family: var(--hero-heading-5-font-family, var(--surface-heading-5-font-family, var(--hero-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-5-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
329
- text-transform: var(--hero-heading-5-text-transform, var(--surface-heading-5-text-transform, var(--hero-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-5-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
330
- text-decoration: var(--hero-heading-5-text-decoration, var(--surface-heading-5-text-decoration, var(--hero-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-5-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
331
- font-size: var(--hero-heading-5-font-size, var(--surface-heading-5-font-size, var(--hero-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-5-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
332
- font-weight: var(--hero-heading-5-font-weight, var(--surface-heading-5-font-weight, var(--hero-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-5-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
333
- line-height: var(--hero-heading-5-line-height, var(--surface-heading-5-line-height, var(--hero-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-5-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
334
- letter-spacing: var(--hero-heading-5-letter-spacing, var(--surface-heading-5-letter-spacing, var(--hero-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-5-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
335
- text-indent: var(--hero-heading-5-indent, var(--surface-heading-5-indent, var(--hero-heading-minor-indent, var(--surface-heading-minor-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-5-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
336
- font-variant: var(--hero-heading-5-font-variant, var(--surface-heading-5-font-variant, var(--hero-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-5-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
337
- text-align: var(--hero-heading-5-text-align, var(--surface-heading-5-text-align, var(--hero-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-5-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
338
- }
339
-
340
- .hero :global(h6) {
341
- --_heading-color: var(--hero-heading-6-fg, var(--surface-heading-6-fg, var(--hero-heading-minor-fg, var(--surface-heading-minor-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-6-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
342
- color: var(--_heading-color);
343
- --_heading-background: var(--hero-heading-6-bg, var(--surface-heading-6-bg, var(--hero-heading-minor-bg, var(--surface-heading-minor-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-6-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
344
- background: var(--_heading-background);
345
- --_heading-padding: var(--hero-heading-6-padding, var(--surface-heading-6-padding, var(--hero-heading-minor-padding, var(--surface-heading-minor-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-6-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
346
- padding: var(--_heading-padding);
347
- --_heading-border: var(--hero-heading-6-border, var(--surface-heading-6-border, var(--hero-heading-minor-border, var(--surface-heading-minor-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-6-border, var(--heading-minor-border, var(--heading-border, none)))))))));
348
- border: var(--_heading-border);
349
- border-width: var(--hero-heading-6-border-width, var(--surface-heading-6-border-width, var(--hero-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-6-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
350
- border-style: var(--hero-heading-6-border-style, var(--surface-heading-6-border-style, var(--hero-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-6-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
351
- border-color: var(--hero-heading-6-border-color, var(--surface-heading-6-border-color, var(--hero-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-6-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
352
- --_heading-border-radius: var(--hero-heading-6-border-radius, var(--surface-heading-6-border-radius, var(--hero-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-6-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
353
- border-radius: var(--_heading-border-radius);
354
- --_heading-box-shadow: var(--hero-heading-6-box-shadow, var(--surface-heading-6-box-shadow, var(--hero-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-6-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
355
- box-shadow: var(--_heading-box-shadow);
356
- font-family: var(--hero-heading-6-font-family, var(--surface-heading-6-font-family, var(--hero-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-6-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
357
- text-transform: var(--hero-heading-6-text-transform, var(--surface-heading-6-text-transform, var(--hero-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-6-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
358
- text-decoration: var(--hero-heading-6-text-decoration, var(--surface-heading-6-text-decoration, var(--hero-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-6-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
359
- font-size: var(--hero-heading-6-font-size, var(--surface-heading-6-font-size, var(--hero-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-6-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
360
- font-weight: var(--hero-heading-6-font-weight, var(--surface-heading-6-font-weight, var(--hero-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-6-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
361
- line-height: var(--hero-heading-6-line-height, var(--surface-heading-6-line-height, var(--hero-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-6-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
362
- letter-spacing: var(--hero-heading-6-letter-spacing, var(--surface-heading-6-letter-spacing, var(--hero-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-6-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
363
- text-indent: var(--hero-heading-6-indent, var(--surface-heading-6-indent, var(--hero-heading-minor-indent, var(--surface-heading-minor-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-6-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
364
- font-variant: var(--hero-heading-6-font-variant, var(--surface-heading-6-font-variant, var(--hero-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-6-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
365
- text-align: var(--hero-heading-6-text-align, var(--surface-heading-6-text-align, var(--hero-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-6-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
366
- }
367
-
368
- .hero :global(p) {
369
- font-family: var(--hero-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, inherit)));
370
- text-transform: var(--hero-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, inherit)));
371
- text-decoration: var(--hero-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, inherit)));
372
- --_font-size: var(--hero-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit)));
373
- font-size: var(--_font-size);
374
- font-weight: var(--hero-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, inherit)));
375
- line-height: var(--hero-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit)));
376
- letter-spacing: var(--hero-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, inherit)));
377
- text-indent: var(--hero-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, inherit)));
378
- font-variant: var(--hero-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, inherit)));
379
- text-align: var(--hero-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, inherit)));
380
- }
381
-
382
- .hero :global(p:first-of-type),
383
- .hero :global(h1 + p),
384
- .hero :global(h2 + p),
385
- .hero :global(h3 + p),
386
- .hero :global(h4 + p),
387
- .hero :global(h5 + p),
388
- .hero :global(h6 + p) {
389
- font-family: var(--hero-first-paragraph-font-family, var(--surface-first-paragraph-font-family, var(--hero-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, var(--first-paragraph-font-family, inherit))))));
390
- text-transform: var(--hero-first-paragraph-text-transform, var(--surface-first-paragraph-text-transform, var(--hero-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, var(--first-paragraph-text-transform, inherit))))));
391
- text-decoration: var(--hero-first-paragraph-text-decoration, var(--surface-first-paragraph-text-decoration, var(--hero-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, var(--first-paragraph-text-decoration, inherit))))));
392
- --_font-size: var(--hero-first-paragraph-font-size, var(--surface-first-paragraph-font-size, var(--hero-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, var(--first-paragraph-font-size, inherit))))));
393
- font-size: var(--_font-size);
394
- font-weight: var(--hero-first-paragraph-font-weight, var(--surface-first-paragraph-font-weight, var(--hero-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, var(--first-paragraph-font-weight, inherit))))));
395
- line-height: var(--hero-first-paragraph-line-height, var(--surface-first-paragraph-line-height, var(--hero-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, var(--first-paragraph-line-height, inherit))))));
396
- letter-spacing: var(--hero-first-paragraph-letter-spacing, var(--surface-first-paragraph-letter-spacing, var(--hero-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, var(--first-paragraph-letter-spacing, inherit))))));
397
- text-indent: var(--hero-first-paragraph-indent, var(--surface-first-paragraph-indent, var(--hero-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, var(--first-paragraph-indent, inherit))))));
398
- font-variant: var(--hero-first-paragraph-font-variant, var(--surface-first-paragraph-font-variant, var(--hero-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, var(--first-paragraph-font-variant, inherit))))));
399
- text-align: var(--hero-first-paragraph-text-align, var(--surface-first-paragraph-text-align, var(--hero-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, var(--first-paragraph-text-align, inherit))))));
400
- font-size: var(--hero-first-paragraph-font-size, var(--surface-first-paragraph-font-size, var(--first-paragraph-font-size, var(--hero-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit))))));
401
- line-height: var(--hero-first-paragraph-line-height, var(--surface-first-paragraph-line-height, var(--first-paragraph-line-height, var(--hero-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit))))));
402
- margin-block-start: var(--hero-first-paragraph-margin-top, var(--surface-first-paragraph-margin-top, var(--first-paragraph-margin-top, 0)));
403
- }
404
-
405
- .hero :global(p:first-of-type::first-line),
406
- .hero :global(h1 + p::first-line),
407
- .hero :global(h2 + p::first-line),
408
- .hero :global(h3 + p::first-line),
409
- .hero :global(h4 + p::first-line),
410
- .hero :global(h5 + p::first-line),
411
- .hero :global(h6 + p::first-line) {
412
- font-family: var(--first-line-font-family, var(--hero-first-line-font-family, var(--surface-first-line-font-family, var(--first-line-font-family, inherit))));
413
- text-transform: var(--first-line-text-transform, var(--hero-first-line-text-transform, var(--surface-first-line-text-transform, var(--first-line-text-transform, inherit))));
414
- text-decoration: var(--first-line-text-decoration, var(--hero-first-line-text-decoration, var(--surface-first-line-text-decoration, var(--first-line-text-decoration, inherit))));
415
- --_font-size: var(--first-line-font-size, var(--hero-first-line-font-size, var(--surface-first-line-font-size, var(--first-line-font-size, inherit))));
416
- font-size: var(--_font-size);
417
- font-weight: var(--first-line-font-weight, var(--hero-first-line-font-weight, var(--surface-first-line-font-weight, var(--first-line-font-weight, inherit))));
418
- line-height: var(--first-line-line-height, var(--hero-first-line-line-height, var(--surface-first-line-line-height, var(--first-line-line-height, inherit))));
419
- letter-spacing: var(--first-line-letter-spacing, var(--hero-first-line-letter-spacing, var(--surface-first-line-letter-spacing, var(--first-line-letter-spacing, inherit))));
420
- text-indent: var(--first-line-indent, var(--hero-first-line-indent, var(--surface-first-line-indent, var(--first-line-indent, inherit))));
421
- font-variant: var(--first-line-font-variant, var(--hero-first-line-font-variant, var(--surface-first-line-font-variant, var(--first-line-font-variant, inherit))));
422
- text-align: var(--first-line-text-align, var(--hero-first-line-text-align, var(--surface-first-line-text-align, var(--first-line-text-align, inherit))));
423
- }
424
-
425
- .hero :global(p:first-of-type::first-letter),
426
- .hero :global(h1 + p::first-letter),
427
- .hero :global(h2 + p::first-letter),
428
- .hero :global(h3 + p::first-letter),
429
- .hero :global(h4 + p::first-letter),
430
- .hero :global(h5 + p::first-letter),
431
- .hero :global(h6 + p::first-letter) {
432
- font-family: var(--first-letter-font-family, var(--hero-first-letter-font-family, var(--surface-first-letter-font-family, inherit)));
433
- text-transform: var(--first-letter-text-transform, var(--hero-first-letter-text-transform, var(--surface-first-letter-text-transform, inherit)));
434
- text-decoration: var(--first-letter-text-decoration, var(--hero-first-letter-text-decoration, var(--surface-first-letter-text-decoration, inherit)));
435
- --_font-size: var(--first-letter-font-size, var(--hero-first-letter-font-size, var(--surface-first-letter-font-size, inherit)));
436
- font-size: var(--_font-size);
437
- font-weight: var(--first-letter-font-weight, var(--hero-first-letter-font-weight, var(--surface-first-letter-font-weight, inherit)));
438
- line-height: var(--first-letter-line-height, var(--hero-first-letter-line-height, var(--surface-first-letter-line-height, inherit)));
439
- letter-spacing: var(--first-letter-letter-spacing, var(--hero-first-letter-letter-spacing, var(--surface-first-letter-letter-spacing, inherit)));
440
- text-indent: var(--first-letter-indent, var(--hero-first-letter-indent, var(--surface-first-letter-indent, inherit)));
441
- font-variant: var(--first-letter-font-variant, var(--hero-first-letter-font-variant, var(--surface-first-letter-font-variant, inherit)));
442
- text-align: var(--first-letter-text-align, var(--hero-first-letter-text-align, var(--surface-first-letter-text-align, inherit)));
443
- --link-bg: var(--hero-link-bg, var(--surface-link-bg, inherit));
444
- --link-fg: var(--hero-link-fg, var(--surface-link-fg, inherit));
445
- background: var(--hero-first-letter-bg, var(--first-letter-bg, inherit));
446
- color: var(--hero-first-letter-fg, var(--first-letter-fg, inherit));
447
- float: var(--first-letter-float, none);
448
- margin-right: var(--first-letter-margin-right, 0);
449
- padding-top: var(--first-letter-padding-top, 0);
450
- }
451
-
452
- .hero {
188
+ --_prose-max-width: var(--hero-line-width, var(--surface-line-width, var(--line-width, 40em)));
189
+ --_prose-font-family: var(--hero-body-font-family, var(--surface-body-font-family, var(--body-font-family, var(--font-family))));
190
+ --_prose-line-height: var(--hero-line-height, var(--surface-line-height, var(--line-height, 1.5)));
191
+ /* Start-aligned: a measure-capped paragraph in a Card or a Tile sits
192
+ against its container's leading edge like any other block. Centring the
193
+ measure is what a prose column asks for, and TextLayout -- the one
194
+ component that IS a prose column -- opts back in to `auto`. */
195
+ --_prose-margin-inline: var(--hero-prose-margin-inline, var(--surface-prose-margin-inline, var(--prose-margin-inline, 0)));
196
+ --_prose-font-weight: var(--hero-body-font-weight, var(--surface-body-font-weight, var(--body-font-weight, unset)));
197
+ --_paragraph-font-family: var(--hero-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, inherit)));
198
+ --_paragraph-text-transform: var(--hero-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, inherit)));
199
+ --_paragraph-text-decoration: var(--hero-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, inherit)));
200
+ --_paragraph-font-size: var(--hero-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit)));
201
+ --_paragraph-font-weight: var(--hero-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, inherit)));
202
+ --_paragraph-line-height: var(--hero-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit)));
203
+ --_paragraph-letter-spacing: var(--hero-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, inherit)));
204
+ --_paragraph-text-indent: var(--hero-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, inherit)));
205
+ --_paragraph-font-variant: var(--hero-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, inherit)));
206
+ --_paragraph-text-align: var(--hero-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, inherit)));
207
+ --_first-paragraph-font-family: var(--hero-first-paragraph-font-family, var(--surface-first-paragraph-font-family, var(--hero-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, inherit)))));
208
+ --_first-paragraph-text-transform: var(--hero-first-paragraph-text-transform, var(--surface-first-paragraph-text-transform, var(--hero-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, inherit)))));
209
+ --_first-paragraph-text-decoration: var(--hero-first-paragraph-text-decoration, var(--surface-first-paragraph-text-decoration, var(--hero-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, inherit)))));
210
+ --_first-paragraph-font-weight: var(--hero-first-paragraph-font-weight, var(--surface-first-paragraph-font-weight, var(--hero-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, inherit)))));
211
+ --_first-paragraph-letter-spacing: var(--hero-first-paragraph-letter-spacing, var(--surface-first-paragraph-letter-spacing, var(--hero-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, inherit)))));
212
+ --_first-paragraph-text-indent: var(--hero-first-paragraph-indent, var(--surface-first-paragraph-indent, var(--hero-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, inherit)))));
213
+ --_first-paragraph-font-variant: var(--hero-first-paragraph-font-variant, var(--surface-first-paragraph-font-variant, var(--hero-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, inherit)))));
214
+ --_first-paragraph-text-align: var(--hero-first-paragraph-text-align, var(--surface-first-paragraph-text-align, var(--hero-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, inherit)))));
215
+ --_first-paragraph-font-size: var(--hero-first-paragraph-font-size, var(--surface-first-paragraph-font-size, var(--first-paragraph-font-size, var(--hero-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit))))));
216
+ --_first-paragraph-line-height: var(--hero-first-paragraph-line-height, var(--surface-first-paragraph-line-height, var(--first-paragraph-line-height, var(--hero-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit))))));
217
+ --_first-paragraph-margin-top: var(--hero-first-paragraph-margin-top, var(--surface-first-paragraph-margin-top, var(--first-paragraph-margin-top, 0)));
218
+ --_first-line-font-family: var(--first-line-font-family, var(--hero-first-line-font-family, var(--surface-first-line-font-family, var(--first-line-font-family, inherit))));
219
+ --_first-line-text-transform: var(--first-line-text-transform, var(--hero-first-line-text-transform, var(--surface-first-line-text-transform, var(--first-line-text-transform, inherit))));
220
+ --_first-line-text-decoration: var(--first-line-text-decoration, var(--hero-first-line-text-decoration, var(--surface-first-line-text-decoration, var(--first-line-text-decoration, inherit))));
221
+ --_first-line-font-size: var(--first-line-font-size, var(--hero-first-line-font-size, var(--surface-first-line-font-size, var(--first-line-font-size, inherit))));
222
+ --_first-line-font-weight: var(--first-line-font-weight, var(--hero-first-line-font-weight, var(--surface-first-line-font-weight, var(--first-line-font-weight, inherit))));
223
+ --_first-line-line-height: var(--first-line-line-height, var(--hero-first-line-line-height, var(--surface-first-line-line-height, var(--first-line-line-height, inherit))));
224
+ --_first-line-letter-spacing: var(--first-line-letter-spacing, var(--hero-first-line-letter-spacing, var(--surface-first-line-letter-spacing, var(--first-line-letter-spacing, inherit))));
225
+ --_first-line-text-indent: var(--first-line-indent, var(--hero-first-line-indent, var(--surface-first-line-indent, var(--first-line-indent, inherit))));
226
+ --_first-line-font-variant: var(--first-line-font-variant, var(--hero-first-line-font-variant, var(--surface-first-line-font-variant, var(--first-line-font-variant, inherit))));
227
+ --_first-line-text-align: var(--first-line-text-align, var(--hero-first-line-text-align, var(--surface-first-line-text-align, var(--first-line-text-align, inherit))));
228
+ --_first-letter-font-family: var(--first-letter-font-family, var(--hero-first-letter-font-family, var(--surface-first-letter-font-family, inherit)));
229
+ --_first-letter-text-transform: var(--first-letter-text-transform, var(--hero-first-letter-text-transform, var(--surface-first-letter-text-transform, inherit)));
230
+ --_first-letter-text-decoration: var(--first-letter-text-decoration, var(--hero-first-letter-text-decoration, var(--surface-first-letter-text-decoration, inherit)));
231
+ --_first-letter-font-size: var(--first-letter-font-size, var(--hero-first-letter-font-size, var(--surface-first-letter-font-size, inherit)));
232
+ --_first-letter-font-weight: var(--first-letter-font-weight, var(--hero-first-letter-font-weight, var(--surface-first-letter-font-weight, inherit)));
233
+ --_first-letter-line-height: var(--first-letter-line-height, var(--hero-first-letter-line-height, var(--surface-first-letter-line-height, inherit)));
234
+ --_first-letter-letter-spacing: var(--first-letter-letter-spacing, var(--hero-first-letter-letter-spacing, var(--surface-first-letter-letter-spacing, inherit)));
235
+ --_first-letter-text-indent: var(--first-letter-indent, var(--hero-first-letter-indent, var(--surface-first-letter-indent, inherit)));
236
+ --_first-letter-font-variant: var(--first-letter-font-variant, var(--hero-first-letter-font-variant, var(--surface-first-letter-font-variant, inherit)));
237
+ --_first-letter-text-align: var(--first-letter-text-align, var(--hero-first-letter-text-align, var(--surface-first-letter-text-align, inherit)));
238
+ --_first-letter-link-bg: var(--hero-link-bg, var(--surface-link-bg, inherit));
239
+ --_first-letter-link-fg: var(--hero-link-fg, var(--surface-link-fg, inherit));
240
+ --_first-letter-background: var(--hero-first-letter-bg, var(--first-letter-bg, inherit));
241
+ --_first-letter-color: var(--hero-first-letter-fg, var(--first-letter-fg, inherit));
242
+ /* Private context vars only -- consumed once, globally, by the :where()
243
+ rule in vars/typography-context.css, not by a selector matching h1-h6 here.
244
+ See the comment above heading-box-context-vars(). */
245
+ --_heading-max-width: var(--hero-line-width, var(--surface-line-width, var(--line-width, unset)));
246
+ /* Same as --_prose-margin-inline: start-aligned in a container, centred
247
+ only by TextLayout. */
248
+ --_heading-margin-inline: var(--hero-heading-margin-inline, var(--surface-heading-margin-inline, var(--heading-margin-inline, 0)));
249
+ --_heading-margin-bottom: var(--hero-heading-margin-bottom, var(--surface-heading-margin-bottom, var(--heading-margin-bottom, 0)));
250
+ --_heading-margin-top: var(--hero-heading-margin-top, var(--surface-heading-margin-top, var(--heading-margin-top, 1.5em)));
251
+ --_heading-first-margin-top: var(--hero-first-heading-margin-top, var(--surface-first-heading-margin-top, var(--first-heading-margin-top, 0)));
252
+ --_h1-color: var(--hero-heading-1-fg, var(--surface-heading-1-fg, var(--hero-heading-major-fg, var(--surface-heading-major-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-1-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
253
+ --_h1-background: var(--hero-heading-1-bg, var(--surface-heading-1-bg, var(--hero-heading-major-bg, var(--surface-heading-major-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-1-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
254
+ --_h1-padding: var(--hero-heading-1-padding, var(--surface-heading-1-padding, var(--hero-heading-major-padding, var(--surface-heading-major-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-1-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
255
+ --_h1-border: var(--hero-heading-1-border, var(--surface-heading-1-border, var(--hero-heading-major-border, var(--surface-heading-major-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-1-border, var(--heading-major-border, var(--heading-border, none)))))))));
256
+ --_h1-border-width: var(--hero-heading-1-border-width, var(--surface-heading-1-border-width, var(--hero-heading-major-border-width, var(--surface-heading-major-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-1-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
257
+ --_h1-border-style: var(--hero-heading-1-border-style, var(--surface-heading-1-border-style, var(--hero-heading-major-border-style, var(--surface-heading-major-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-1-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
258
+ --_h1-border-color: var(--hero-heading-1-border-color, var(--surface-heading-1-border-color, var(--hero-heading-major-border-color, var(--surface-heading-major-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-1-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
259
+ --_h1-border-radius: var(--hero-heading-1-border-radius, var(--surface-heading-1-border-radius, var(--hero-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-1-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
260
+ --_h1-box-shadow: var(--hero-heading-1-box-shadow, var(--surface-heading-1-box-shadow, var(--hero-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-1-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
261
+ --_h1-font-family: var(--hero-heading-1-font-family, var(--surface-heading-1-font-family, var(--hero-heading-major-font-family, var(--surface-heading-major-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-1-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
262
+ --_h1-text-transform: var(--hero-heading-1-text-transform, var(--surface-heading-1-text-transform, var(--hero-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-1-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
263
+ --_h1-text-decoration: var(--hero-heading-1-text-decoration, var(--surface-heading-1-text-decoration, var(--hero-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-1-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
264
+ --_h1-font-size: var(--hero-heading-1-font-size, var(--surface-heading-1-font-size, var(--hero-heading-major-font-size, var(--surface-heading-major-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-1-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
265
+ --_h1-font-weight: var(--hero-heading-1-font-weight, var(--surface-heading-1-font-weight, var(--hero-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-1-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
266
+ --_h1-line-height: var(--hero-heading-1-line-height, var(--surface-heading-1-line-height, var(--hero-heading-major-line-height, var(--surface-heading-major-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-1-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
267
+ --_h1-letter-spacing: var(--hero-heading-1-letter-spacing, var(--surface-heading-1-letter-spacing, var(--hero-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-1-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
268
+ --_h1-text-indent: var(--hero-heading-1-indent, var(--surface-heading-1-indent, var(--hero-heading-major-indent, var(--surface-heading-major-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-1-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
269
+ --_h1-font-variant: var(--hero-heading-1-font-variant, var(--surface-heading-1-font-variant, var(--hero-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-1-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
270
+ --_h1-text-align: var(--hero-heading-1-text-align, var(--surface-heading-1-text-align, var(--hero-heading-major-text-align, var(--surface-heading-major-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-1-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
271
+ --_h2-color: var(--hero-heading-2-fg, var(--surface-heading-2-fg, var(--hero-heading-major-fg, var(--surface-heading-major-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-2-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
272
+ --_h2-background: var(--hero-heading-2-bg, var(--surface-heading-2-bg, var(--hero-heading-major-bg, var(--surface-heading-major-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-2-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
273
+ --_h2-padding: var(--hero-heading-2-padding, var(--surface-heading-2-padding, var(--hero-heading-major-padding, var(--surface-heading-major-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-2-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
274
+ --_h2-border: var(--hero-heading-2-border, var(--surface-heading-2-border, var(--hero-heading-major-border, var(--surface-heading-major-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-2-border, var(--heading-major-border, var(--heading-border, none)))))))));
275
+ --_h2-border-width: var(--hero-heading-2-border-width, var(--surface-heading-2-border-width, var(--hero-heading-major-border-width, var(--surface-heading-major-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-2-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
276
+ --_h2-border-style: var(--hero-heading-2-border-style, var(--surface-heading-2-border-style, var(--hero-heading-major-border-style, var(--surface-heading-major-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-2-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
277
+ --_h2-border-color: var(--hero-heading-2-border-color, var(--surface-heading-2-border-color, var(--hero-heading-major-border-color, var(--surface-heading-major-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-2-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
278
+ --_h2-border-radius: var(--hero-heading-2-border-radius, var(--surface-heading-2-border-radius, var(--hero-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-2-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
279
+ --_h2-box-shadow: var(--hero-heading-2-box-shadow, var(--surface-heading-2-box-shadow, var(--hero-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-2-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
280
+ --_h2-font-family: var(--hero-heading-2-font-family, var(--surface-heading-2-font-family, var(--hero-heading-major-font-family, var(--surface-heading-major-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-2-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
281
+ --_h2-text-transform: var(--hero-heading-2-text-transform, var(--surface-heading-2-text-transform, var(--hero-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-2-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
282
+ --_h2-text-decoration: var(--hero-heading-2-text-decoration, var(--surface-heading-2-text-decoration, var(--hero-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-2-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
283
+ --_h2-font-size: var(--hero-heading-2-font-size, var(--surface-heading-2-font-size, var(--hero-heading-major-font-size, var(--surface-heading-major-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-2-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
284
+ --_h2-font-weight: var(--hero-heading-2-font-weight, var(--surface-heading-2-font-weight, var(--hero-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-2-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
285
+ --_h2-line-height: var(--hero-heading-2-line-height, var(--surface-heading-2-line-height, var(--hero-heading-major-line-height, var(--surface-heading-major-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-2-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
286
+ --_h2-letter-spacing: var(--hero-heading-2-letter-spacing, var(--surface-heading-2-letter-spacing, var(--hero-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-2-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
287
+ --_h2-text-indent: var(--hero-heading-2-indent, var(--surface-heading-2-indent, var(--hero-heading-major-indent, var(--surface-heading-major-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-2-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
288
+ --_h2-font-variant: var(--hero-heading-2-font-variant, var(--surface-heading-2-font-variant, var(--hero-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-2-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
289
+ --_h2-text-align: var(--hero-heading-2-text-align, var(--surface-heading-2-text-align, var(--hero-heading-major-text-align, var(--surface-heading-major-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-2-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
290
+ --_h3-color: var(--hero-heading-3-fg, var(--surface-heading-3-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-3-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
291
+ --_h3-background: var(--hero-heading-3-bg, var(--surface-heading-3-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-3-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
292
+ --_h3-padding: var(--hero-heading-3-padding, var(--surface-heading-3-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-3-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
293
+ --_h3-border: var(--hero-heading-3-border, var(--surface-heading-3-border, var(--hero-heading-border, var(--surface-heading-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-3-border, var(--heading-border, var(--heading-border, none)))))))));
294
+ --_h3-border-width: var(--hero-heading-3-border-width, var(--surface-heading-3-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-3-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
295
+ --_h3-border-style: var(--hero-heading-3-border-style, var(--surface-heading-3-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-3-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
296
+ --_h3-border-color: var(--hero-heading-3-border-color, var(--surface-heading-3-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-3-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
297
+ --_h3-border-radius: var(--hero-heading-3-border-radius, var(--surface-heading-3-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-3-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
298
+ --_h3-box-shadow: var(--hero-heading-3-box-shadow, var(--surface-heading-3-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-3-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
299
+ --_h3-font-family: var(--hero-heading-3-font-family, var(--surface-heading-3-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-3-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
300
+ --_h3-text-transform: var(--hero-heading-3-text-transform, var(--surface-heading-3-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-3-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
301
+ --_h3-text-decoration: var(--hero-heading-3-text-decoration, var(--surface-heading-3-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-3-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
302
+ --_h3-font-size: var(--hero-heading-3-font-size, var(--surface-heading-3-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-3-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
303
+ --_h3-font-weight: var(--hero-heading-3-font-weight, var(--surface-heading-3-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-3-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
304
+ --_h3-line-height: var(--hero-heading-3-line-height, var(--surface-heading-3-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-3-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
305
+ --_h3-letter-spacing: var(--hero-heading-3-letter-spacing, var(--surface-heading-3-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-3-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
306
+ --_h3-text-indent: var(--hero-heading-3-indent, var(--surface-heading-3-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-3-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
307
+ --_h3-font-variant: var(--hero-heading-3-font-variant, var(--surface-heading-3-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-3-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
308
+ --_h3-text-align: var(--hero-heading-3-text-align, var(--surface-heading-3-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-3-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
309
+ --_h4-color: var(--hero-heading-4-fg, var(--surface-heading-4-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-4-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
310
+ --_h4-background: var(--hero-heading-4-bg, var(--surface-heading-4-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-4-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
311
+ --_h4-padding: var(--hero-heading-4-padding, var(--surface-heading-4-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-4-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
312
+ --_h4-border: var(--hero-heading-4-border, var(--surface-heading-4-border, var(--hero-heading-border, var(--surface-heading-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-4-border, var(--heading-border, var(--heading-border, none)))))))));
313
+ --_h4-border-width: var(--hero-heading-4-border-width, var(--surface-heading-4-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-4-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
314
+ --_h4-border-style: var(--hero-heading-4-border-style, var(--surface-heading-4-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-4-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
315
+ --_h4-border-color: var(--hero-heading-4-border-color, var(--surface-heading-4-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-4-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
316
+ --_h4-border-radius: var(--hero-heading-4-border-radius, var(--surface-heading-4-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-4-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
317
+ --_h4-box-shadow: var(--hero-heading-4-box-shadow, var(--surface-heading-4-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-4-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
318
+ --_h4-font-family: var(--hero-heading-4-font-family, var(--surface-heading-4-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-4-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
319
+ --_h4-text-transform: var(--hero-heading-4-text-transform, var(--surface-heading-4-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-4-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
320
+ --_h4-text-decoration: var(--hero-heading-4-text-decoration, var(--surface-heading-4-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-4-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
321
+ --_h4-font-size: var(--hero-heading-4-font-size, var(--surface-heading-4-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-4-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
322
+ --_h4-font-weight: var(--hero-heading-4-font-weight, var(--surface-heading-4-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-4-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
323
+ --_h4-line-height: var(--hero-heading-4-line-height, var(--surface-heading-4-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-4-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
324
+ --_h4-letter-spacing: var(--hero-heading-4-letter-spacing, var(--surface-heading-4-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-4-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
325
+ --_h4-text-indent: var(--hero-heading-4-indent, var(--surface-heading-4-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-4-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
326
+ --_h4-font-variant: var(--hero-heading-4-font-variant, var(--surface-heading-4-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-4-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
327
+ --_h4-text-align: var(--hero-heading-4-text-align, var(--surface-heading-4-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-4-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
328
+ --_h5-color: var(--hero-heading-5-fg, var(--surface-heading-5-fg, var(--hero-heading-minor-fg, var(--surface-heading-minor-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-5-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
329
+ --_h5-background: var(--hero-heading-5-bg, var(--surface-heading-5-bg, var(--hero-heading-minor-bg, var(--surface-heading-minor-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-5-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
330
+ --_h5-padding: var(--hero-heading-5-padding, var(--surface-heading-5-padding, var(--hero-heading-minor-padding, var(--surface-heading-minor-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-5-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
331
+ --_h5-border: var(--hero-heading-5-border, var(--surface-heading-5-border, var(--hero-heading-minor-border, var(--surface-heading-minor-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-5-border, var(--heading-minor-border, var(--heading-border, none)))))))));
332
+ --_h5-border-width: var(--hero-heading-5-border-width, var(--surface-heading-5-border-width, var(--hero-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-5-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
333
+ --_h5-border-style: var(--hero-heading-5-border-style, var(--surface-heading-5-border-style, var(--hero-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-5-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
334
+ --_h5-border-color: var(--hero-heading-5-border-color, var(--surface-heading-5-border-color, var(--hero-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-5-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
335
+ --_h5-border-radius: var(--hero-heading-5-border-radius, var(--surface-heading-5-border-radius, var(--hero-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-5-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
336
+ --_h5-box-shadow: var(--hero-heading-5-box-shadow, var(--surface-heading-5-box-shadow, var(--hero-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-5-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
337
+ --_h5-font-family: var(--hero-heading-5-font-family, var(--surface-heading-5-font-family, var(--hero-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-5-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
338
+ --_h5-text-transform: var(--hero-heading-5-text-transform, var(--surface-heading-5-text-transform, var(--hero-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-5-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
339
+ --_h5-text-decoration: var(--hero-heading-5-text-decoration, var(--surface-heading-5-text-decoration, var(--hero-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-5-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
340
+ --_h5-font-size: var(--hero-heading-5-font-size, var(--surface-heading-5-font-size, var(--hero-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-5-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
341
+ --_h5-font-weight: var(--hero-heading-5-font-weight, var(--surface-heading-5-font-weight, var(--hero-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-5-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
342
+ --_h5-line-height: var(--hero-heading-5-line-height, var(--surface-heading-5-line-height, var(--hero-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-5-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
343
+ --_h5-letter-spacing: var(--hero-heading-5-letter-spacing, var(--surface-heading-5-letter-spacing, var(--hero-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-5-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
344
+ --_h5-text-indent: var(--hero-heading-5-indent, var(--surface-heading-5-indent, var(--hero-heading-minor-indent, var(--surface-heading-minor-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-5-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
345
+ --_h5-font-variant: var(--hero-heading-5-font-variant, var(--surface-heading-5-font-variant, var(--hero-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-5-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
346
+ --_h5-text-align: var(--hero-heading-5-text-align, var(--surface-heading-5-text-align, var(--hero-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-5-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
347
+ --_h6-color: var(--hero-heading-6-fg, var(--surface-heading-6-fg, var(--hero-heading-minor-fg, var(--surface-heading-minor-fg, var(--hero-heading-fg, var(--surface-heading-fg, var(--heading-6-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
348
+ --_h6-background: var(--hero-heading-6-bg, var(--surface-heading-6-bg, var(--hero-heading-minor-bg, var(--surface-heading-minor-bg, var(--hero-heading-bg, var(--surface-heading-bg, var(--heading-6-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
349
+ --_h6-padding: var(--hero-heading-6-padding, var(--surface-heading-6-padding, var(--hero-heading-minor-padding, var(--surface-heading-minor-padding, var(--hero-heading-padding, var(--surface-heading-padding, var(--heading-6-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
350
+ --_h6-border: var(--hero-heading-6-border, var(--surface-heading-6-border, var(--hero-heading-minor-border, var(--surface-heading-minor-border, var(--hero-heading-border, var(--surface-heading-border, var(--heading-6-border, var(--heading-minor-border, var(--heading-border, none)))))))));
351
+ --_h6-border-width: var(--hero-heading-6-border-width, var(--surface-heading-6-border-width, var(--hero-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--hero-heading-border-width, var(--surface-heading-border-width, var(--heading-6-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
352
+ --_h6-border-style: var(--hero-heading-6-border-style, var(--surface-heading-6-border-style, var(--hero-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--hero-heading-border-style, var(--surface-heading-border-style, var(--heading-6-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
353
+ --_h6-border-color: var(--hero-heading-6-border-color, var(--surface-heading-6-border-color, var(--hero-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--hero-heading-border-color, var(--surface-heading-border-color, var(--heading-6-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
354
+ --_h6-border-radius: var(--hero-heading-6-border-radius, var(--surface-heading-6-border-radius, var(--hero-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--hero-heading-border-radius, var(--surface-heading-border-radius, var(--heading-6-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
355
+ --_h6-box-shadow: var(--hero-heading-6-box-shadow, var(--surface-heading-6-box-shadow, var(--hero-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--hero-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-6-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
356
+ --_h6-font-family: var(--hero-heading-6-font-family, var(--surface-heading-6-font-family, var(--hero-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--hero-heading-font-family, var(--surface-heading-font-family, var(--heading-6-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
357
+ --_h6-text-transform: var(--hero-heading-6-text-transform, var(--surface-heading-6-text-transform, var(--hero-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--hero-heading-text-transform, var(--surface-heading-text-transform, var(--heading-6-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
358
+ --_h6-text-decoration: var(--hero-heading-6-text-decoration, var(--surface-heading-6-text-decoration, var(--hero-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--hero-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-6-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
359
+ --_h6-font-size: var(--hero-heading-6-font-size, var(--surface-heading-6-font-size, var(--hero-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--hero-heading-font-size, var(--surface-heading-font-size, var(--heading-6-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
360
+ --_h6-font-weight: var(--hero-heading-6-font-weight, var(--surface-heading-6-font-weight, var(--hero-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--hero-heading-font-weight, var(--surface-heading-font-weight, var(--heading-6-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
361
+ --_h6-line-height: var(--hero-heading-6-line-height, var(--surface-heading-6-line-height, var(--hero-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--hero-heading-line-height, var(--surface-heading-line-height, var(--heading-6-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
362
+ --_h6-letter-spacing: var(--hero-heading-6-letter-spacing, var(--surface-heading-6-letter-spacing, var(--hero-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--hero-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-6-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
363
+ --_h6-text-indent: var(--hero-heading-6-indent, var(--surface-heading-6-indent, var(--hero-heading-minor-indent, var(--surface-heading-minor-indent, var(--hero-heading-indent, var(--surface-heading-indent, var(--heading-6-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
364
+ --_h6-font-variant: var(--hero-heading-6-font-variant, var(--surface-heading-6-font-variant, var(--hero-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--hero-heading-font-variant, var(--surface-heading-font-variant, var(--heading-6-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
365
+ --_h6-text-align: var(--hero-heading-6-text-align, var(--surface-heading-6-text-align, var(--hero-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--hero-heading-text-align, var(--surface-heading-text-align, var(--heading-6-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
453
366
  display: grid;
454
367
  place-content: center;
455
368
  width: var(--hero-width, 100%);