### WordPress Typography and Theme Defaults

Source: https://context7_llms

Defines base typography styles for the WordPress body, headings, and links. This includes font families, sizes, weights, line heights, and link decoration.

```CSS
body {
  background-color: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--manrope);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 300;
  letter-spacing: -0.1px;
  line-height: 1.4;
  --wp--style--root--padding-top: 0px;
  --wp--style--root--padding-right: var(--wp--preset--spacing--50);
  --wp--style--root--padding-bottom: 0px;
  --wp--style--root--padding-left: var(--wp--preset--spacing--50);
}
a:where(:not(.wp-element-button)) {
  color: currentColor;
  text-decoration: underline;
}
:root :where(a:where(:not(.wp-element-button))):hover {
  text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  letter-spacing: -0.1px;
  line-height: 1.125;
}
h1 {
  font-size: var(--wp--preset--font-size--xx-large);
}
h2 {
  font-size: var(--wp--preset--font-size--x-large);
}
h3 {
  font-size: var(--wp--preset--font-size--large);
}
h4 {
  font-size: var(--wp--preset--font-size--medium);
}
h5 {
  font-size: var(--wp--preset--font-size--small);
  letter-spacing: 0.5px;
}
h6 {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}
```

--------------------------------

### WordPress Global Padding and Layout Classes

Source: https://context7_llms

Defines CSS classes for managing global padding and responsive layout behavior within WordPress. These classes control spacing and how elements adapt to different screen sizes and container types.

```CSS
.locks { padding-top: var(--wp--style--root--padding-top); padding-bottom: var(--wp--style--root--padding-bottom); }
.has-global-padding { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); }
.has-global-padding > .alignfull { margin-right: calc(var(--wp--style--root--padding-right) * -1); margin-left: calc(var(--wp--style--root--padding-left) * -1); }
.has-global-padding :where(:not(.alignfull.is-layout-flow) > .has-global-padding:not(.wp-block-block, .alignfull)) { padding-right: 0; padding-left: 0; }
.has-global-padding :where(:not(.alignfull.is-layout-flow) > .has-global-padding:not(.wp-block-block, .alignfull)) > .alignfull { margin-left: 0; margin-right: 0; }
```

--------------------------------

### WordPress Layout Flow and Constrained Styles

Source: https://context7_llms

CSS rules for managing block layout, including flow, constrained, flex, and grid layouts. These styles define spacing, alignment, and maximum widths for content within WordPress.

```CSS
:where(.wp-site-blocks) > * { margin-block-start: 1.2rem; margin-block-end: 0; }
:where(.wp-site-blocks) > :first-child { margin-block-start: 0; }
:where(.wp-site-blocks) > :last-child { margin-block-end: 0; }
:root { --wp--style--block-gap: 1.2rem; }
:root :where(.is-layout-flow) > :first-child{margin-block-start: 0;}
:root :where(.is-layout-flow) > :last-child{margin-block-end: 0;}
:root :where(.is-layout-flow) > *{margin-block-start: 1.2rem;margin-block-end: 0;}
:root :where(.is-layout-constrained) > :first-child{margin-block-start: 0;}
:root :where(.is-layout-constrained) > :last-child{margin-block-end: 0;}
:root :where(.is-layout-constrained) > *{margin-block-start: 1.2rem;margin-block-end: 0;}
:root :where(.is-layout-flex){gap: 1.2rem;}
:root :where(.is-layout-grid){gap: 1.2rem;}
.is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}
.is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}
.is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}
.is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}
.is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}
.is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}
.is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}
.is-layout-flex{display: flex;}
.is-layout-flex{flex-wrap: wrap;align-items: center;}
.is-layout-flex > :is(*, div){margin: 0;}
.is-layout-grid{display: grid;}
.is-layout-grid > :is(*, div){margin: 0;}
```

--------------------------------

### WordPress Color Utility Classes

Source: https://context7_llms

Utility classes for applying specific colors to text elements. These classes allow for quick color overrides using predefined theme color variables.

```CSS
.has-black-color {
  color: var(--wp--preset--color--black) !important;
}
.has-cyan-bluish-gray-color {
  color: var(--wp--preset--color--c
```

--------------------------------

### WordPress Button Styling

Source: https://context7_llms

Styles for WordPress buttons, including default appearance, hover states, and focus outlines. These rules ensure consistent button design across the site.

```CSS
:root :where(.wp-element-button, .wp-block-button__link) {
  background-color: var(--wp--preset--color--contrast);
  border-width: 0;
  color: var(--wp--preset--color--base);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  line-height: inherit;
  padding-top: 1rem;
  padding-right: 2.25rem;
  padding-bottom: 1rem;
  padding-left: 2.25rem;
  text-decoration: none;
}
:root :where(.wp-element-button:hover, .wp-block-button__link:hover) {
  background-color: color-mix(in srgb, var(--wp--preset--color--contrast) 85%, transparent);
  border-color: transparent;
  color: var(--wp--preset--color--base);
}
:root :where(.wp-element-button:focus, .wp-block-button__link:focus) {
  outline-color: var(--wp--preset--color--accent-4);
  outline-offset: 2px;
}
```

--------------------------------

### WordPress Element Alignment Classes

Source: https://context7_llms

Provides CSS classes for aligning elements within the WordPress content flow. These include left, right, and center alignment for blocks and images, respecting layout constraints.

```CSS
.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }
.wp-site-blocks > .alignright { float: right; margin-left: 2em; }
.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }
```

--------------------------------

### WordPress Caption and Figcaption Styling

Source: https://context7_llms

Styles for captions associated with media elements like images, galleries, audio, video, and tables. Ensures captions are readable and consistently styled.

```CSS
:root :where(.wp-element-caption, .wp-block-audio figcaption, .wp-block-embed figcaption, .wp-block-gallery figcaption, .wp-block-image figcaption, .wp-block-table figcaption) {
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.4;
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.