WordPress.org
Get WordPress

Make WordPress Core

Changeset 49726 for trunk


Ignore:
Timestamp:
12/01/2020 07:07:43 PM (4 years ago)
Author:
desrosj
Message:

Twenty Twenty-One: Sync the latest changes for 5.6 RC2.

This will be the final sync from GitHub before placing that repository into read-only mode. All further changes should now flow entirely through Trac.

For a full list of changes since [49633], see ​https://github.com/WordPress/twentytwentyone/compare/1d5a895...53acd9b.

Props poena, luminuu, kjellr, ryelle, allancole, melchoyce, felipeelia, aljullu, kebbet, chaton666, Clorith, mkaz, ingereck, paaljoachim.
See #51526.

Location:
trunk/src/wp-content/themes/twentytwentyone
Files:
1 deleted
44 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-content/themes/twentytwentyone/assets/css/ie-editor.css

    r49633 r49726  
    99
    1010    /* Font Family */
     11    --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
     12    --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
    1113
    1214    /* Font Size */
     15    --global--font-size-base: 1.25rem;
     16    --global--font-size-xs: 1rem;
     17    --global--font-size-sm: 1.125rem;
     18    --global--font-size-md: 1.25rem;
     19    --global--font-size-lg: 1.5rem;
     20    --global--font-size-xl: 2.25rem;
     21    --global--font-size-xxl: 4rem;
     22    --global--font-size-xxxl: 5rem;
     23    --global--font-size-page-title: var(--global--font-size-xxl);
     24    --global--letter-spacing: normal;
    1325
    1426    /* Line Height */
     27    --global--line-height-body: 1.7;
     28    --global--line-height-heading: 1.3;
     29    --global--line-height-page-title: 1.1;
    1530
    1631    /* Headings */
     32    --heading--font-family: var(--global--font-primary);
     33    --heading--font-size-h6: var(--global--font-size-xs);
     34    --heading--font-size-h5: var(--global--font-size-sm);
     35    --heading--font-size-h4: var(--global--font-size-lg);
     36    --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
     37    --heading--font-size-h2: var(--global--font-size-xl);
     38    --heading--font-size-h1: var(--global--font-size-page-title);
     39    --heading--letter-spacing-h6: 0.05em;
     40    --heading--letter-spacing-h5: 0.05em;
     41    --heading--letter-spacing-h4: var(--global--letter-spacing);
     42    --heading--letter-spacing-h3: var(--global--letter-spacing);
     43    --heading--letter-spacing-h2: var(--global--letter-spacing);
     44    --heading--letter-spacing-h1: var(--global--letter-spacing);
     45    --heading--line-height-h6: var(--global--line-height-heading);
     46    --heading--line-height-h5: var(--global--line-height-heading);
     47    --heading--line-height-h4: var(--global--line-height-heading);
     48    --heading--line-height-h3: var(--global--line-height-heading);
     49    --heading--line-height-h2: var(--global--line-height-heading);
     50    --heading--line-height-h1: var(--global--line-height-page-title);
     51    --heading--font-weight: normal;
     52    --heading--font-weight-page-title: 300;
     53    --heading--font-weight-strong: 600;
    1754
    1855    /* Block: Latest posts */
     56    --latest-posts--title-font-family: var(--heading--font-family);
     57    --latest-posts--title-font-size: var(--heading--font-size-h3);
     58    --latest-posts--description-font-family: var(--global--font-secondary);
     59    --latest-posts--description-font-size: var(--global--font-size-sm);
     60    --list--font-family: var(--global--font-secondary);
     61    --definition-term--font-family: var(--global--font-primary);
    1962
    2063    /* Colors */
     64    --global--color-black: #000;
     65    --global--color-dark-gray: #28303d;
     66    --global--color-gray: #39414d;
     67    --global--color-light-gray: #f0f0f0;
     68    --global--color-green: #d1e4dd;
     69    --global--color-blue: #d1dfe4;
     70    --global--color-purple: #d1d1e4;
     71    --global--color-red: #e4d1d1;
     72    --global--color-orange: #e4dad1;
     73    --global--color-yellow: #eeeadd;
     74    --global--color-white: #fff;
     75    --global--color-white-50: rgba(255, 255, 255, 0.5);
     76    --global--color-white-90: rgba(255, 255, 255, 0.9);
     77    --global--color-primary: var(--global--color-dark-gray);
    2178
    2279    /* Body text color, site title, footer text color. */
     80    --global--color-secondary: var(--global--color-gray);
    2381
    2482    /* Headings */
     83    --global--color-primary-hover: var(--global--color-primary);
     84    --global--color-background: var(--global--color-green);
    2585
    2686    /* Mint, default body background */
     87    --global--color-border: var(--global--color-primary);
    2788
    2889    /* Used for borders (separators) */
    2990
    3091    /* Spacing */
     92    --global--spacing-unit: 20px;
     93    --global--spacing-measure: unset;
     94    --global--spacing-horizontal: 25px;
     95    --global--spacing-vertical: 30px;
    3196
    3297    /* Elevation */
     98    --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
    3399
    34100    /* Forms */
     101    --form--font-family: var(--global--font-secondary);
     102    --form--font-size: var(--global--font-size-sm);
     103    --form--line-height: var(--global--line-height-body);
     104    --form--color-text: var(--global--color-dark-gray);
     105    --form--color-ranged: var(--global--color-secondary);
     106    --form--label-weight: 500;
     107    --form--border-color: var(--global--color-secondary);
     108    --form--border-width: 3px;
     109    --form--border-radius: 0;
     110    --form--spacing-unit: calc(0.5 * var(--global--spacing-unit));
    35111
    36112    /* Cover block */
     113    --cover--height: calc(15 * var(--global--spacing-vertical));
     114    --cover--color-foreground: var(--global--color-white);
     115    --cover--color-background: var(--global--color-black);
    37116
    38117    /* Buttons */
     118    --button--color-text: var(--global--color-background);
     119    --button--color-text-hover: var(--global--color-secondary);
     120    --button--color-text-active: var(--global--color-secondary);
     121    --button--color-background: var(--global--color-secondary);
     122    --button--color-background-active: var(--global--color-background);
     123    --button--font-family: var(--global--font-primary);
     124    --button--font-size: var(--global--font-size-base);
     125    --button--font-weight: 500;
     126    --button--line-height: 1.5;
     127    --button--border-width: 3px;
     128    --button--border-radius: 0;
     129    --button--padding-vertical: 15px;
     130    --button--padding-horizontal: calc(2 * var(--button--padding-vertical));
    39131
    40132    /* entry */
     133    --entry-header--color: var(--global--color-primary);
     134    --entry-header--color-link: currentColor;
     135    --entry-header--color-hover: var(--global--color-primary-hover);
     136    --entry-header--color-focus: var(--global--color-secondary);
     137    --entry-header--font-size: var(--heading--font-size-h2);
     138    --entry-content--font-family: var(--global--font-secondary);
     139    --entry-author-bio--font-family: var(--heading--font-family);
     140    --entry-author-bio--font-size: var(--heading--font-size-h4);
    41141
    42142    /* Header */
     143    --branding--color-text: var(--global--color-primary);
     144    --branding--color-link: var(--global--color-primary);
     145    --branding--color-link-hover: var(--global--color-secondary);
     146    --branding--title--font-family: var(--global--font-primary);
     147    --branding--title--font-size: var(--global--font-size-lg);
     148    --branding--title--font-size-mobile: var(--heading--font-size-h4);
     149    --branding--title--font-weight: normal;
     150    --branding--title--text-transform: uppercase;
     151    --branding--description--font-family: var(--global--font-secondary);
     152    --branding--description--font-size: var(--global--font-size-sm);
     153    --branding--description--font-family: var(--global--font-secondary);
     154    --branding--logo--max-width: 300px;
     155    --branding--logo--max-height: 100px;
     156    --branding--logo--max-width-mobile: 96px;
     157    --branding--logo--max-height-mobile: 96px;
    43158
    44159    /* Main navigation */
     160    --primary-nav--font-family: var(--global--font-secondary);
     161    --primary-nav--font-family-mobile: var(--global--font-primary);
     162    --primary-nav--font-size: var(--global--font-size-md);
     163    --primary-nav--font-size-sub-menu: var(--global--font-size-xs);
     164    --primary-nav--font-size-mobile: var(--global--font-size-sm);
     165    --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);
     166    --primary-nav--font-size-button: var(--global--font-size-xs);
     167    --primary-nav--font-style: normal;
     168    --primary-nav--font-style-sub-menu-mobile: normal;
     169    --primary-nav--font-weight: normal;
     170    --primary-nav--font-weight-button: 500;
     171    --primary-nav--color-link: var(--global--color-primary);
     172    --primary-nav--color-link-hover: var(--global--color-primary-hover);
     173    --primary-nav--color-text: var(--global--color-primary);
     174    --primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
     175    --primary-nav--border-color: var(--global--color-primary);
    45176
    46177    /* Pagination */
     178    --pagination--color-text: var(--global--color-primary);
     179    --pagination--color-link-hover: var(--global--color-primary-hover);
     180    --pagination--font-family: var(--global--font-secondary);
     181    --pagination--font-size: var(--global--font-size-lg);
     182    --pagination--font-weight: normal;
     183    --pagination--font-weight-strong: 600;
    47184
    48185    /* Footer */
     186    --footer--color-text: var(--global--color-primary);
     187    --footer--color-link: var(--global--color-primary);
     188    --footer--color-link-hover: var(--global--color-primary-hover);
     189    --footer--font-family: var(--global--font-primary);
     190    --footer--font-size: var(--global--font-size-sm);
    49191
    50192    /* Block: Pull quote */
     193    --pullquote--font-family: var(--global--font-primary);
     194    --pullquote--font-size: var(--heading--font-size-h3);
     195    --pullquote--font-style: normal;
     196    --pullquote--letter-spacing: var(--heading--letter-spacing-h4);
     197    --pullquote--line-height: var(--global--line-height-heading);
     198    --pullquote--border-width: 3px;
     199    --pullquote--border-color: var(--global--color-primary);
     200    --pullquote--color-foreground: var(--global--color-primary);
     201    --pullquote--color-background: var(--global--color-background);
     202    --quote--font-family: var(--global--font-secondary);
     203    --quote--font-size: var(--global--font-size-md);
     204    --quote--font-size-large: var(--global--font-size-xl);
     205    --quote--font-style: normal;
     206    --quote--font-weight: 700;
     207    --quote--font-weight-strong: bolder;
     208    --quote--font-style-large: normal;
     209    --quote--font-style-cite: normal;
     210    --quote--line-height: var(--global--line-height-body);
     211    --quote--line-height-large: 1.35;
     212    --separator--border-color: var(--global--color-border);
     213    --separator--height: 1px;
    51214
    52215    /* Block: Table */
     216    --table--stripes-border-color: var(--global--color-light-gray);
     217    --table--stripes-background-color: var(--global--color-light-gray);
     218    --table--has-background-text-color: var(--global--color-dark-gray);
    53219
    54220    /* Widgets */
     221    --widget--line-height-list: 1.9;
     222    --widget--line-height-title: 1.4;
     223    --widget--font-weight-title: 700;
     224    --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit));
    55225
    56226    /* Admin-bar height */
     227    --global--admin-bar--height: 0;
     228}
     229
     230.admin-bar {
     231    --global--admin-bar--height: 32px;
     232}
     233@media only screen and (max-width: 782px) {
     234
     235    .admin-bar {
     236        --global--admin-bar--height: 46px;
     237    }
     238}
     239
     240@media only screen and (min-width: 652px) {
     241
     242    :root {
     243        --global--font-size-xl: 2.5rem;
     244        --global--font-size-xxl: 6rem;
     245        --global--font-size-xxxl: 9rem;
     246        --heading--font-size-h3: 2rem;
     247        --heading--font-size-h2: 3rem;
     248    }
    57249}
    58250
    … …  
    68260 * Root Media Query Variables
    69261 */
     262:root {
     263    --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6);
     264    --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal));
     265    --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal));
     266    --responsive--alignfull-width: 100%;
     267    --responsive--alignright-margin: var(--global--spacing-horizontal);
     268    --responsive--alignleft-margin: var(--global--spacing-horizontal);
     269}
     270
     271@media only screen and (min-width: 482px) {
     272
     273    :root {
     274        --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), 610px);
     275        --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal));
     276        --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
     277        --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
     278    }
     279}
     280@media only screen and (min-width: 822px) {
     281
     282    :root {
     283        --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 610px);
     284        --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1240px);
     285    }
     286}
    70287
    71288/**
    … …  
    73290 */
    74291.default-max-width {
    75     max-width: calc(100vw - 30px);
     292    max-width: var(--responsive--aligndefault-width);
    76293    margin-left: auto;
    77294    margin-right: auto;
    78295}
    79 @media only screen and (min-width: 482px) {
    80 
    81     .default-max-width {
    82         max-width: min(calc(100vw - 100px), 610px);
    83     }
    84 }
    85 @media only screen and (min-width: 822px) {
    86 
    87     .default-max-width {
    88         max-width: min(calc(100vw - 200px), 610px);
    89     }
    90 }
    91296
    92297.wide-max-width {
    93     max-width: calc(100vw - 30px);
     298    max-width: var(--responsive--alignwide-width);
    94299    margin-left: auto;
    95300    margin-right: auto;
    … …  
    98303@media only screen and (min-width: 482px) {
    99304
    100     .wide-max-width {
    101         max-width: calc(100vw - 100px);
    102     }
    103 }
    104 
    105 @media only screen and (min-width: 822px) {
    106 
    107     .wide-max-width {
    108         max-width: min(calc(100vw - 200px), 1240px);
    109     }
    110 }
    111 
    112 @media only screen and (min-width: 482px) {
    113 
    114305    .full-max-width {
    115         max-width: 100%;
     306        max-width: var(--responsive--alignfull-width);
    116307        width: auto;
    117308        margin-left: auto;
    … …  
    123314    padding: 0;
    124315    position: relative;
    125     margin: 30px 0 30px 25px;
     316    margin: var(--global--spacing-vertical) 0 var(--global--spacing-vertical) var(--global--spacing-horizontal);
    126317}
    127318
    128319blockquote > * {
    129     margin-top: 20px;
    130     margin-bottom: 20px;
     320    margin-top: var(--global--spacing-unit);
     321    margin-bottom: var(--global--spacing-unit);
    131322}
    132323
    … …  
    140331
    141332blockquote p {
    142     letter-spacing: normal;
    143     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    144     font-size: 1.25rem;
    145     font-style: normal;
    146     font-weight: 700;
    147     line-height: 1.7;
    148 }
    149 
    150 blockquote cite {
    151     font-weight: normal;
    152     color: #28303d;
    153     font-size: 1rem;
    154     letter-spacing: normal;
    155 }
    156 
     333    letter-spacing: var(--heading--letter-spacing-h4);
     334    font-family: var(--quote--font-family);
     335    font-size: var(--quote--font-size);
     336    font-style: var(--quote--font-style);
     337    font-weight: var(--quote--font-weight);
     338    line-height: var(--quote--line-height);
     339}
     340
     341blockquote cite,
    157342blockquote footer {
    158343    font-weight: normal;
    159     color: #28303d;
    160     font-size: 1rem;
    161     letter-spacing: normal;
     344    color: var(--global--color-primary);
     345    font-size: var(--global--font-size-xs);
     346    letter-spacing: var(--global--letter-spacing);
    162347}
    163348
    … …  
    167352}
    168353
    169 blockquote.alignleft p {
    170     font-size: 1.125rem;
     354blockquote.alignleft p,
     355blockquote.alignright p {
     356    font-size: var(--heading--font-size-h5);
    171357    max-width: inherit;
    172358    width: inherit;
    173359}
    174360
    175 blockquote.alignright p {
    176     font-size: 1.125rem;
    177     max-width: inherit;
    178     width: inherit;
    179 }
    180 
    181 blockquote.alignleft cite {
    182     font-size: 1rem;
    183     letter-spacing: normal;
    184 }
    185 
    186 blockquote.alignleft footer {
    187     font-size: 1rem;
    188     letter-spacing: normal;
    189 }
    190 
    191 blockquote.alignright cite {
    192     font-size: 1rem;
    193     letter-spacing: normal;
    194 }
    195 
     361blockquote.alignleft cite,
     362blockquote.alignleft footer,
     363blockquote.alignright cite,
    196364blockquote.alignright footer {
    197     font-size: 1rem;
    198     letter-spacing: normal;
     365    font-size: var(--global--font-size-xs);
     366    letter-spacing: var(--global--letter-spacing);
    199367}
    200368
    201369blockquote strong {
    202     font-weight: bolder;
     370    font-weight: var(--quote--font-weight-strong);
    203371}
    204372
    205373blockquote:before {
    206374    content: "“";
    207     font-size: 1.25rem;
    208     line-height: 1.7;
    209 }
    210 
    211 blockquote .wp-block-quote__citation {
    212     color: #28303d;
    213     font-size: 1rem;
    214     font-style: normal;
    215 }
    216 
    217 blockquote cite {
    218     color: #28303d;
    219     font-size: 1rem;
    220     font-style: normal;
    221 }
    222 
     375    font-size: var(--quote--font-size);
     376    line-height: var(--quote--line-height);
     377    position: absolute;
     378    left: calc(-0.5 * var(--global--spacing-horizontal));
     379}
     380
     381blockquote .wp-block-quote__citation,
     382blockquote cite,
    223383blockquote footer {
    224     color: #28303d;
    225     font-size: 1rem;
    226     font-style: normal;
     384    color: var(--global--color-primary);
     385    font-size: var(--global--font-size-xs);
     386    font-style: var(--quote--font-style-cite);
    227387}
    228388@media only screen and (max-width: 481px) {
    229389
    230390    blockquote {
    231         padding-left: 13px;
     391        padding-left: calc(0.5 * var(--global--spacing-horizontal));
    232392    }
    233393
    … …  
    257417
    258418/* Media captions */
    259 figcaption {
     419figcaption,
     420.wp-caption,
     421.wp-caption-text,
     422.wp-block-embed figcaption {
    260423    color: currentColor;
    261     font-size: 1rem;
    262     line-height: 1.7;
    263     margin-top: 10px;
    264     margin-bottom: 20px;
    265     text-align: center;
    266 }
    267 
    268 .wp-caption {
    269     color: currentColor;
    270     font-size: 1rem;
    271     line-height: 1.7;
    272     margin-top: 10px;
    273     margin-bottom: 20px;
    274     text-align: center;
    275 }
    276 
    277 .wp-caption-text {
    278     color: currentColor;
    279     font-size: 1rem;
    280     line-height: 1.7;
    281     margin-top: 10px;
    282     margin-bottom: 20px;
     424    font-size: var(--global--font-size-xs);
     425    line-height: var(--global--line-height-body);
     426    margin-top: calc(0.5 * var(--global--spacing-unit));
     427    margin-bottom: var(--global--spacing-unit);
    283428    text-align: center;
    284429}
    … …  
    289434.alignright .wp-caption,
    290435.alignleft .wp-caption-text,
    291 .alignright .wp-caption-text {
     436.alignright .wp-caption-text,
     437.alignleft .wp-block-embed figcaption,
     438.alignright .wp-block-embed figcaption {
    292439    margin-bottom: 0;
    293440}
    … …  
    304451
    305452select {
    306     border: 3px solid #39414d;
    307     border-radius: 0;
    308     color: #28303d;
    309     font-size: 1.125rem;
     453    border: var(--form--border-width) solid var(--form--border-color);
     454    border-radius: var(--form--border-radius);
     455    color: var(--form--color-text);
     456    font-size: var(--form--font-size);
    310457    -moz-appearance: none;
    311458    -webkit-appearance: none;
    312459    appearance: none;
    313     padding: 10px 30px 10px 10px;
    314     background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
    315     background-position: right 10px top 60%;
     460    padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit);
     461    background: var(--global--color-white) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
     462    background-position: right var(--form--spacing-unit) top 60%;
    316463}
    317464
    … …  
    323470a {
    324471    cursor: pointer;
    325     color: #28303d;
     472    color: var(--wp--style--color--link, var(--global--color-primary));
    326473    text-underline-offset: 3px;
    327474    text-decoration-skip-ink: all;
    … …  
    333480}
    334481
    335 .site a:focus {
     482.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    336483
    337484    /* Only visible in Windows High Contrast mode */
    338485    outline: 2px solid transparent;
     486    text-decoration: underline 1px dotted currentColor;
     487    text-decoration-skip-ink: none;
    339488    background: rgba(255, 255, 255, 0.9);
    340489}
    341490
    342 .is-dark-theme .site a:focus {
    343     color: #d1e4dd;
    344 }
    345 
    346 .is-dark-theme .site a:focus .meta-nav {
    347     color: #d1e4dd;
    348 }
    349 
    350 .has-background-white .site a:focus {
     491.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     492.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
     493    color: var(--wp--style--color--link, var(--global--color-background));
     494}
     495
     496.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    351497    background: rgba(0, 0, 0, 0.9);
    352     color: #fff;
    353 }
    354 
    355 .has-background-white .site a:focus .meta-nav {
    356     color: #fff;
    357 }
    358 
    359 .site a:focus.skip-link {
     498    color: var(--wp--style--color--link, var(--global--color-white));
     499}
     500
     501.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
     502    color: var(--wp--style--color--link, var(--global--color-white));
     503}
     504
     505.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
    360506
    361507    /* Only visible in Windows High Contrast mode */
    … …  
    364510}
    365511
    366 .site a:focus.skip-link:focus {
     512.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
    367513    color: #21759b;
    368514    background-color: #f1f1f1;
    369515}
    370516
    371 .site a:focus img {
    372     outline: 2px dotted #28303d;
    373 }
    374 
    375 .has-background:not(.has-background-background-color) .has-link-color a {
    376     color: #28303d;
    377 }
    378 
    379 .has-background:not(.has-background-background-color).has-link-color a {
    380     color: #28303d;
     517.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
     518    outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
     519}
     520
     521.has-background .has-link-color a,
     522.has-background.has-link-color a {
     523    color: var(--wp--style--color--link, var(--global--color-primary));
    381524}
    382525
    383526.wp-block-button__link {
    384     line-height: 1.5;
    385     color: #d1e4dd;
     527    line-height: var(--button--line-height);
     528    color: var(--button--color-text);
    386529    cursor: pointer;
    387     font-weight: 500;
    388     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    389     font-size: 1.25rem;
    390     background-color: #39414d;
    391     border-radius: 0;
    392     border: 3px solid #39414d;
     530    font-weight: var(--button--font-weight);
     531    font-family: var(--button--font-family);
     532    font-size: var(--button--font-size);
     533    background-color: var(--button--color-background);
     534    border-radius: var(--button--border-radius);
     535    border: var(--button--border-width) solid var(--button--color-background);
    393536    text-decoration: none;
    394     padding: 15px 30px;
    395 }
    396 
    397 .wp-block-button__link:before,
    398 .wp-block-button__link:after {
    399     content: "";
    400     display: block;
    401     height: 0;
    402     width: 0;
    403 }
    404 
    405 .wp-block-button__link:before {
    406     margin-bottom: -calc(1em - 0);
    407 }
    408 
    409 .wp-block-button__link:after {
    410     margin-top: -calc(1em - 0);
     537    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    411538}
    412539
    … …  
    418545
    419546.is-dark-theme .wp-block-button__link:focus {
    420     color: #39414d;
     547    color: var(--button--color-background);
    421548}
    422549
    423550.wp-block-button__link:focus:not(.has-background) {
    424     color: #39414d;
     551    color: var(--button--color-text-hover);
    425552}
    426553
    427554.wp-block-button__link:disabled {
    428     background-color: rgba(255, 255, 255, 0.5);
    429     border-color: rgba(255, 255, 255, 0.5);
    430     color: #39414d;
     555    background-color: var(--global--color-white-50);
     556    border-color: var(--global--color-white-50);
     557    color: var(--button--color-text-active);
    431558}
    432559
    … …  
    440567
    441568[data-block].wp-block-buttons .wp-block-button:first-child {
    442     margin-top: 30px;
     569    margin-top: var(--global--spacing-vertical);
    443570}
    444571
    445572[data-block].wp-block-buttons .wp-block-button:last-child {
    446     margin-bottom: 30px;
     573    margin-bottom: var(--global--spacing-vertical);
    447574}
    448575
    449576.wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
    450     color: #39414d !important;
     577    color: var(--button--color-text-active) !important;
    451578    background: transparent !important;
    452     border-color: #39414d;
     579    border-color: var(--button--color-background);
    453580}
    454581
    455582.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
    456     color: #39414d !important;
     583    color: var(--button--color-text-hover) !important;
    457584    background: transparent !important;
    458     border-color: #39414d;
     585    border-color: var(--button--color-background);
    459586}
    460587
    461588.wp-block-button.is-style-outline .wp-block-button__link {
    462     color: #39414d;
     589    color: var(--button--color-background);
    463590    background: transparent;
    464     border: 3px solid currentColor;
    465     padding: 15px 30px;
    466 }
    467 
    468 .wp-block-button.is-style-outline .wp-block-button__link:active {
    469     background-color: #39414d;
    470     color: #d1e4dd;
    471     border-color: #39414d;
    472 }
    473 
     591    border: var(--button--border-width) solid currentColor;
     592    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
     593}
     594
     595.wp-block-button.is-style-outline .wp-block-button__link:active,
    474596.wp-block-button.is-style-outline .wp-block-button__link:hover {
    475     background-color: #39414d;
    476     color: #d1e4dd;
    477     border-color: #39414d;
     597    background-color: var(--button--color-background);
     598    color: var(--button--color-text);
     599    border-color: var(--button--color-background);
    478600}
    479601
    480602.wp-block-button.is-style-outline .wp-block-button__link.has-background {
    481     border-color: #39414d;
    482 }
    483 
    484 .wp-block-button.is-style-outline .wp-block-button__link.has-background:active {
    485     background-color: #39414d !important;
    486 }
    487 
     603    border-color: var(--button--color-background);
     604}
     605
     606.wp-block-button.is-style-outline .wp-block-button__link.has-background:active,
    488607.wp-block-button.is-style-outline .wp-block-button__link.has-background:hover {
    489     background-color: #39414d !important;
     608    background-color: var(--button--color-background) !important;
    490609}
    491610
    492611.wp-block-button.is-style-outline .wp-block-button__link.has-background:not(.has-text-color) {
    493     color: #28303d;
    494 }
    495 
    496 .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-gray-background-color:not(.has-text-color) {
    497     color: #fff;
    498 }
    499 
    500 .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-dark-gray-background-color:not(.has-text-color) {
    501     color: #fff;
    502 }
    503 
     612    color: var(--global--color-dark-gray);
     613}
     614
     615.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-gray-background-color:not(.has-text-color),
     616.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-dark-gray-background-color:not(.has-text-color),
    504617.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-black-background-color:not(.has-text-color) {
    505     color: #fff;
    506 }
    507 
    508 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-white-background-color {
    509     color: #28303d;
    510 }
    511 
    512 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-green-background-color {
    513     color: #28303d;
    514 }
    515 
    516 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-blue-background-color {
    517     color: #28303d;
    518 }
    519 
    520 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-purple-background-color {
    521     color: #28303d;
    522 }
    523 
    524 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-red-background-color {
    525     color: #28303d;
    526 }
    527 
    528 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-orange-background-color {
    529     color: #28303d;
    530 }
    531 
     618    color: var(--global--color-white);
     619}
     620
     621.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-white-background-color,
     622.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-green-background-color,
     623.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-blue-background-color,
     624.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-purple-background-color,
     625.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-red-background-color,
     626.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-orange-background-color,
    532627.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-yellow-background-color {
    533     color: #28303d;
     628    color: var(--global--color-dark-gray);
    534629}
    535630
    … …  
    538633}
    539634
    540 .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active {
    541     color: #d1e4dd !important;
    542     border-color: #39414d;
    543 }
    544 
     635.wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active,
    545636.wp-block-button.is-style-outline .wp-block-button__link.has-text-color:hover {
    546     color: #d1e4dd !important;
    547     border-color: #39414d;
     637    color: var(--button--color-text) !important;
     638    border-color: var(--button--color-background);
    548639}
    549640
    … …  
    558649
    559650.wp-block-code code {
    560     font-size: 1rem;
     651    font-size: var(--global--font-size-xs);
    561652    white-space: pre !important;
    562653    overflow-x: auto;
    … …  
    564655
    565656.wp-block-code {
    566     border-color: #28303d;
     657    border-color: var(--global--color-border);
    567658    border-radius: 0;
    568659    border-style: solid;
    569660    border-width: 0.1rem;
    570     padding: 20px;
     661    padding: var(--global--spacing-unit);
    571662    color: currentColor;
    572663}
    573664
    574 .wp-block-cover {
    575     background-color: #000;
    576     min-height: 450px;
    577     margin-top: inherit;
    578     margin-bottom: inherit;
    579 }
    580 
     665.wp-block-cover,
    581666.wp-block-cover-image {
    582     background-color: #000;
    583     min-height: 450px;
     667    background-color: var(--cover--color-background);
     668    min-height: var(--cover--height);
    584669    margin-top: inherit;
    585670    margin-bottom: inherit;
    … …  
    594679[data-align=full] .wp-block-cover-image {
    595680    margin-top: 0;
     681    margin-bottom: 0;
     682}
     683
     684.wp-block-cover > .wp-block-cover__inner-container > *:first-child,
     685.wp-block-cover-image > .wp-block-cover__inner-container > *:first-child {
     686    margin-top: 0;
     687}
     688
     689.wp-block-cover > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender),
     690.wp-block-cover-image > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender) {
     691    margin-bottom: 0;
     692}
     693
     694.wp-block-cover.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     695.wp-block-cover.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     696.wp-block-cover-image.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     697.wp-block-cover-image.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2) {
    596698    margin-bottom: 0;
    597699}
    … …  
    619721}
    620722
    621 .wp-block-cover .wp-block-cover__inner-container .has-link-color a {
    622     color: #28303d;
    623 }
    624 
    625 .wp-block-cover .wp-block-cover-image-text .has-link-color a {
    626     color: #28303d;
    627 }
    628 
    629 .wp-block-cover .wp-block-cover-text .has-link-color a {
    630     color: #28303d;
    631 }
    632 
    633 .wp-block-cover .block-editor-block-list__block .has-link-color a {
    634     color: #28303d;
    635 }
    636 
    637 .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a {
    638     color: #28303d;
    639 }
    640 
    641 .wp-block-cover-image .wp-block-cover-image-text .has-link-color a {
    642     color: #28303d;
    643 }
    644 
    645 .wp-block-cover-image .wp-block-cover-text .has-link-color a {
    646     color: #28303d;
    647 }
    648 
     723.wp-block-cover .wp-block-cover__inner-container .has-link-color a,
     724.wp-block-cover .wp-block-cover-image-text .has-link-color a,
     725.wp-block-cover .wp-block-cover-text .has-link-color a,
     726.wp-block-cover .block-editor-block-list__block .has-link-color a,
     727.wp-block-cover-image .wp-block-cover__inner-container .has-link-color a,
     728.wp-block-cover-image .wp-block-cover-image-text .has-link-color a,
     729.wp-block-cover-image .wp-block-cover-text .has-link-color a,
    649730.wp-block-cover-image .block-editor-block-list__block .has-link-color a {
    650     color: #28303d;
    651 }
    652 
    653 .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container {
    654     color: #fff;
    655 }
    656 
    657 .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text {
    658     color: #fff;
    659 }
    660 
    661 .wp-block-cover:not([class*=background-color]) .wp-block-cover-text {
    662     color: #fff;
    663 }
    664 
    665 .wp-block-cover:not([class*=background-color]) .block-editor-block-list__block {
    666     color: #fff;
    667 }
    668 
    669 .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container {
    670     color: #fff;
    671 }
    672 
    673 .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text {
    674     color: #fff;
    675 }
    676 
    677 .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text {
    678     color: #fff;
    679 }
    680 
     731    color: var(--wp--style--color--link, var(--global--color-primary));
     732}
     733
     734.wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container,
     735.wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text,
     736.wp-block-cover:not([class*=background-color]) .wp-block-cover-text,
     737.wp-block-cover:not([class*=background-color]) .block-editor-block-list__block,
     738.wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container,
     739.wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text,
     740.wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text,
    681741.wp-block-cover-image:not([class*=background-color]) .block-editor-block-list__block {
    682     color: #fff;
    683 }
    684 
    685 .wp-block-cover h2 {
    686     font-size: 2.25rem;
    687     letter-spacing: normal;
    688     line-height: 1.3;
     742    color: var(--cover--color-foreground);
     743}
     744
     745.wp-block-cover h2,
     746.wp-block-cover-image h2 {
     747    font-size: var(--heading--font-size-h2);
     748    letter-spacing: var(--heading--letter-spacing-h2);
     749    line-height: var(--heading--line-height-h2);
    689750    padding: 0;
    690751    max-width: inherit;
    691752    text-align: inherit;
    692753}
    693 @media only screen and (min-width: 652px) {
    694 
    695     .wp-block-cover h2 {
    696         font-size: 3rem;
    697     }
    698 }
    699 @media only screen and (min-width: 652px) {
    700 
    701     .wp-block-cover h2 {
    702         font-size: 3rem;
    703     }
    704 }
    705 
    706 .wp-block-cover-image h2 {
    707     font-size: 2.25rem;
    708     letter-spacing: normal;
    709     line-height: 1.3;
    710     padding: 0;
    711     max-width: inherit;
    712     text-align: inherit;
    713 }
    714 @media only screen and (min-width: 652px) {
    715 
    716     .wp-block-cover-image h2 {
    717         font-size: 3rem;
    718     }
    719 }
    720 @media only screen and (min-width: 652px) {
    721 
    722     .wp-block-cover-image h2 {
    723         font-size: 3rem;
    724     }
    725 }
    726754
    727755.wp-block-cover h2.has-text-align-left,
    … …  
    740768}
    741769
    742 .wp-block-cover.is-style-twentytwentyone-border {
    743     border: 3px solid #28303d;
    744 }
    745 
     770.wp-block-cover.is-style-twentytwentyone-border,
    746771.wp-block-cover-image.is-style-twentytwentyone-border {
    747     border: 3px solid #28303d;
     772    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
    748773}
    749774
    … …  
    756781    max-width: inherit;
    757782}
     783
     784.wp-block-columns > .wp-block-column > *:first-child {
     785    margin-top: 0;
     786}
     787
     788.wp-block-columns > .wp-block-column > *:last-child:not(.block-list-appender) {
     789    margin-bottom: 0;
     790}
     791
     792.wp-block-columns.has-child-selected > .wp-block-column > *:nth-last-child(2),
     793.wp-block-columns.is-selected > .wp-block-column > *:nth-last-child(2) {
     794    margin-bottom: 0;
     795}
    758796@media only screen and (min-width: 652px) {
    759797
    760798    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) {
    761         margin-left: -50px;
    762         margin-top: 63px;
     799        margin-left: calc(-2 * var(--global--spacing-horizontal));
     800        margin-top: calc(2.5 * var(--global--spacing-horizontal));
    763801        z-index: 2;
    764802    }
    765803
    766     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background) {
    767         background-color: #d1e4dd;
    768         padding: 20px;
    769     }
    770 
    771     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background) {
    772         background-color: #d1e4dd;
    773         padding: 20px;
    774     }
    775 
    776     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background) {
    777         background-color: #d1e4dd;
    778         padding: 20px;
    779     }
    780 
    781     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background) {
    782         background-color: #d1e4dd;
    783         padding: 20px;
    784     }
    785 
    786     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background) {
    787         background-color: #d1e4dd;
    788         padding: 20px;
    789     }
    790 
    791     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background) {
    792         background-color: #d1e4dd;
    793         padding: 20px;
    794     }
    795 
    796     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background) {
    797         background-color: #d1e4dd;
    798         padding: 20px;
    799     }
    800 
    801     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) {
    802         background-color: #d1e4dd;
    803         padding: 20px;
    804     }
    805 
     804    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background),
     805    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background),
     806    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background),
     807    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background),
     808    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background),
     809    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background),
     810    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background),
     811    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background),
     812    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background),
     813    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) {
     814        background-color: var(--global--color-background);
     815        padding: var(--global--spacing-unit);
     816    }
     817
     818    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background),
    806819    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) {
    807         background-color: #d1e4dd;
    808         padding: 20px;
    809     }
    810 
    811     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) {
    812         background-color: #d1e4dd;
    813         padding: 20px;
    814     }
    815 
    816     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) {
    817         padding-left: 50px;
    818     }
    819 
    820     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) {
    821         padding-left: 50px;
     820        padding-left: calc(2 * var(--global--spacing-horizontal));
    822821    }
    823822
    … …  
    827826}
    828827
    829 .wp-block[data-align=full] .wp-block-columns p:not(.has-background) {
    830     padding-left: 20px;
    831     padding-right: 20px;
    832 }
    833 
    834 .wp-block[data-align=full] .wp-block-columns h1:not(.has-background) {
    835     padding-left: 20px;
    836     padding-right: 20px;
    837 }
    838 
    839 .wp-block[data-align=full] .wp-block-columns h2:not(.has-background) {
    840     padding-left: 20px;
    841     padding-right: 20px;
    842 }
    843 
    844 .wp-block[data-align=full] .wp-block-columns h3:not(.has-background) {
    845     padding-left: 20px;
    846     padding-right: 20px;
    847 }
    848 
    849 .wp-block[data-align=full] .wp-block-columns h4:not(.has-background) {
    850     padding-left: 20px;
    851     padding-right: 20px;
    852 }
    853 
    854 .wp-block[data-align=full] .wp-block-columns h5:not(.has-background) {
    855     padding-left: 20px;
    856     padding-right: 20px;
    857 }
    858 
    859 .wp-block[data-align=full] .wp-block-columns h6:not(.has-background) {
    860     padding-left: 20px;
    861     padding-right: 20px;
     828.wp-block[data-align=full] > .wp-block-columns p:not(.has-background),
     829.wp-block[data-align=full] > .wp-block-columns h1:not(.has-background),
     830.wp-block[data-align=full] > .wp-block-columns h2:not(.has-background),
     831.wp-block[data-align=full] > .wp-block-columns h3:not(.has-background),
     832.wp-block[data-align=full] > .wp-block-columns h4:not(.has-background),
     833.wp-block[data-align=full] > .wp-block-columns h5:not(.has-background),
     834.wp-block[data-align=full] > .wp-block-columns h6:not(.has-background) {
     835    padding-left: var(--global--spacing-unit);
     836    padding-right: var(--global--spacing-unit);
    862837}
    863838
    … …  
    874849
    875850.wp-block-file .wp-block-file__button {
    876     line-height: 1.5;
    877     color: #d1e4dd;
     851    line-height: var(--button--line-height);
     852    color: var(--button--color-text);
    878853    cursor: pointer;
    879     font-weight: 500;
    880     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    881     font-size: 1.25rem;
    882     background-color: #39414d;
    883     border-radius: 0;
    884     border: 3px solid #39414d;
     854    font-weight: var(--button--font-weight);
     855    font-family: var(--button--font-family);
     856    font-size: var(--button--font-size);
     857    background-color: var(--button--color-background);
     858    border-radius: var(--button--border-radius);
     859    border: var(--button--border-width) solid var(--button--color-background);
    885860    text-decoration: none;
    886     padding: 15px 30px;
     861    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    887862    display: inline-block;
    888 }
    889 
    890 .wp-block-file .wp-block-file__button:before,
    891 .wp-block-file .wp-block-file__button:after {
    892     content: "";
    893     display: block;
    894     height: 0;
    895     width: 0;
    896 }
    897 
    898 .wp-block-file .wp-block-file__button:before {
    899     margin-bottom: -calc(1em - 0);
    900 }
    901 
    902 .wp-block-file .wp-block-file__button:after {
    903     margin-top: -calc(1em - 0);
    904863}
    905864
    … …  
    911870
    912871.is-dark-theme .wp-block-file .wp-block-file__button:focus {
    913     color: #39414d;
     872    color: var(--button--color-background);
    914873}
    915874
    916875.wp-block-file .wp-block-file__button:focus:not(.has-background) {
    917     color: #39414d;
     876    color: var(--button--color-text-hover);
    918877}
    919878
    920879.wp-block-file .wp-block-file__button:disabled {
    921     background-color: rgba(255, 255, 255, 0.5);
    922     border-color: rgba(255, 255, 255, 0.5);
    923     color: #39414d;
     880    background-color: var(--global--color-white-50);
     881    border-color: var(--global--color-white-50);
     882    color: var(--button--color-text-active);
    924883}
    925884
    926885.wp-block-file .wp-block-file__button:hover {
    927     color: #39414d;
     886    color: var(--button--color-text-hover);
    928887    background: transparent;
    929888}
    … …  
    934893
    935894.wp-block-gallery figcaption a {
    936     color: #fff;
     895    color: var(--global--color-white);
    937896}
    938897
    … …  
    951910
    952911.wp-block-group.has-background {
    953     padding: 30px;
     912    padding: var(--global--spacing-vertical);
    954913}
    955914
    … …  
    960919
    961920.wp-block-group.is-style-twentytwentyone-border {
    962     border: 3px solid #28303d;
    963     padding: 30px;
     921    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
     922    padding: var(--global--spacing-vertical);
    964923}
    965924
    966925.wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > [data-align=full] {
    967     max-width: calc(100% + 60px);
    968     width: calc(100% + 60px);
    969     margin-left: -30px;
    970 }
    971 
    972 .wp-block-group .wp-block-group__inner-container > *:last-child {
     926    max-width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical)));
     927    width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical)));
     928    margin-left: calc(-1 * var(--global--spacing-vertical));
     929}
     930
     931.wp-block-group > .wp-block-group__inner-container > *:first-child {
     932    margin-top: 0;
     933}
     934
     935.wp-block-group > .wp-block-group__inner-container > *:last-child:not(.block-list-appender) {
     936    margin-bottom: 0;
     937}
     938
     939.wp-block-group.has-child-selected > .wp-block-group__inner-container > *:nth-last-child(2),
     940.wp-block-group.is-selected > .wp-block-group__inner-container > *:nth-last-child(2) {
    973941    margin-bottom: 0;
    974942}
    … …  
    979947}
    980948
    981 .wp-block-heading h1 {
    982     clear: both;
    983     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    984     font-weight: normal;
    985 }
    986 
    987 h1 {
    988     clear: both;
    989     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    990     font-weight: normal;
    991 }
    992 
    993 .h1 {
    994     clear: both;
    995     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    996     font-weight: normal;
    997 }
    998 
    999 .wp-block-heading h2 {
    1000     clear: both;
    1001     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1002     font-weight: normal;
    1003 }
    1004 
    1005 h2 {
    1006     clear: both;
    1007     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1008     font-weight: normal;
    1009 }
    1010 
    1011 .h2 {
    1012     clear: both;
    1013     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1014     font-weight: normal;
    1015 }
    1016 
    1017 .wp-block-heading h3 {
    1018     clear: both;
    1019     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1020     font-weight: normal;
    1021 }
    1022 
    1023 h3 {
    1024     clear: both;
    1025     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1026     font-weight: normal;
    1027 }
    1028 
    1029 .h3 {
    1030     clear: both;
    1031     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1032     font-weight: normal;
    1033 }
    1034 
    1035 .wp-block-heading h4 {
    1036     clear: both;
    1037     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1038     font-weight: normal;
    1039 }
    1040 
    1041 h4 {
    1042     clear: both;
    1043     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1044     font-weight: normal;
    1045 }
    1046 
    1047 .h4 {
    1048     clear: both;
    1049     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1050     font-weight: normal;
    1051 }
    1052 
    1053 .wp-block-heading h5 {
    1054     clear: both;
    1055     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1056     font-weight: normal;
    1057 }
    1058 
    1059 h5 {
    1060     clear: both;
    1061     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1062     font-weight: normal;
    1063 }
    1064 
    1065 .h5 {
    1066     clear: both;
    1067     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1068     font-weight: normal;
    1069 }
    1070 
    1071 .wp-block-heading h6 {
    1072     clear: both;
    1073     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1074     font-weight: normal;
    1075 }
    1076 
    1077 h6 {
    1078     clear: both;
    1079     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1080     font-weight: normal;
    1081 }
    1082 
     949.wp-block-heading h1,
     950h1,
     951.h1,
     952.wp-block-heading h2,
     953h2,
     954.h2,
     955.wp-block-heading h3,
     956h3,
     957.h3,
     958.wp-block-heading h4,
     959h4,
     960.h4,
     961.wp-block-heading h5,
     962h5,
     963.h5,
     964.wp-block-heading h6,
     965h6,
    1083966.h6 {
    1084967    clear: both;
    1085     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1086     font-weight: normal;
    1087 }
    1088 
    1089 .wp-block-heading h1 strong {
    1090     font-weight: 600;
    1091 }
    1092 
    1093 h1 strong {
    1094     font-weight: 600;
    1095 }
    1096 
    1097 .h1 strong {
    1098     font-weight: 600;
    1099 }
    1100 
    1101 .wp-block-heading h2 strong {
    1102     font-weight: 600;
    1103 }
    1104 
    1105 h2 strong {
    1106     font-weight: 600;
    1107 }
    1108 
    1109 .h2 strong {
    1110     font-weight: 600;
    1111 }
    1112 
    1113 .wp-block-heading h3 strong {
    1114     font-weight: 600;
    1115 }
    1116 
    1117 h3 strong {
    1118     font-weight: 600;
    1119 }
    1120 
    1121 .h3 strong {
    1122     font-weight: 600;
    1123 }
    1124 
    1125 .wp-block-heading h4 strong {
    1126     font-weight: 600;
    1127 }
    1128 
    1129 h4 strong {
    1130     font-weight: 600;
    1131 }
    1132 
    1133 .h4 strong {
    1134     font-weight: 600;
    1135 }
    1136 
    1137 .wp-block-heading h5 strong {
    1138     font-weight: 600;
    1139 }
    1140 
    1141 h5 strong {
    1142     font-weight: 600;
    1143 }
    1144 
    1145 .h5 strong {
    1146     font-weight: 600;
    1147 }
    1148 
    1149 .wp-block-heading h6 strong {
    1150     font-weight: 600;
    1151 }
    1152 
    1153 h6 strong {
    1154     font-weight: 600;
    1155 }
    1156 
     968    font-family: var(--heading--font-family);
     969    font-weight: var(--heading--font-weight);
     970}
     971
     972.wp-block-heading h1 strong,
     973h1 strong,
     974.h1 strong,
     975.wp-block-heading h2 strong,
     976h2 strong,
     977.h2 strong,
     978.wp-block-heading h3 strong,
     979h3 strong,
     980.h3 strong,
     981.wp-block-heading h4 strong,
     982h4 strong,
     983.h4 strong,
     984.wp-block-heading h5 strong,
     985h5 strong,
     986.h5 strong,
     987.wp-block-heading h6 strong,
     988h6 strong,
    1157989.h6 strong {
    1158     font-weight: 600;
    1159 }
    1160 
    1161 .wp-block-heading h1[style*="--wp--typography--line-height"] {
    1162     line-height: --global--line-height-body;
    1163 }
    1164 
    1165 h1[style*="--wp--typography--line-height"] {
    1166     line-height: --global--line-height-body;
    1167 }
    1168 
    1169 .h1[style*="--wp--typography--line-height"] {
    1170     line-height: --global--line-height-body;
    1171 }
    1172 
    1173 .wp-block-heading h2[style*="--wp--typography--line-height"] {
    1174     line-height: --global--line-height-body;
    1175 }
    1176 
    1177 h2[style*="--wp--typography--line-height"] {
    1178     line-height: --global--line-height-body;
    1179 }
    1180 
    1181 .h2[style*="--wp--typography--line-height"] {
    1182     line-height: --global--line-height-body;
    1183 }
    1184 
    1185 .wp-block-heading h3[style*="--wp--typography--line-height"] {
    1186     line-height: --global--line-height-body;
    1187 }
    1188 
    1189 h3[style*="--wp--typography--line-height"] {
    1190     line-height: --global--line-height-body;
    1191 }
    1192 
    1193 .h3[style*="--wp--typography--line-height"] {
    1194     line-height: --global--line-height-body;
    1195 }
    1196 
    1197 .wp-block-heading h4[style*="--wp--typography--line-height"] {
    1198     line-height: --global--line-height-body;
    1199 }
    1200 
    1201 h4[style*="--wp--typography--line-height"] {
    1202     line-height: --global--line-height-body;
    1203 }
    1204 
    1205 .h4[style*="--wp--typography--line-height"] {
    1206     line-height: --global--line-height-body;
    1207 }
    1208 
    1209 .wp-block-heading h5[style*="--wp--typography--line-height"] {
    1210     line-height: --global--line-height-body;
    1211 }
    1212 
    1213 h5[style*="--wp--typography--line-height"] {
    1214     line-height: --global--line-height-body;
    1215 }
    1216 
    1217 .h5[style*="--wp--typography--line-height"] {
    1218     line-height: --global--line-height-body;
    1219 }
    1220 
    1221 .wp-block-heading h6[style*="--wp--typography--line-height"] {
    1222     line-height: --global--line-height-body;
    1223 }
    1224 
    1225 h6[style*="--wp--typography--line-height"] {
    1226     line-height: --global--line-height-body;
    1227 }
    1228 
     990    font-weight: var(--heading--font-weight-strong);
     991}
     992
     993.wp-block-heading h1[style*="--wp--typography--line-height"],
     994h1[style*="--wp--typography--line-height"],
     995.h1[style*="--wp--typography--line-height"],
     996.wp-block-heading h2[style*="--wp--typography--line-height"],
     997h2[style*="--wp--typography--line-height"],
     998.h2[style*="--wp--typography--line-height"],
     999.wp-block-heading h3[style*="--wp--typography--line-height"],
     1000h3[style*="--wp--typography--line-height"],
     1001.h3[style*="--wp--typography--line-height"],
     1002.wp-block-heading h4[style*="--wp--typography--line-height"],
     1003h4[style*="--wp--typography--line-height"],
     1004.h4[style*="--wp--typography--line-height"],
     1005.wp-block-heading h5[style*="--wp--typography--line-height"],
     1006h5[style*="--wp--typography--line-height"],
     1007.h5[style*="--wp--typography--line-height"],
     1008.wp-block-heading h6[style*="--wp--typography--line-height"],
     1009h6[style*="--wp--typography--line-height"],
    12291010.h6[style*="--wp--typography--line-height"] {
    1230     line-height: --global--line-height-body;
    1231 }
    1232 
    1233 .wp-block-heading h1 {
    1234     font-size: 4rem;
    1235     letter-spacing: normal;
    1236     line-height: 1.1;
    1237 }
    1238 
    1239 @media only screen and (min-width: 652px) {
    1240 
    1241     .wp-block-heading h1 {
    1242         font-size: 6rem;
    1243     }
    1244 }
    1245 
    1246 h1 {
    1247     font-size: 4rem;
    1248     letter-spacing: normal;
    1249     line-height: 1.1;
    1250 }
    1251 
    1252 @media only screen and (min-width: 652px) {
    1253 
    1254     h1 {
    1255         font-size: 6rem;
    1256     }
    1257 }
    1258 
     1011    line-height: var(--wp--typography--line-height, --global--line-height-body);
     1012}
     1013
     1014.wp-block-heading h1,
     1015h1,
    12591016.h1 {
    1260     font-size: 4rem;
    1261     letter-spacing: normal;
    1262     line-height: 1.1;
    1263 }
    1264 
    1265 @media only screen and (min-width: 652px) {
    1266 
    1267     .h1 {
    1268         font-size: 6rem;
    1269     }
    1270 }
    1271 
    1272 .wp-block-heading h2 {
    1273     font-size: 2.25rem;
    1274     letter-spacing: normal;
    1275     line-height: 1.3;
    1276 }
    1277 
    1278 @media only screen and (min-width: 652px) {
    1279 
    1280     .wp-block-heading h2 {
    1281         font-size: 3rem;
    1282     }
    1283 }
    1284 
    1285 @media only screen and (min-width: 652px) {
    1286 
    1287     .wp-block-heading h2 {
    1288         font-size: 3rem;
    1289     }
    1290 }
    1291 
    1292 h2 {
    1293     font-size: 2.25rem;
    1294     letter-spacing: normal;
    1295     line-height: 1.3;
    1296 }
    1297 
    1298 @media only screen and (min-width: 652px) {
    1299 
    1300     h2 {
    1301         font-size: 3rem;
    1302     }
    1303 }
    1304 
    1305 @media only screen and (min-width: 652px) {
    1306 
    1307     h2 {
    1308         font-size: 3rem;
    1309     }
    1310 }
    1311 
     1017    font-size: var(--heading--font-size-h1);
     1018    letter-spacing: var(--heading--letter-spacing-h1);
     1019    line-height: var(--heading--line-height-h1);
     1020}
     1021
     1022.wp-block-heading h2,
     1023h2,
    13121024.h2 {
    1313     font-size: 2.25rem;
    1314     letter-spacing: normal;
    1315     line-height: 1.3;
    1316 }
    1317 
    1318 @media only screen and (min-width: 652px) {
    1319 
    1320     .h2 {
    1321         font-size: 3rem;
    1322     }
    1323 }
    1324 
    1325 @media only screen and (min-width: 652px) {
    1326 
    1327     .h2 {
    1328         font-size: 3rem;
    1329     }
    1330 }
    1331 
    1332 .wp-block-heading h3 {
    1333     font-size: 2rem;
    1334     letter-spacing: normal;
    1335     line-height: 1.3;
    1336 }
    1337 
    1338 @media only screen and (min-width: 652px) {
    1339 
    1340     .wp-block-heading h3 {
    1341         font-size: 2rem;
    1342     }
    1343 }
    1344 
    1345 h3 {
    1346     font-size: 2rem;
    1347     letter-spacing: normal;
    1348     line-height: 1.3;
    1349 }
    1350 
    1351 @media only screen and (min-width: 652px) {
    1352 
    1353     h3 {
    1354         font-size: 2rem;
    1355     }
    1356 }
    1357 
     1025    font-size: var(--heading--font-size-h2);
     1026    letter-spacing: var(--heading--letter-spacing-h2);
     1027    line-height: var(--heading--line-height-h2);
     1028}
     1029
     1030.wp-block-heading h3,
     1031h3,
    13581032.h3 {
    1359     font-size: 2rem;
    1360     letter-spacing: normal;
    1361     line-height: 1.3;
    1362 }
    1363 
    1364 @media only screen and (min-width: 652px) {
    1365 
    1366     .h3 {
    1367         font-size: 2rem;
    1368     }
    1369 }
    1370 
    1371 .wp-block-heading h4 {
    1372     font-size: 1.5rem;
    1373     font-weight: 600;
    1374     letter-spacing: normal;
    1375     line-height: 1.3;
    1376 }
    1377 
    1378 h4 {
    1379     font-size: 1.5rem;
    1380     font-weight: 600;
    1381     letter-spacing: normal;
    1382     line-height: 1.3;
    1383 }
    1384 
     1033    font-size: var(--heading--font-size-h3);
     1034    letter-spacing: var(--heading--letter-spacing-h3);
     1035    line-height: var(--heading--line-height-h3);
     1036}
     1037
     1038.wp-block-heading h4,
     1039h4,
    13851040.h4 {
    1386     font-size: 1.5rem;
    1387     font-weight: 600;
    1388     letter-spacing: normal;
    1389     line-height: 1.3;
    1390 }
    1391 
    1392 .wp-block-heading h5 {
    1393     font-size: 1.125rem;
    1394     font-weight: 600;
    1395     letter-spacing: 0.05em;
    1396     line-height: 1.3;
    1397 }
    1398 
    1399 h5 {
    1400     font-size: 1.125rem;
    1401     font-weight: 600;
    1402     letter-spacing: 0.05em;
    1403     line-height: 1.3;
    1404 }
    1405 
     1041    font-size: var(--heading--font-size-h4);
     1042    font-weight: var(--heading--font-weight-strong);
     1043    letter-spacing: var(--heading--letter-spacing-h4);
     1044    line-height: var(--heading--line-height-h4);
     1045}
     1046
     1047.wp-block-heading h5,
     1048h5,
    14061049.h5 {
    1407     font-size: 1.125rem;
    1408     font-weight: 600;
    1409     letter-spacing: 0.05em;
    1410     line-height: 1.3;
    1411 }
    1412 
    1413 .wp-block-heading h6 {
    1414     font-size: 1rem;
    1415     font-weight: 600;
    1416     letter-spacing: 0.05em;
    1417     line-height: 1.3;
    1418 }
    1419 
    1420 h6 {
    1421     font-size: 1rem;
    1422     font-weight: 600;
    1423     letter-spacing: 0.05em;
    1424     line-height: 1.3;
    1425 }
    1426 
     1050    font-size: var(--heading--font-size-h5);
     1051    font-weight: var(--heading--font-weight-strong);
     1052    letter-spacing: var(--heading--letter-spacing-h5);
     1053    line-height: var(--heading--line-height-h5);
     1054}
     1055
     1056.wp-block-heading h6,
     1057h6,
    14271058.h6 {
    1428     font-size: 1rem;
    1429     font-weight: 600;
    1430     letter-spacing: 0.05em;
    1431     line-height: 1.3;
     1059    font-size: var(--heading--font-size-h6);
     1060    font-weight: var(--heading--font-weight-strong);
     1061    letter-spacing: var(--heading--letter-spacing-h6);
     1062    line-height: var(--heading--line-height-h6);
    14321063}
    14331064
    14341065[data-type="core/html"] textarea {
    1435     color: #28303d;
     1066    color: var(--global--color-dark-gray);
    14361067    border-radius: 0;
    1437     padding: 20px;
     1068    padding: var(--global--spacing-unit);
    14381069}
    14391070
    … …  
    14481079
    14491080/* Block Styles */
    1450 .wp-block-image.is-style-twentytwentyone-border img {
    1451     border: 3px solid #28303d;
    1452 }
    1453 
     1081.wp-block-image.is-style-twentytwentyone-border img,
    14541082.wp-block-image.is-style-twentytwentyone-image-frame img {
    1455     border: 3px solid #28303d;
     1083    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
    14561084}
    14571085
    14581086.wp-block-image.is-style-twentytwentyone-image-frame img {
    1459     padding: 20px;
     1087    padding: var(--global--spacing-unit);
    14601088}
    14611089
    … …  
    14691097
    14701098.wp-block-latest-posts:not(.is-grid) > li {
    1471     margin-top: 50px;
    1472     margin-bottom: 50px;
     1099    margin-top: calc(1.666 * var(--global--spacing-vertical));
     1100    margin-bottom: calc(1.666 * var(--global--spacing-vertical));
    14731101}
    14741102
    … …  
    14871115
    14881116.wp-block-latest-posts.is-grid > li {
    1489     margin-bottom: 30px;
     1117    margin-bottom: var(--global--spacing-vertical);
    14901118}
    14911119
    … …  
    14951123
    14961124.wp-block-latest-posts > li > * {
    1497     margin-top: 10px;
    1498     margin-bottom: 10px;
     1125    margin-top: calc(0.333 * var(--global--spacing-vertical));
     1126    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    14991127}
    15001128
    … …  
    15091137.wp-block-latest-posts > li > a {
    15101138    display: inline-block;
    1511     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1512     font-size: 2rem;
    1513     font-weight: normal;
    1514     line-height: 1.3;
    1515     margin-bottom: 10px;
    1516 }
    1517 @media only screen and (min-width: 652px) {
    1518 
    1519     .wp-block-latest-posts > li > a {
    1520         font-size: 2rem;
    1521     }
     1139    font-family: var(--latest-posts--title-font-family);
     1140    font-size: var(--latest-posts--title-font-size);
     1141    font-weight: var(--heading--font-weight);
     1142    line-height: var(--global--line-height-heading);
     1143    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    15221144}
    15231145
    15241146.wp-block-latest-posts .wp-block-latest-posts__post-author {
    1525     color: #28303d;
    1526     font-size: 1.25rem;
    1527     line-height: 1.7;
     1147    color: var(--global--color-primary);
     1148    font-size: var(--global--font-size-md);
     1149    line-height: var(--global--line-height-body);
    15281150}
    15291151
    15301152.wp-block-latest-posts .wp-block-latest-posts__post-date {
    1531     color: #28303d;
    1532     font-size: 1rem;
    1533     line-height: 1.7;
     1153    color: var(--global--color-primary);
     1154    font-size: var(--global--font-size-xs);
     1155    line-height: var(--global--line-height-body);
    15341156}
    15351157
    … …  
    15391161}
    15401162
    1541 .wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
    1542     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1543     font-size: 1.125rem;
    1544     line-height: 1.7;
    1545     margin-top: 20px;
    1546 }
    1547 
     1163.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
    15481164.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
    1549     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1550     font-size: 1.125rem;
    1551     line-height: 1.7;
    1552     margin-top: 20px;
     1165    font-family: var(--latest-posts--description-font-family);
     1166    font-size: var(--latest-posts--description-font-size);
     1167    line-height: var(--global--line-height-body);
     1168    margin-top: calc(0.666 * var(--global--spacing-vertical));
    15531169}
    15541170
    15551171.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers {
    1556     border-top: 3px solid #28303d;
    1557     border-bottom: 3px solid #28303d;
    1558 }
    1559 
    1560 .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li {
    1561     padding-bottom: 30px;
    1562     border-bottom: 1px solid #28303d;
    1563     margin-top: 30px;
    1564     margin-bottom: 30px;
    1565 }
    1566 
     1172    border-top: calc(3 * var(--separator--height)) solid var(--global--color-border);
     1173    border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border);
     1174}
     1175
     1176.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li,
    15671177.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li {
    1568     padding-bottom: 30px;
    1569     border-bottom: 1px solid #28303d;
    1570     margin-top: 30px;
    1571     margin-bottom: 30px;
     1178    padding-bottom: var(--global--spacing-vertical);
     1179    border-bottom: var(--separator--height) solid var(--global--color-border);
     1180    margin-top: var(--global--spacing-vertical);
     1181    margin-bottom: var(--global--spacing-vertical);
    15721182}
    15731183
    … …  
    15791189
    15801190.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid {
    1581     box-shadow: inset 0 -1px 0 0 #28303d;
    1582     border-bottom: 2px solid #28303d;
     1191    box-shadow: inset 0 -1px 0 0 var(--global--color-border);
     1192    border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border);
    15831193}
    15841194
    15851195.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li {
    15861196    margin: 0;
    1587     padding-top: 30px;
    1588     padding-right: 25px;
     1197    padding-top: var(--global--spacing-vertical);
     1198    padding-right: var(--global--spacing-horizontal);
    15891199}
    15901200
    15911201.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child {
    1592     padding-bottom: 30px;
     1202    padding-bottom: var(--global--spacing-vertical);
    15931203}
    15941204@media screen and (min-width: 600px) {
    15951205
    15961206    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li {
    1597         width: 50%;
     1207        width: calc((100% / 2));
    15981208    }
    15991209
    16001210    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li {
    1601         width: 33%;
     1211        width: calc((100% / 3));
    16021212    }
    16031213
    16041214    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li {
    1605         width: 25%;
     1215        width: calc((100% / 4));
    16061216    }
    16071217
    16081218    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li {
    1609         width: 20%;
     1219        width: calc((100% / 5));
    16101220    }
    16111221
    16121222    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li {
    1613         width: 17%;
     1223        width: calc((100% / 6));
    16141224    }
    16151225}
    16161226
    16171227.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li {
    1618     border: 3px solid #28303d;
    1619     padding: 30px 25px;
     1228    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
     1229    padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
    16201230}
    16211231
    16221232.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child {
    1623     padding-bottom: 30px;
    1624     margin-bottom: 30px;
     1233    padding-bottom: var(--global--spacing-vertical);
     1234    margin-bottom: var(--global--spacing-vertical);
    16251235}
    16261236
    16271237.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li {
    1628     margin-top: 25px;
    1629     margin-bottom: 25px;
     1238    margin-top: var(--global--spacing-horizontal);
     1239    margin-bottom: var(--global--spacing-horizontal);
    16301240}
    16311241
    … …  
    16731283}
    16741284
    1675 ul {
    1676     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1677     margin: 30px 0;
    1678     padding-left: 50px;
    1679 }
    1680 
     1285ul,
    16811286ol {
    1682     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1683     margin: 30px 0;
    1684     padding-left: 50px;
     1287    font-family: var(--list--font-family);
     1288    margin: var(--global--spacing-vertical) 0;
     1289    padding-left: calc(2 * var(--global--spacing-horizontal));
    16851290}
    16861291
    … …  
    17051310
    17061311dt {
    1707     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     1312    font-family: var(--definition-term--font-family);
    17081313    font-weight: bold;
    17091314}
    … …  
    17141319}
    17151320
     1321.wp-block-media-text > .wp-block-media-text__content > *:first-child {
     1322    margin-top: 0;
     1323}
     1324
     1325.wp-block-media-text > .wp-block-media-text__content > *:last-child:not(.block-list-appender) {
     1326    margin-bottom: 0;
     1327}
     1328
     1329.wp-block-media-text.has-child-selected > .wp-block-media-text__content > *:nth-last-child(2),
     1330.wp-block-media-text.is-selected > .wp-block-media-text__content > *:nth-last-child(2) {
     1331    margin-bottom: 0;
     1332}
     1333
    17161334.wp-block-media-text .wp-block-media-text__content {
    1717     padding: 25px;
    1718 }
    1719 
    1720 .wp-block-media-text .wp-block-media-text__content [data-block]:first-child {
    1721     margin-top: 0;
    1722 }
    1723 
    1724 .wp-block-media-text .wp-block-media-text__content [data-block]:last-child {
    1725     margin-bottom: 0;
     1335    padding: var(--global--spacing-horizontal);
    17261336}
    17271337
    17281338.wp-block-media-text.is-style-twentytwentyone-border {
    1729     border: 3px solid #28303d;
     1339    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
    17301340}
    17311341
    17321342.wp-block-navigation .wp-block-navigation__container {
    1733     background: #d1e4dd;
     1343    background: var(--global--color-background);
    17341344    padding: 0;
    17351345}
    17361346
    17371347.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
    1738     padding: 13px;
     1348    padding: var(--primary-nav--padding);
    17391349}
    17401350
    17411351.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
    1742     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1743     font-size: 1.25rem;
    1744     font-weight: normal;
     1352    font-family: var(--primary-nav--font-family);
     1353    font-size: var(--primary-nav--font-size);
     1354    font-weight: var(--primary-nav--font-weight);
    17451355}
    17461356
    17471357.wp-block-navigation .has-child .wp-block-navigation__container {
    1748     box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
    1749 }
    1750 
    1751 .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover {
    1752     color: #28303d;
    1753 }
    1754 
     1358    box-shadow: var(--global--elevation);
     1359}
     1360
     1361.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover,
    17551362.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus {
    1756     color: #28303d;
     1363    color: var(--primary-nav--color-link-hover);
    17571364}
    17581365
    … …  
    17621369
    17631370p {
    1764     line-height: --global--line-height-body;
     1371    line-height: var(--wp--typography--line-height, --global--line-height-body);
    17651372}
    17661373
    17671374p.has-background {
    1768     padding: 20px;
     1375    padding: var(--global--spacing-unit);
    17691376}
    17701377
    … …  
    17721379    overflow-x: auto;
    17731380    white-space: pre !important;
    1774     font-size: 1rem;
     1381    font-size: var(--global--font-size-xs);
    17751382}
    17761383
    17771384.wp-block-pullquote {
    1778     padding: 40px 0;
     1385    padding: calc(2 * var(--global--spacing-unit)) 0;
    17791386    text-align: center;
    1780     border-width: 3px;
     1387    border-width: var(--pullquote--border-width);
    17811388    border-bottom-style: solid;
    17821389    border-top-style: solid;
    … …  
    17901397    content: "“";
    17911398    display: block;
     1399    position: relative;
     1400    left: 0;
    17921401    font-size: 3rem;
    17931402    font-weight: 500;
    … …  
    17961405
    17971406.wp-block-pullquote p {
    1798     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1799     font-size: 2rem;
    1800     font-style: normal;
     1407    font-family: var(--pullquote--font-family);
     1408    font-size: var(--pullquote--font-size);
     1409    font-style: var(--pullquote--font-style);
    18011410    font-weight: 700;
    1802     letter-spacing: normal;
    1803     line-height: 1.3;
     1411    letter-spacing: var(--pullquote--letter-spacing);
     1412    line-height: var(--pullquote--line-height);
    18041413    margin: 0;
    1805 }
    1806 @media only screen and (min-width: 652px) {
    1807 
    1808     .wp-block-pullquote p {
    1809         font-size: 2rem;
    1810     }
    18111414}
    18121415
    … …  
    18151418}
    18161419
    1817 .wp-block-pullquote .wp-block-pullquote__citation {
    1818     font-size: 1rem;
    1819     font-style: normal;
    1820     text-transform: none;
    1821 }
    1822 
    1823 .wp-block-pullquote cite {
    1824     font-size: 1rem;
    1825     font-style: normal;
    1826     text-transform: none;
    1827 }
    1828 
     1420.wp-block-pullquote .wp-block-pullquote__citation,
     1421.wp-block-pullquote cite,
    18291422.wp-block-pullquote footer {
    1830     font-size: 1rem;
    1831     font-style: normal;
     1423    font-size: var(--global--font-size-xs);
     1424    font-style: var(--pullquote--font-style);
    18321425    text-transform: none;
    18331426}
    … …  
    18401433    margin-left: auto;
    18411434    margin-right: auto;
    1842     padding: 50px;
    1843     border-width: 3px;
     1435    padding: calc(2.5 * var(--global--spacing-unit));
     1436    border-width: var(--pullquote--border-width);
    18441437    border-style: solid;
    1845     border-color: #28303d;
     1438    border-color: var(--pullquote--border-color);
    18461439}
    18471440@media (min-width: 600px) {
    18481441
    18491442    .wp-block-pullquote.is-style-solid-color {
    1850         padding: 100px;
     1443        padding: calc(5 * var(--global--spacing-unit));
    18511444    }
    18521445}
    … …  
    18561449}
    18571450
    1858 .wp-block-pullquote.is-style-solid-color.alignleft blockquote {
    1859     padding-left: 20px;
    1860     padding-right: 20px;
    1861     max-width: inherit;
    1862 }
    1863 
     1451.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
    18641452.wp-block-pullquote.is-style-solid-color.alignright blockquote {
    1865     padding-left: 20px;
    1866     padding-right: 20px;
     1453    padding-left: var(--global--spacing-unit);
     1454    padding-right: var(--global--spacing-unit);
    18671455    max-width: inherit;
    18681456}
    … …  
    18741462
    18751463.wp-block-pullquote.is-style-solid-color blockquote p {
    1876     font-size: 2rem;
    1877 }
    1878 @media only screen and (min-width: 652px) {
    1879 
    1880     .wp-block-pullquote.is-style-solid-color blockquote p {
    1881         font-size: 2rem;
    1882     }
     1464    font-size: var(--pullquote--font-size);
    18831465}
    18841466
    … …  
    18901472
    18911473.wp-block[data-align=full] .wp-block-pullquote:not(.is-style-solid-color) blockquote {
    1892     padding: 0 40px;
     1474    padding: 0 calc(2 * var(--global--spacing-unit));
     1475}
     1476
     1477.wp-block[data-align=left] .wp-block-pullquote.is-style-solid-color,
     1478.wp-block[data-align=right] .wp-block-pullquote.is-style-solid-color {
     1479    padding: var(--global--spacing-unit);
    18931480}
    18941481
    … …  
    18961483    position: relative;
    18971484    border-left: none;
    1898     margin: 30px auto 30px 25px;
     1485    margin: var(--global--spacing-vertical) auto var(--global--spacing-vertical) var(--global--spacing-horizontal);
    18991486}
    19001487
    19011488.wp-block-quote p {
    1902     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1903     font-size: 1.25rem;
    1904     font-style: normal;
    1905     font-weight: 700;
    1906     line-height: 1.7;
     1489    font-family: var(--quote--font-family);
     1490    font-size: var(--quote--font-size);
     1491    font-style: var(--quote--font-style);
     1492    font-weight: var(--quote--font-weight);
     1493    line-height: var(--quote--line-height);
    19071494}
    19081495
    19091496.wp-block-quote strong {
    1910     font-weight: bolder;
     1497    font-weight: var(--quote--font-weight-strong);
    19111498}
    19121499
    19131500.wp-block-quote:before {
    19141501    content: "“";
    1915     font-size: 1.25rem;
    1916     line-height: 1.7;
    1917     position: absolute;
    1918     left: -12px;
     1502    font-size: var(--quote--font-size);
     1503    line-height: var(--quote--line-height);
     1504    left: calc(-0.5 * var(--global--spacing-horizontal));
    19191505}
    19201506
    19211507.wp-block-quote .wp-block-quote__citation {
    1922     color: #28303d;
    1923     font-size: 1rem;
    1924     font-style: normal;
    1925 }
    1926 
    1927 .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    1928 [class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    1929 [style*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
     1508    color: var(--global--color-primary);
     1509    font-size: var(--global--font-size-xs);
     1510    font-style: var(--quote--font-style-cite);
     1511}
     1512
     1513.has-background .wp-block-quote .wp-block-quote__citation,
     1514[class*=background-color] .wp-block-quote .wp-block-quote__citation,
     1515[style*=background-color] .wp-block-quote .wp-block-quote__citation,
    19301516.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation {
    19311517    color: currentColor;
    … …  
    19331519
    19341520.wp-block-quote.has-text-align-right {
    1935     margin: 30px 25px 30px auto;
     1521    margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto;
    19361522    padding-right: 0;
    19371523    border-right: none;
    … …  
    19391525
    19401526.wp-block-quote.has-text-align-right:before {
     1527    display: none;
     1528}
     1529
     1530.wp-block-quote.has-text-align-right p:before {
    19411531    content: "”";
    1942     left: initial;
    1943     right: -12px;
     1532    font-size: var(--quote--font-size);
     1533    font-weight: normal;
     1534    line-height: var(--quote--line-height);
     1535    margin-right: 5px;
    19441536}
    19451537
    19461538.wp-block-quote.has-text-align-center {
    1947     margin: 30px auto;
     1539    margin: var(--global--spacing-vertical) auto;
    19481540}
    19491541
    … …  
    19521544}
    19531545
    1954 .wp-block-quote.is-large {
    1955     padding-left: 0;
    1956 
    1957     /* Resetting margins to match _block-container.scss */
    1958     margin-top: 30px;
    1959     margin-bottom: 30px;
    1960 }
    1961 
     1546.wp-block-quote.is-large,
    19621547.wp-block-quote.is-style-large {
    19631548    padding-left: 0;
    19641549
    19651550    /* Resetting margins to match _block-container.scss */
    1966     margin-top: 30px;
    1967     margin-bottom: 30px;
    1968 }
    1969 
    1970 .wp-block-quote.is-large p {
    1971     font-size: 2.25rem;
    1972     font-style: normal;
    1973     line-height: 1.35;
    1974 }
    1975 @media only screen and (min-width: 652px) {
    1976 
    1977     .wp-block-quote.is-large p {
    1978         font-size: 2.5rem;
    1979     }
    1980 }
    1981 
     1551    margin-top: var(--global--spacing-vertical);
     1552    margin-bottom: var(--global--spacing-vertical);
     1553}
     1554
     1555.wp-block-quote.is-large p,
    19821556.wp-block-quote.is-style-large p {
    1983     font-size: 2.25rem;
    1984     font-style: normal;
    1985     line-height: 1.35;
    1986 }
    1987 @media only screen and (min-width: 652px) {
    1988 
    1989     .wp-block-quote.is-style-large p {
    1990         font-size: 2.5rem;
    1991     }
    1992 }
    1993 
    1994 .wp-block-quote.is-large:before {
    1995     font-size: 2.25rem;
    1996     line-height: 1.35;
    1997     left: -25px;
    1998 }
    1999 @media only screen and (min-width: 652px) {
    2000 
    2001     .wp-block-quote.is-large:before {
    2002         font-size: 2.5rem;
    2003     }
    2004 }
    2005 
     1557    font-size: var(--quote--font-size-large);
     1558    font-style: var(--quote--font-style-large);
     1559    line-height: var(--quote--line-height-large);
     1560}
     1561
     1562.wp-block-quote.is-large:before,
    20061563.wp-block-quote.is-style-large:before {
    2007     font-size: 2.25rem;
    2008     line-height: 1.35;
    2009     left: -25px;
    2010 }
    2011 @media only screen and (min-width: 652px) {
    2012 
    2013     .wp-block-quote.is-style-large:before {
    2014         font-size: 2.5rem;
    2015     }
    2016 }
    2017 
    2018 .wp-block-quote.is-large.has-text-align-right:before {
    2019     left: initial;
    2020     right: -25px;
    2021 }
    2022 
     1564    font-size: var(--quote--font-size-large);
     1565    line-height: var(--quote--line-height-large);
     1566    left: calc(-1 * var(--global--spacing-horizontal));
     1567}
     1568
     1569.wp-block-quote.is-large.has-text-align-right:before,
    20231570.wp-block-quote.is-style-large.has-text-align-right:before {
    2024     left: initial;
    2025     right: -25px;
     1571    display: none;
     1572}
     1573
     1574.wp-block-quote.is-large.has-text-align-right p:before,
     1575.wp-block-quote.is-style-large.has-text-align-right p:before {
     1576    content: "”";
     1577    font-size: var(--quote--font-size-large);
     1578    font-weight: normal;
     1579    line-height: var(--quote--line-height-large);
     1580    margin-right: 10px;
    20261581}
    20271582@media only screen and (max-width: 481px) {
    20281583
    2029     .wp-block-quote.is-large {
    2030         padding-left: 25px;
    2031     }
    2032 
     1584    .wp-block-quote.is-large,
    20331585    .wp-block-quote.is-style-large {
    2034         padding-left: 25px;
     1586        padding-left: var(--global--spacing-horizontal);
    20351587    }
    20361588
    … …  
    20401592    }
    20411593
    2042     .wp-block-quote.is-large.has-text-align-right {
    2043         padding-left: 0;
    2044         padding-right: 25px;
    2045     }
    2046 
     1594    .wp-block-quote.is-large.has-text-align-right,
    20471595    .wp-block-quote.is-style-large.has-text-align-right {
    20481596        padding-left: 0;
    2049         padding-right: 25px;
     1597        padding-right: var(--global--spacing-horizontal);
    20501598    }
    20511599
    … …  
    20581606
    20591607    .wp-block-quote {
    2060         padding-left: 13px;
     1608        padding-left: calc(0.5 * var(--global--spacing-horizontal));
    20611609    }
    20621610
    … …  
    20671615    .wp-block-quote.has-text-align-right {
    20681616        padding-left: 0;
    2069         padding-right: 13px;
     1617        padding-right: calc(0.5 * var(--global--spacing-horizontal));
    20701618    }
    20711619
    … …  
    20991647
    21001648.wp-block-rss:not(.is-grid) > li {
    2101     margin-top: 50px;
    2102     margin-bottom: 50px;
     1649    margin-top: calc(1.666 * var(--global--spacing-vertical));
     1650    margin-bottom: calc(1.666 * var(--global--spacing-vertical));
    21031651}
    21041652
    … …  
    21121660
    21131661.wp-block-rss.is-grid > li {
    2114     margin-bottom: 30px;
     1662    margin-bottom: var(--global--spacing-vertical);
    21151663}
    21161664
    … …  
    21331681
    21341682.wp-block-rss > li > * {
    2135     margin-top: 10px;
    2136     margin-bottom: 10px;
     1683    margin-top: calc(0.333 * var(--global--spacing-vertical));
     1684    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    21371685}
    21381686
    … …  
    21471695.wp-block-rss .wp-block-rss__item-title > a {
    21481696    display: inline-block;
    2149     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2150     font-size: 2rem;
    2151     font-weight: normal;
    2152     line-height: 1.3;
    2153     margin-bottom: 10px;
    2154 }
    2155 @media only screen and (min-width: 652px) {
    2156 
    2157     .wp-block-rss .wp-block-rss__item-title > a {
    2158         font-size: 2rem;
    2159     }
     1697    font-family: var(--latest-posts--title-font-family);
     1698    font-size: var(--latest-posts--title-font-size);
     1699    font-weight: var(--heading--font-weight);
     1700    line-height: var(--global--line-height-heading);
     1701    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    21601702}
    21611703
    21621704.wp-block-rss .wp-block-rss__item-author {
    2163     color: #28303d;
    2164     font-size: 1.25rem;
    2165     line-height: 1.7;
     1705    color: var(--global--color-primary);
     1706    font-size: var(--global--font-size-md);
     1707    line-height: var(--global--line-height-body);
    21661708}
    21671709
    21681710.wp-block-rss .wp-block-rss__item-publish-date {
    2169     color: #28303d;
    2170     font-size: 1rem;
    2171     line-height: 1.7;
     1711    color: var(--global--color-primary);
     1712    font-size: var(--global--font-size-xs);
     1713    line-height: var(--global--line-height-body);
    21721714}
    21731715
    … …  
    21771719}
    21781720
    2179 .wp-block-rss .wp-block-rss__item-excerpt {
    2180     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2181     font-size: 1.125rem;
    2182     line-height: 1.7;
    2183     margin-top: 20px;
    2184 }
    2185 
     1721.wp-block-rss .wp-block-rss__item-excerpt,
    21861722.wp-block-rss .wp-block-rss__item-full-content {
    2187     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2188     font-size: 1.125rem;
    2189     line-height: 1.7;
    2190     margin-top: 20px;
     1723    font-family: var(--latest-posts--description-font-family);
     1724    font-size: var(--latest-posts--description-font-size);
     1725    line-height: var(--global--line-height-body);
     1726    margin-top: calc(0.666 * var(--global--spacing-vertical));
    21911727}
    21921728
    21931729.wp-block-rss.alignfull {
    2194     padding-left: 20px;
    2195     padding-right: 20px;
     1730    padding-left: var(--global--spacing-unit);
     1731    padding-right: var(--global--spacing-unit);
    21961732}
    21971733
    … …  
    22031739
    22041740.wp-block-search {
    2205     max-width: calc(100vw - 30px);
    2206 }
    2207 
    2208 @media only screen and (min-width: 482px) {
    2209 
    2210     .wp-block-search {
    2211         max-width: min(calc(100vw - 100px), 610px);
    2212     }
    2213 }
    2214 
    2215 @media only screen and (min-width: 822px) {
    2216 
    2217     .wp-block-search {
    2218         max-width: min(calc(100vw - 200px), 610px);
    2219     }
     1741    max-width: var(--responsive--aligndefault-width);
    22201742}
    22211743
    22221744.wp-block-search .wp-block-search__label {
    2223     font-size: 1.125rem;
    2224     font-weight: 500;
    2225     margin-bottom: 10px;
     1745    font-size: var(--form--font-size);
     1746    font-weight: var(--form--label-weight);
     1747    margin-bottom: calc(var(--global--spacing-vertical) / 3);
    22261748}
    22271749
    22281750.wp-block-search .wp-block-search__input {
    2229     border: 3px solid #39414d;
    2230     border-radius: 0;
    2231     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2232     font-size: 1.125rem;
    2233     line-height: 1.7;
     1751    border: var(--form--border-width) solid var(--form--border-color);
     1752    border-radius: var(--form--border-radius);
     1753    font-family: var(--form--font-family);
     1754    font-size: var(--form--font-size);
     1755    line-height: var(--form--line-height);
    22341756    max-width: inherit;
    2235     margin-right: -3px;
    2236     padding: 10px;
     1757    margin-right: calc(-1 * var(--button--border-width));
     1758    padding: var(--form--spacing-unit);
    22371759}
    22381760
    22391761.is-dark-theme .wp-block-search .wp-block-search__input {
    2240     background: rgba(255, 255, 255, 0.9);
    2241 }
    2242 
    2243 .is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__input {
    2244     border-color: #28303d;
    2245 }
    2246 
    2247 .is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__input {
    2248     border-color: #28303d;
    2249 }
    2250 
    2251 .is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__input {
    2252     border-color: #28303d;
    2253 }
    2254 
    2255 .is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__input {
    2256     border-color: #28303d;
    2257 }
    2258 
    2259 .is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__input {
    2260     border-color: #28303d;
    2261 }
    2262 
    2263 .is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__input {
    2264     border-color: #28303d;
    2265 }
    2266 
     1762    background: var(--global--color-white-90);
     1763}
     1764
     1765.is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__input,
     1766.is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__input,
     1767.is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__input,
     1768.is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__input,
     1769.is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__input,
     1770.is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__input,
    22671771.is-dark-theme .has-background.has-yellow-background-color .wp-block-search .wp-block-search__input {
    2268     border-color: #28303d;
    2269 }
    2270 
    2271 .has-background.has-gray-background-color .wp-block-search .wp-block-search__input {
    2272     border-color: #fff;
    2273 }
    2274 
    2275 .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__input {
    2276     border-color: #fff;
    2277 }
    2278 
     1772    border-color: var(--form--color-text);
     1773}
     1774
     1775.has-background.has-gray-background-color .wp-block-search .wp-block-search__input,
     1776.has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__input,
    22791777.has-background.has-black-background-color .wp-block-search .wp-block-search__input {
    2280     border-color: #fff;
     1778    border-color: var(--global--color-white);
    22811779}
    22821780
    22831781.wp-block-search .wp-block-search__button {
    2284     line-height: 1.5;
    2285     color: #d1e4dd;
     1782    line-height: var(--button--line-height);
     1783    color: var(--button--color-text);
    22861784    cursor: pointer;
    2287     font-weight: 500;
    2288     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2289     font-size: 1.25rem;
    2290     background-color: #39414d;
    2291     border-radius: 0;
    2292     border: 3px solid #39414d;
     1785    font-weight: var(--button--font-weight);
     1786    font-family: var(--button--font-family);
     1787    font-size: var(--button--font-size);
     1788    background-color: var(--button--color-background);
     1789    border-radius: var(--button--border-radius);
     1790    border: var(--button--border-width) solid var(--button--color-background);
    22931791    text-decoration: none;
    2294     padding: 15px 30px;
     1792    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    22951793    box-shadow: none;
    22961794    margin-left: 0;
    22971795    background-color: transparent;
    2298     color: #39414d;
    2299 }
    2300 
    2301 .wp-block-search .wp-block-search__button:before,
    2302 .wp-block-search .wp-block-search__button:after {
    2303     content: "";
    2304     display: block;
    2305     height: 0;
    2306     width: 0;
    2307 }
    2308 
    2309 .wp-block-search .wp-block-search__button:before {
    2310     margin-bottom: -calc(1em - 0);
    2311 }
    2312 
    2313 .wp-block-search .wp-block-search__button:after {
    2314     margin-top: -calc(1em - 0);
     1796    color: var(--button--color-text-hover);
    23151797}
    23161798
    … …  
    23221804
    23231805.is-dark-theme .wp-block-search .wp-block-search__button:focus {
    2324     color: #39414d;
     1806    color: var(--button--color-background);
    23251807}
    23261808
    23271809.wp-block-search .wp-block-search__button:focus:not(.has-background) {
    2328     color: #39414d;
     1810    color: var(--button--color-text-hover);
    23291811}
    23301812
    23311813.wp-block-search .wp-block-search__button:disabled {
    2332     background-color: rgba(255, 255, 255, 0.5);
    2333     border-color: rgba(255, 255, 255, 0.5);
    2334     color: #39414d;
     1814    background-color: var(--global--color-white-50);
     1815    border-color: var(--global--color-white-50);
     1816    color: var(--button--color-text-active);
    23351817}
    23361818
    23371819.wp-block-search .wp-block-search__button:hover {
    2338     color: #d1e4dd;
    2339     background-color: #39414d;
     1820    color: var(--button--color-text);
     1821    background-color: var(--button--color-background);
    23401822}
    23411823
    23421824.wp-block-search .wp-block-search__button.has-icon {
    2343     padding: 30px 15px;
     1825    padding: calc(2 * var(--button--padding-vertical)) calc(0.5 * var(--button--padding-horizontal));
    23441826}
    23451827
    … …  
    23491831}
    23501832
    2351 .has-background.has-gray-background-color .wp-block-search .wp-block-search__button {
    2352     color: #fff;
     1833.has-background.has-gray-background-color .wp-block-search .wp-block-search__button,
     1834.has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button,
     1835.has-background.has-black-background-color .wp-block-search .wp-block-search__button {
     1836    color: var(--global--color-white);
    23531837    border-color: currentColor;
    23541838}
    23551839
    2356 .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button {
    2357     color: #fff;
     1840.has-background.has-gray-background-color .wp-block-search .wp-block-search__button:hover,
     1841.has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button:hover,
     1842.has-background.has-black-background-color .wp-block-search .wp-block-search__button:hover {
     1843    color: var(--global--color-white);
     1844    background-color: var(--button--color-background);
     1845    border-color: var(--global--color-white);
     1846}
     1847
     1848.is-dark-theme .has-background.has-gray-background-color .wp-block-search .wp-block-search__button:hover,
     1849.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button:hover,
     1850.is-dark-theme .has-background.has-black-background-color .wp-block-search .wp-block-search__button:hover {
     1851    color: var(--button--color-text);
     1852    background-color: var(--button--color-background);
     1853}
     1854
     1855.has-background.has-white-background-color .wp-block-search .wp-block-search__button:hover,
     1856.has-background.has-green-background-color .wp-block-search .wp-block-search__button:hover,
     1857.has-background.has-blue-background-color .wp-block-search .wp-block-search__button:hover,
     1858.has-background.has-purple-background-color .wp-block-search .wp-block-search__button:hover,
     1859.has-background.has-red-background-color .wp-block-search .wp-block-search__button:hover,
     1860.has-background.has-orange-background-color .wp-block-search .wp-block-search__button:hover,
     1861.has-background.has-yellow-background-color .wp-block-search .wp-block-search__button:hover {
     1862    color: var(--global--color-white);
     1863    background-color: var(--form--border-color);
     1864    border-color: var(--form--border-color);
     1865}
     1866
     1867.is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__button,
     1868.is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__button,
     1869.is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__button,
     1870.is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__button,
     1871.is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__button,
     1872.is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__button,
     1873.is-dark-theme .has-background.has-yellow-background-color .wp-block-search .wp-block-search__button {
     1874    color: var(--form--color-text);
    23581875    border-color: currentColor;
    23591876}
    23601877
    2361 .has-background.has-black-background-color .wp-block-search .wp-block-search__button {
    2362     color: #fff;
    2363     border-color: currentColor;
    2364 }
    2365 
    2366 .has-background.has-gray-background-color .wp-block-search .wp-block-search__button:hover {
    2367     color: #fff;
    2368     background-color: #39414d;
    2369     border-color: #fff;
    2370 }
    2371 
    2372 .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button:hover {
    2373     color: #fff;
    2374     background-color: #39414d;
    2375     border-color: #fff;
    2376 }
    2377 
    2378 .has-background.has-black-background-color .wp-block-search .wp-block-search__button:hover {
    2379     color: #fff;
    2380     background-color: #39414d;
    2381     border-color: #fff;
    2382 }
    2383 
    2384 .is-dark-theme .has-background.has-gray-background-color .wp-block-search .wp-block-search__button:hover {
    2385     color: #d1e4dd;
    2386     background-color: #39414d;
    2387 }
    2388 
    2389 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__button:hover {
    2390     color: #d1e4dd;
    2391     background-color: #39414d;
    2392 }
    2393 
    2394 .is-dark-theme .has-background.has-black-background-color .wp-block-search .wp-block-search__button:hover {
    2395     color: #d1e4dd;
    2396     background-color: #39414d;
    2397 }
    2398 
    2399 .has-background.has-white-background-color .wp-block-search .wp-block-search__button:hover {
    2400     color: #fff;
    2401     background-color: #39414d;
    2402     border-color: #39414d;
    2403 }
    2404 
    2405 .has-background.has-green-background-color .wp-block-search .wp-block-search__button:hover {
    2406     color: #fff;
    2407     background-color: #39414d;
    2408     border-color: #39414d;
    2409 }
    2410 
    2411 .has-background.has-blue-background-color .wp-block-search .wp-block-search__button:hover {
    2412     color: #fff;
    2413     background-color: #39414d;
    2414     border-color: #39414d;
    2415 }
    2416 
    2417 .has-background.has-purple-background-color .wp-block-search .wp-block-search__button:hover {
    2418     color: #fff;
    2419     background-color: #39414d;
    2420     border-color: #39414d;
    2421 }
    2422 
    2423 .has-background.has-red-background-color .wp-block-search .wp-block-search__button:hover {
    2424     color: #fff;
    2425     background-color: #39414d;
    2426     border-color: #39414d;
    2427 }
    2428 
    2429 .has-background.has-orange-background-color .wp-block-search .wp-block-search__button:hover {
    2430     color: #fff;
    2431     background-color: #39414d;
    2432     border-color: #39414d;
    2433 }
    2434 
    2435 .has-background.has-yellow-background-color .wp-block-search .wp-block-search__button:hover {
    2436     color: #fff;
    2437     background-color: #39414d;
    2438     border-color: #39414d;
    2439 }
    2440 
    2441 .is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__button {
    2442     color: #28303d;
    2443     border-color: currentColor;
    2444 }
    2445 
    2446 .is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__button {
    2447     color: #28303d;
    2448     border-color: currentColor;
    2449 }
    2450 
    2451 .is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__button {
    2452     color: #28303d;
    2453     border-color: currentColor;
    2454 }
    2455 
    2456 .is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__button {
    2457     color: #28303d;
    2458     border-color: currentColor;
    2459 }
    2460 
    2461 .is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__button {
    2462     color: #28303d;
    2463     border-color: currentColor;
    2464 }
    2465 
    2466 .is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__button {
    2467     color: #28303d;
    2468     border-color: currentColor;
    2469 }
    2470 
    2471 .is-dark-theme .has-background.has-yellow-background-color .wp-block-search .wp-block-search__button {
    2472     color: #28303d;
    2473     border-color: currentColor;
    2474 }
    2475 
    2476 .is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__button:hover {
    2477     color: #fff;
    2478     background-color: #d1e4dd;
    2479     border-color: #d1e4dd;
    2480 }
    2481 
    2482 .is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__button:hover {
    2483     color: #fff;
    2484     background-color: #d1e4dd;
    2485     border-color: #d1e4dd;
    2486 }
    2487 
    2488 .is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__button:hover {
    2489     color: #fff;
    2490     background-color: #d1e4dd;
    2491     border-color: #d1e4dd;
    2492 }
    2493 
    2494 .is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__button:hover {
    2495     color: #fff;
    2496     background-color: #d1e4dd;
    2497     border-color: #d1e4dd;
    2498 }
    2499 
    2500 .is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__button:hover {
    2501     color: #fff;
    2502     background-color: #d1e4dd;
    2503     border-color: #d1e4dd;
    2504 }
    2505 
    2506 .is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__button:hover {
    2507     color: #fff;
    2508     background-color: #d1e4dd;
    2509     border-color: #d1e4dd;
    2510 }
    2511 
     1878.is-dark-theme .has-background.has-white-background-color .wp-block-search .wp-block-search__button:hover,
     1879.is-dark-theme .has-background.has-green-background-color .wp-block-search .wp-block-search__button:hover,
     1880.is-dark-theme .has-background.has-blue-background-color .wp-block-search .wp-block-search__button:hover,
     1881.is-dark-theme .has-background.has-purple-background-color .wp-block-search .wp-block-search__button:hover,
     1882.is-dark-theme .has-background.has-red-background-color .wp-block-search .wp-block-search__button:hover,
     1883.is-dark-theme .has-background.has-orange-background-color .wp-block-search .wp-block-search__button:hover,
    25121884.is-dark-theme .has-background.has-yellow-background-color .wp-block-search .wp-block-search__button:hover {
    2513     color: #fff;
    2514     background-color: #d1e4dd;
    2515     border-color: #d1e4dd;
     1885    color: var(--global--color-white);
     1886    background-color: var(--button--color-text);
     1887    border-color: var(--button--color-text);
    25161888}
    25171889
    … …  
    25281900
    25291901.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button {
    2530     padding: 15px 30px;
     1902    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    25311903}
    25321904
    25331905.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2534     color: #d1e4dd;
     1906    color: var(--button--color-text);
    25351907    border-color: currentColor;
    25361908}
    25371909
    25381910.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2539     color: #fff;
    2540     background-color: #d1e4dd;
    2541     border-color: #d1e4dd;
    2542 }
    2543 
    2544 .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2545     color: #39414d;
     1911    color: var(--global--color-white);
     1912    background-color: var(--button--color-text);
     1913    border-color: var(--button--color-text);
     1914}
     1915
     1916.has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button,
     1917.has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button,
     1918.has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
     1919    color: var(--button--color-text-hover);
    25461920    border-color: currentColor;
    25471921}
    25481922
    2549 .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2550     color: #39414d;
     1923.has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover,
     1924.has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover,
     1925.has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
     1926    color: var(--global--color-white);
     1927    background-color: var(--button--color-background);
     1928    border-color: var(--button--color-background);
     1929}
     1930
     1931.is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button,
     1932.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button,
     1933.is-dark-theme .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
     1934    color: var(--button--color-text);
    25511935    border-color: currentColor;
    25521936}
    25531937
    2554 .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2555     color: #39414d;
    2556     border-color: currentColor;
    2557 }
    2558 
    2559 .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2560     color: #fff;
    2561     background-color: #39414d;
    2562     border-color: #39414d;
    2563 }
    2564 
    2565 .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2566     color: #fff;
    2567     background-color: #39414d;
    2568     border-color: #39414d;
    2569 }
    2570 
    2571 .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2572     color: #fff;
    2573     background-color: #39414d;
    2574     border-color: #39414d;
    2575 }
    2576 
    2577 .is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2578     color: #d1e4dd;
    2579     border-color: currentColor;
    2580 }
    2581 
    2582 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2583     color: #d1e4dd;
    2584     border-color: currentColor;
    2585 }
    2586 
    2587 .is-dark-theme .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button {
    2588     color: #d1e4dd;
    2589     border-color: currentColor;
    2590 }
    2591 
    2592 .is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2593     color: #fff;
    2594     background-color: #d1e4dd;
    2595     border-color: #d1e4dd;
    2596 }
    2597 
    2598 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2599     color: #fff;
    2600     background-color: #d1e4dd;
    2601     border-color: #d1e4dd;
    2602 }
    2603 
     1938.is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover,
     1939.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover,
    26041940.is-dark-theme .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside .wp-block-search__button:hover {
    2605     color: #fff;
    2606     background-color: #d1e4dd;
    2607     border-color: #d1e4dd;
     1941    color: var(--global--color-white);
     1942    background-color: var(--button--color-text);
     1943    border-color: var(--button--color-text);
    26081944}
    26091945
    … …  
    26161952}
    26171953
    2618 .wp-block-separator {
    2619     border-bottom: 1px solid #28303d;
     1954.wp-block-separator,
     1955hr {
     1956    border-bottom: var(--separator--height) solid var(--separator--border-color);
    26201957    clear: both;
    26211958    opacity: 1;
    26221959}
    26231960
    2624 hr {
    2625     border-bottom: 1px solid #28303d;
    2626     clear: both;
    2627     opacity: 1;
    2628 }
    2629 
    2630 .wp-block-separator[style*="text-align:right"] {
    2631     border-right-color: #28303d;
    2632 }
    2633 
    2634 .wp-block-separator[style*="text-align: right"] {
    2635     border-right-color: #28303d;
    2636 }
    2637 
    2638 hr[style*="text-align:right"] {
    2639     border-right-color: #28303d;
    2640 }
    2641 
     1961.wp-block-separator[style*="text-align:right"],
     1962.wp-block-separator[style*="text-align: right"],
     1963hr[style*="text-align:right"],
    26421964hr[style*="text-align: right"] {
    2643     border-right-color: #28303d;
    2644 }
    2645 
    2646 .wp-block-separator:not(.is-style-dots) {
    2647     max-width: calc(100vw - 30px);
    2648 }
    2649 @media only screen and (min-width: 482px) {
    2650 
    2651     .wp-block-separator:not(.is-style-dots) {
    2652         max-width: min(calc(100vw - 100px), 610px);
    2653     }
    2654 }
    2655 @media only screen and (min-width: 822px) {
    2656 
    2657     .wp-block-separator:not(.is-style-dots) {
    2658         max-width: min(calc(100vw - 200px), 610px);
    2659     }
    2660 }
    2661 
     1965    border-right-color: var(--separator--border-color);
     1966}
     1967
     1968.wp-block-separator:not(.is-style-dots),
    26621969hr:not(.is-style-dots) {
    2663     max-width: calc(100vw - 30px);
    2664 }
    2665 @media only screen and (min-width: 482px) {
    2666 
    2667     hr:not(.is-style-dots) {
    2668         max-width: min(calc(100vw - 100px), 610px);
    2669     }
    2670 }
    2671 @media only screen and (min-width: 822px) {
    2672 
    2673     hr:not(.is-style-dots) {
    2674         max-width: min(calc(100vw - 200px), 610px);
    2675     }
     1970    max-width: var(--responsive--aligndefault-width);
    26761971}
    26771972
    … …  
    26831978}
    26841979
    2685 .wp-block-separator.is-style-twentytwentyone-separator-thick {
    2686     border-bottom-width: 3px;
    2687 }
    2688 
     1980.wp-block-separator.is-style-twentytwentyone-separator-thick,
    26891981hr.is-style-twentytwentyone-separator-thick {
    2690     border-bottom-width: 3px;
     1982    border-bottom-width: calc(3 * var(--separator--height));
    26911983}
    26921984
    … …  
    27102002}
    27112003
    2712 .wp-block-separator.is-style-dots:before {
    2713     color: #28303d;
    2714 }
    2715 
     2004.wp-block-separator.is-style-dots:before,
    27162005hr.is-style-dots:before {
    2717     color: #28303d;
    2718 }
    2719 
    2720 .has-background:not(.has-background-background-color) .wp-block-separator,
    2721 [class*=background-color]:not(.has-background-background-color) .wp-block-separator,
    2722 [style*=background-color]:not(.has-background-background-color) .wp-block-separator,
     2006    color: var(--separator--border-color);
     2007}
     2008
     2009.has-background .wp-block-separator,
     2010[class*=background-color] .wp-block-separator,
     2011[style*=background-color] .wp-block-separator,
    27232012.wp-block-cover[style*=background-image] .wp-block-separator,
    2724 .has-background:not(.has-background-background-color) hr,
    2725 [class*=background-color]:not(.has-background-background-color) hr,
    2726 [style*=background-color]:not(.has-background-background-color) hr,
     2013.has-background hr,
     2014[class*=background-color] hr,
     2015[style*=background-color] hr,
    27272016.wp-block-cover[style*=background-image] hr {
    27282017    border-color: currentColor;
    … …  
    27352024
    27362025.wp-block-social-links.is-style-twentytwentyone-social-icons-color button {
    2737     color: #28303d;
     2026    color: var(--global--color-primary);
    27382027}
    27392028
    … …  
    27422031}
    27432032
    2744 table th {
    2745     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2746 }
    2747 
     2033table th,
    27482034.wp-block-table th {
    2749     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2750 }
    2751 
    2752 table td {
    2753     padding: 10px;
    2754 }
    2755 
    2756 table th {
    2757     padding: 10px;
    2758 }
    2759 
    2760 .wp-block-table td {
    2761     padding: 10px;
    2762 }
    2763 
     2035    font-family: var(--heading--font-family);
     2036}
     2037
     2038table td,
     2039table th,
     2040.wp-block-table td,
    27642041.wp-block-table th {
    2765     padding: 10px;
    2766 }
    2767 
    2768 table.is-style-regular .has-background {
    2769     color: #28303d;
    2770 }
    2771 
    2772 table.is-style-stripes .has-background thead tr {
    2773     color: #28303d;
    2774 }
    2775 
    2776 table.is-style-stripes .has-background tfoot tr {
    2777     color: #28303d;
    2778 }
    2779 
    2780 table.is-style-stripes .has-background tbody tr:nth-child(even) {
    2781     color: #28303d;
    2782 }
    2783 
    2784 .wp-block-table.is-style-regular .has-background {
    2785     color: #28303d;
    2786 }
    2787 
    2788 .wp-block-table.is-style-stripes .has-background thead tr {
    2789     color: #28303d;
    2790 }
    2791 
    2792 .wp-block-table.is-style-stripes .has-background tfoot tr {
    2793     color: #28303d;
    2794 }
    2795 
     2042    padding: calc(0.5 * var(--global--spacing-unit));
     2043}
     2044
     2045table.is-style-regular .has-background,
     2046table.is-style-stripes .has-background thead tr,
     2047table.is-style-stripes .has-background tfoot tr,
     2048table.is-style-stripes .has-background tbody tr:nth-child(even),
     2049.wp-block-table.is-style-regular .has-background,
     2050.wp-block-table.is-style-stripes .has-background thead tr,
     2051.wp-block-table.is-style-stripes .has-background tfoot tr,
    27962052.wp-block-table.is-style-stripes .has-background tbody tr:nth-child(even) {
    2797     color: #28303d;
    2798 }
    2799 
    2800 table.is-style-stripes {
    2801     border-color: #f0f0f0;
    2802 }
    2803 
     2053    color: var(--table--has-background-text-color);
     2054}
     2055
     2056table.is-style-stripes,
    28042057.wp-block-table.is-style-stripes {
    2805     border-color: #f0f0f0;
     2058    border-color: var(--table--stripes-border-color);
    28062059}
    28072060
    … …  
    28132066}
    28142067
    2815 table.is-style-stripes tbody tr:nth-child(odd) {
    2816     background-color: #f0f0f0;
    2817 }
    2818 
     2068table.is-style-stripes tbody tr:nth-child(odd),
    28192069.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    2820     background-color: #f0f0f0;
     2070    background-color: var(--table--stripes-background-color);
    28212071}
    28222072
    … …  
    28432093    font-weight: bold;
    28442094    text-align: left;
    2845     margin-bottom: 20px;
     2095    margin-bottom: var(--global--spacing-unit);
    28462096    color: currentColor;
    28472097}
    … …  
    28492099.wp-calendar-nav {
    28502100    text-align: left;
    2851     margin-top: 10px;
     2101    margin-top: calc(var(--global--spacing-unit) / 2);
    28522102}
    28532103
    … …  
    28742124}
    28752125
    2876 :root .is-extra-small-text {
    2877     font-size: 1rem;
    2878 }
    2879 
     2126:root .is-extra-small-text,
    28802127:root .has-extra-small-font-size {
    2881     font-size: 1rem;
    2882 }
    2883 
    2884 :root .is-small-text {
    2885     font-size: 1.125rem;
    2886 }
    2887 
     2128    font-size: var(--global--font-size-xs);
     2129}
     2130
     2131:root .is-small-text,
    28882132:root .has-small-font-size {
    2889     font-size: 1.125rem;
    2890 }
    2891 
    2892 :root .is-regular-text {
    2893     font-size: 1.25rem;
    2894 }
    2895 
    2896 :root .has-regular-font-size {
    2897     font-size: 1.25rem;
    2898 }
    2899 
    2900 :root .is-normal-font-size {
    2901     font-size: 1.25rem;
    2902 }
    2903 
    2904 :root .has-normal-font-size {
    2905     font-size: 1.25rem;
    2906 }
    2907 
     2133    font-size: var(--global--font-size-sm);
     2134}
     2135
     2136:root .is-regular-text,
     2137:root .has-regular-font-size,
     2138:root .is-normal-font-size,
     2139:root .has-normal-font-size,
    29082140:root .has-medium-font-size {
    2909     font-size: 1.25rem;
    2910 }
    2911 
    2912 :root .is-large-text {
    2913     font-size: 1.5rem;
    2914     line-height: 1.3;
    2915 }
    2916 
     2141    font-size: var(--global--font-size-base);
     2142}
     2143
     2144:root .is-large-text,
    29172145:root .has-large-font-size {
    2918     font-size: 1.5rem;
    2919     line-height: 1.3;
    2920 }
    2921 
    2922 :root .is-larger-text {
    2923     font-size: 2.5rem;
    2924     line-height: 1.3;
    2925 }
    2926 @media only screen and (min-width: 652px) {
    2927 
    2928     :root .is-larger-text {
    2929         font-size: 2.5rem;
    2930     }
    2931 }
    2932 
    2933 :root .has-larger-font-size {
    2934     font-size: 2.5rem;
    2935     line-height: 1.3;
    2936 }
    2937 @media only screen and (min-width: 652px) {
    2938 
    2939     :root .has-larger-font-size {
    2940         font-size: 2.5rem;
    2941     }
    2942 }
    2943 
    2944 :root .is-extra-large-text {
    2945     font-size: 2.5rem;
    2946     line-height: 1.3;
    2947 }
    2948 @media only screen and (min-width: 652px) {
    2949 
    2950     :root .is-extra-large-text {
    2951         font-size: 2.5rem;
    2952     }
    2953 }
    2954 
     2146    font-size: var(--global--font-size-lg);
     2147    line-height: var(--global--line-height-heading);
     2148}
     2149
     2150:root .is-larger-text,
     2151:root .has-larger-font-size,
     2152:root .is-extra-large-text,
    29552153:root .has-extra-large-font-size {
    2956     font-size: 2.5rem;
    2957     line-height: 1.3;
    2958 }
    2959 @media only screen and (min-width: 652px) {
    2960 
    2961     :root .has-extra-large-font-size {
    2962         font-size: 2.5rem;
    2963     }
    2964 }
    2965 
    2966 :root .is-huge-text {
    2967     font-size: 6rem;
    2968     line-height: 1.3;
    2969     font-weight: 300;
    2970 }
    2971 @media only screen and (min-width: 652px) {
    2972 
    2973     :root .is-huge-text {
    2974         font-size: 6rem;
    2975     }
    2976 }
    2977 
     2154    font-size: var(--global--font-size-xl);
     2155    line-height: var(--global--line-height-heading);
     2156}
     2157
     2158:root .is-huge-text,
    29782159:root .has-huge-font-size {
    2979     font-size: 6rem;
    2980     line-height: 1.3;
    2981     font-weight: 300;
    2982 }
    2983 @media only screen and (min-width: 652px) {
    2984 
    2985     :root .has-huge-font-size {
    2986         font-size: 6rem;
    2987     }
    2988 }
    2989 
    2990 :root .is-gigantic-text {
    2991     font-size: 9rem;
    2992     line-height: 1.3;
    2993     font-weight: 300;
    2994 }
    2995 @media only screen and (min-width: 652px) {
    2996 
    2997     :root .is-gigantic-text {
    2998         font-size: 9rem;
    2999     }
    3000 }
    3001 
     2160    font-size: var(--global--font-size-xxl);
     2161    line-height: var(--global--line-height-heading);
     2162    font-weight: var(--heading--font-weight-page-title);
     2163}
     2164
     2165:root .is-gigantic-text,
    30022166:root .has-gigantic-font-size {
    3003     font-size: 9rem;
    3004     line-height: 1.3;
    3005     font-weight: 300;
    3006 }
    3007 @media only screen and (min-width: 652px) {
    3008 
    3009     :root .has-gigantic-font-size {
    3010         font-size: 9rem;
    3011     }
     2167    font-size: var(--global--font-size-xxxl);
     2168    line-height: var(--global--line-height-heading);
     2169    font-weight: var(--heading--font-weight-page-title);
    30122170}
    30132171
    … …  
    30172175*/
    30182176.wp-block.editor-post-title__block {
    3019     border-bottom: 3px solid #28303d;
    3020     padding-bottom: 60px;
    3021     margin-bottom: 90px;
    3022     max-width: calc(100vw - 30px);
    3023 }
    3024 @media only screen and (min-width: 482px) {
    3025 
    3026     .wp-block.editor-post-title__block {
    3027         max-width: calc(100vw - 100px);
    3028     }
    3029 }
    3030 @media only screen and (min-width: 822px) {
    3031 
    3032     .wp-block.editor-post-title__block {
    3033         max-width: min(calc(100vw - 200px), 1240px);
    3034     }
     2177    border-bottom: 3px solid var(--global--color-border);
     2178    padding-bottom: calc(2 * var(--global--spacing-vertical));
     2179    margin-bottom: calc(3 * var(--global--spacing-vertical));
     2180    max-width: var(--responsive--alignwide-width);
    30352181}
    30362182
    30372183.wp-block.editor-post-title__block .editor-post-title__input {
    3038     color: #39414d;
    3039     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3040     font-size: 4rem;
    3041     font-weight: 300;
    3042     line-height: 1.1;
    3043 }
    3044 @media only screen and (min-width: 652px) {
    3045 
    3046     .wp-block.editor-post-title__block .editor-post-title__input {
    3047         font-size: 6rem;
    3048     }
     2184    color: var(--global--color-secondary);
     2185    font-family: var(--heading--font-family);
     2186    font-size: var(--global--font-size-page-title);
     2187    font-weight: var(--heading--font-weight-page-title);
     2188    line-height: var(--heading--line-height-h1);
    30492189}
    30502190
    30512191.wp-block.block-editor-default-block-appender > textarea {
    3052     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3053     font-size: 1.25rem;
     2192    font-family: var(--global--font-secondary);
     2193    font-size: var(--global--font-size-md);
    30542194}
    30552195
    30562196.has-primary-color[class] {
    3057     color: #28303d;
     2197    color: var(--global--color-primary);
    30582198}
    30592199
    30602200.has-secondary-color[class] {
    3061     color: #39414d;
    3062 }
    3063 
    3064 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     2201    color: var(--global--color-secondary);
     2202}
     2203
     2204.has-background a,
    30652205.has-background p,
    30662206.has-background h1,
    … …  
    30742214
    30752215.has-primary-background-color[class] {
    3076     background-color: #28303d;
    3077     color: #d1e4dd;
     2216    background-color: var(--global--color-primary);
     2217    color: var(--global--color-background);
    30782218}
    30792219
    30802220.has-secondary-background-color[class] {
    3081     background-color: #39414d;
    3082     color: #d1e4dd;
     2221    background-color: var(--global--color-secondary);
     2222    color: var(--global--color-background);
    30832223}
    30842224
    30852225.has-white-background-color[class] {
    3086     background-color: #fff;
    3087     color: #39414d;
     2226    background-color: var(--global--color-white);
     2227    color: var(--global--color-secondary);
    30882228}
    30892229
    30902230.has-black-background-color[class] {
    3091     background-color: #000;
    3092     color: #28303d;
    3093 }
    3094 
    3095 /**
    3096  * Spacing Overrides
    3097  */
     2231    background-color: var(--global--color-black);
     2232    color: var(--global--color-primary);
     2233}
     2234
    30982235[data-block] {
    3099     margin-top: 30px;
    3100     margin-bottom: 30px;
    3101 }
    3102 
    3103 [data-block] [data-block]:first-child {
    3104     margin-top: 0;
    3105 }
    3106 
    3107 [data-block] [data-block]:nth-last-child(2) {
    3108     margin-bottom: 0;
    3109 }
    3110 
    3111 /* Block Alignments */
     2236    margin-top: var(--global--spacing-vertical);
     2237    margin-bottom: var(--global--spacing-vertical);
     2238}
     2239
    31122240.wp-block {
    3113     max-width: calc(100vw - 30px);
    3114 }
    3115 @media only screen and (min-width: 482px) {
    3116 
    3117     .wp-block {
    3118         max-width: min(calc(100vw - 100px), 610px);
    3119     }
    3120 }
    3121 @media only screen and (min-width: 822px) {
    3122 
    3123     .wp-block {
    3124         max-width: min(calc(100vw - 200px), 610px);
    3125     }
    3126 }
    3127 
    3128 .wp-block[data-align=wide] {
    3129     max-width: calc(100vw - 30px);
    3130 }
    3131 @media only screen and (min-width: 482px) {
    3132 
    3133     .wp-block[data-align=wide] {
    3134         max-width: calc(100vw - 100px);
    3135     }
    3136 }
    3137 @media only screen and (min-width: 822px) {
    3138 
    3139     .wp-block[data-align=wide] {
    3140         max-width: min(calc(100vw - 200px), 1240px);
    3141     }
    3142 }
    3143 
     2241    max-width: var(--responsive--aligndefault-width);
     2242}
     2243
     2244.wp-block[data-align=wide],
    31442245.wp-block.alignwide {
    3145     max-width: calc(100vw - 30px);
    3146 }
    3147 @media only screen and (min-width: 482px) {
    3148 
    3149     .wp-block.alignwide {
    3150         max-width: calc(100vw - 100px);
    3151     }
    3152 }
    3153 @media only screen and (min-width: 822px) {
    3154 
    3155     .wp-block.alignwide {
    3156         max-width: min(calc(100vw - 200px), 1240px);
    3157     }
     2246    max-width: var(--responsive--alignwide-width);
    31582247}
    31592248
    … …  
    31652254.alignleft {
    31662255    margin: 0;
    3167     margin-right: 25px;
     2256    margin-right: var(--global--spacing-horizontal);
    31682257}
    31692258
    31702259.alignright {
    31712260    margin: 0;
    3172     margin-left: 25px;
     2261    margin-left: var(--global--spacing-horizontal);
    31732262}
    31742263
    31752264.has-drop-cap:not(:focus)::first-letter {
    3176     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3177     font-weight: normal;
     2265    font-family: var(--heading--font-family);
     2266    font-weight: var(--heading--font-weight);
    31782267    line-height: 0.66;
    31792268    text-transform: uppercase;
    … …  
    31812270    float: left;
    31822271    margin: 0.1em 0.1em 0 0;
    3183     font-size: 5rem;
    3184 }
    3185 
    3186 @media only screen and (min-width: 652px) {
    3187 
    3188     .has-drop-cap:not(:focus)::first-letter {
    3189         font-size: 7rem;
    3190     }
     2272    font-size: calc(1.2 * var(--heading--font-size-h1));
    31912273}
    31922274
    … …  
    31952277    .wp-block[data-align=left] > * {
    31962278        max-width: 290px;
    3197         margin-right: 25px;
     2279        margin-right: var(--global--spacing-horizontal);
    31982280    }
    31992281
    32002282    .wp-block[data-align=right] > * {
    32012283        max-width: 290px;
    3202         margin-left: 25px;
    3203     }
     2284        margin-left: var(--global--spacing-horizontal);
     2285    }
     2286}
     2287
     2288.wp-block-freeform.block-library-rich-text__tinymce blockquote {
     2289    border: none;
     2290}
     2291
     2292.wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
     2293    left: 5px;
    32042294}
    32052295
    32062296html {
    3207     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3208     line-height: 1.7;
     2297    font-family: var(--global--font-secondary);
     2298    line-height: var(--global--line-height-body);
    32092299}
    32102300
    32112301body {
    3212     color: #28303d;
    3213     background-color: #d1e4dd;
    3214     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3215     font-size: 1.25rem;
     2302    --wp--typography--line-height: var(--global--line-height-body);
     2303    color: var(--global--color-primary);
     2304    background-color: var(--global--color-background);
     2305    font-family: var(--global--font-secondary);
     2306    font-size: var(--global--font-size-base);
    32162307    font-weight: normal;
    32172308    -moz-osx-font-smoothing: grayscale;
    … …  
    32202311
    32212312.wp-block a {
    3222     color: #28303d;
     2313    color: var(--wp--style--color--link, var(--global--color-primary));
    32232314}
    32242315
    … …  
    32282319
    32292320.wp-block a:focus {
    3230     outline: 2px solid #28303d;
     2321    outline: 2px solid var(--wp--style--color--link, var(--global--color-primary));
    32312322    text-decoration: none;
    32322323}
    32332324
    3234 .has-background:not(.has-background-background-color) .has-link-color a {
    3235     color: #28303d;
    3236 }
    3237 
    3238 .has-background:not(.has-background-background-color).has-link-color a {
    3239     color: #28303d;
     2325.has-background .has-link-color a,
     2326.has-background.has-link-color a {
     2327    color: var(--wp--style--color--link, var(--global--color-primary));
    32402328}
    32412329
    … …  
    32462334
    32472335.has-black-color[class] {
    3248     color: #000;
     2336    color: var(--global--color-black);
    32492337}
    32502338
    32512339.has-gray-color[class] {
    3252     color: #39414d;
     2340    color: var(--global--color-gray);
    32532341}
    32542342
    32552343.has-dark-gray-color[class] {
    3256     color: #28303d;
     2344    color: var(--global--color-dark-gray);
    32572345}
    32582346
    32592347.has-green-color[class] {
    3260     color: #d1e4dd;
     2348    color: var(--global--color-green);
    32612349}
    32622350
    32632351.has-blue-color[class] {
    3264     color: #d1dfe4;
     2352    color: var(--global--color-blue);
    32652353}
    32662354
    32672355.has-purple-color[class] {
    3268     color: #d1d1e4;
     2356    color: var(--global--color-purple);
    32692357}
    32702358
    32712359.has-red-color[class] {
    3272     color: #e4d1d1;
     2360    color: var(--global--color-red);
    32732361}
    32742362
    32752363.has-orange-color[class] {
    3276     color: #e4dad1;
     2364    color: var(--global--color-orange);
    32772365}
    32782366
    32792367.has-yellow-color[class] {
    3280     color: #eeeadd;
     2368    color: var(--global--color-yellow);
    32812369}
    32822370
    32832371.has-white-color[class] {
    3284     color: #fff;
    3285 }
    3286 
    3287 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     2372    color: var(--global--color-white);
     2373}
     2374
     2375.has-background a,
    32882376.has-background p,
    32892377.has-background h1,
    … …  
    32972385
    32982386.has-black-background-color[class] {
    3299     background-color: #000;
     2387    background-color: var(--global--color-black);
    33002388}
    33012389
    33022390.has-gray-background-color[class] {
    3303     background-color: #39414d;
     2391    background-color: var(--global--color-gray);
    33042392}
    33052393
    33062394.has-dark-gray-background-color[class] {
    3307     background-color: #28303d;
     2395    background-color: var(--global--color-dark-gray);
    33082396}
    33092397
    33102398.has-green-background-color[class] {
    3311     background-color: #d1e4dd;
     2399    background-color: var(--global--color-green);
    33122400}
    33132401
    33142402.has-blue-background-color[class] {
    3315     background-color: #d1dfe4;
     2403    background-color: var(--global--color-blue);
    33162404}
    33172405
    33182406.has-purple-background-color[class] {
    3319     background-color: #d1d1e4;
     2407    background-color: var(--global--color-purple);
    33202408}
    33212409
    33222410.has-red-background-color[class] {
    3323     background-color: #e4d1d1;
     2411    background-color: var(--global--color-red);
    33242412}
    33252413
    33262414.has-orange-background-color[class] {
    3327     background-color: #e4dad1;
     2415    background-color: var(--global--color-orange);
    33282416}
    33292417
    33302418.has-yellow-background-color[class] {
    3331     background-color: #eeeadd;
     2419    background-color: var(--global--color-yellow);
    33322420}
    33332421
    33342422.has-white-background-color[class] {
    3335     background-color: #fff;
    3336 }
    3337 
    3338 :not(.has-text-color).has-black-background-color[class] {
    3339     color: #fff;
    3340 }
    3341 
    3342 :not(.has-text-color).has-gray-background-color[class] {
    3343     color: #fff;
    3344 }
    3345 
     2423    background-color: var(--global--color-white);
     2424}
     2425
     2426:not(.has-text-color).has-black-background-color[class],
     2427:not(.has-text-color).has-gray-background-color[class],
    33462428:not(.has-text-color).has-dark-gray-background-color[class] {
    3347     color: #fff;
    3348 }
    3349 
    3350 :not(.has-text-color).has-green-background-color[class] {
    3351     color: #28303d;
    3352 }
    3353 
    3354 :not(.has-text-color).has-blue-background-color[class] {
    3355     color: #28303d;
    3356 }
    3357 
    3358 :not(.has-text-color).has-purple-background-color[class] {
    3359     color: #28303d;
    3360 }
    3361 
    3362 :not(.has-text-color).has-red-background-color[class] {
    3363     color: #28303d;
    3364 }
    3365 
    3366 :not(.has-text-color).has-orange-background-color[class] {
    3367     color: #28303d;
    3368 }
    3369 
    3370 :not(.has-text-color).has-yellow-background-color[class] {
    3371     color: #28303d;
    3372 }
    3373 
     2429    color: var(--global--color-white);
     2430}
     2431
     2432:not(.has-text-color).has-green-background-color[class],
     2433:not(.has-text-color).has-blue-background-color[class],
     2434:not(.has-text-color).has-purple-background-color[class],
     2435:not(.has-text-color).has-red-background-color[class],
     2436:not(.has-text-color).has-orange-background-color[class],
     2437:not(.has-text-color).has-yellow-background-color[class],
    33742438:not(.has-text-color).has-white-background-color[class] {
    3375     color: #28303d;
     2439    color: var(--global--color-dark-gray);
    33762440}
    33772441
    33782442.has-purple-to-yellow-gradient-background {
    3379     background: linear-gradient(160deg, #d1d1e4, #eeeadd);
     2443    background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow));
    33802444}
    33812445
    33822446.has-yellow-to-purple-gradient-background {
    3383     background: linear-gradient(160deg, #eeeadd, #d1d1e4);
     2447    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple));
    33842448}
    33852449
    33862450.has-green-to-yellow-gradient-background {
    3387     background: linear-gradient(160deg, #d1e4dd, #eeeadd);
     2451    background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow));
    33882452}
    33892453
    33902454.has-yellow-to-green-gradient-background {
    3391     background: linear-gradient(160deg, #eeeadd, #d1e4dd);
     2455    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green));
    33922456}
    33932457
    33942458.has-red-to-yellow-gradient-background {
    3395     background: linear-gradient(160deg, #e4d1d1, #eeeadd);
     2459    background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow));
    33962460}
    33972461
    33982462.has-yellow-to-red-gradient-background {
    3399     background: linear-gradient(160deg, #eeeadd, #e4d1d1);
     2463    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red));
    34002464}
    34012465
    34022466.has-purple-to-red-gradient-background {
    3403     background: linear-gradient(160deg, #d1d1e4, #e4d1d1);
     2467    background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red));
    34042468}
    34052469
    34062470.has-red-to-purple-gradient-background {
    3407     background: linear-gradient(160deg, #e4d1d1, #d1d1e4);
    3408 }
     2471    background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple));
     2472}

  • trunk/src/wp-content/themes/twentytwentyone/assets/css/ie.css

    r49633 r49726  
    102102
    103103    /* Font Family */
     104    --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
     105    --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
    104106
    105107    /* Font Size */
     108    --global--font-size-base: 1.25rem;
     109    --global--font-size-xs: 1rem;
     110    --global--font-size-sm: 1.125rem;
     111    --global--font-size-md: 1.25rem;
     112    --global--font-size-lg: 1.5rem;
     113    --global--font-size-xl: 2.25rem;
     114    --global--font-size-xxl: 4rem;
     115    --global--font-size-xxxl: 5rem;
     116    --global--font-size-page-title: var(--global--font-size-xxl);
     117    --global--letter-spacing: normal;
    106118
    107119    /* Line Height */
     120    --global--line-height-body: 1.7;
     121    --global--line-height-heading: 1.3;
     122    --global--line-height-page-title: 1.1;
    108123
    109124    /* Headings */
     125    --heading--font-family: var(--global--font-primary);
     126    --heading--font-size-h6: var(--global--font-size-xs);
     127    --heading--font-size-h5: var(--global--font-size-sm);
     128    --heading--font-size-h4: var(--global--font-size-lg);
     129    --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
     130    --heading--font-size-h2: var(--global--font-size-xl);
     131    --heading--font-size-h1: var(--global--font-size-page-title);
     132    --heading--letter-spacing-h6: 0.05em;
     133    --heading--letter-spacing-h5: 0.05em;
     134    --heading--letter-spacing-h4: var(--global--letter-spacing);
     135    --heading--letter-spacing-h3: var(--global--letter-spacing);
     136    --heading--letter-spacing-h2: var(--global--letter-spacing);
     137    --heading--letter-spacing-h1: var(--global--letter-spacing);
     138    --heading--line-height-h6: var(--global--line-height-heading);
     139    --heading--line-height-h5: var(--global--line-height-heading);
     140    --heading--line-height-h4: var(--global--line-height-heading);
     141    --heading--line-height-h3: var(--global--line-height-heading);
     142    --heading--line-height-h2: var(--global--line-height-heading);
     143    --heading--line-height-h1: var(--global--line-height-page-title);
     144    --heading--font-weight: normal;
     145    --heading--font-weight-page-title: 300;
     146    --heading--font-weight-strong: 600;
    110147
    111148    /* Block: Latest posts */
     149    --latest-posts--title-font-family: var(--heading--font-family);
     150    --latest-posts--title-font-size: var(--heading--font-size-h3);
     151    --latest-posts--description-font-family: var(--global--font-secondary);
     152    --latest-posts--description-font-size: var(--global--font-size-sm);
     153    --list--font-family: var(--global--font-secondary);
     154    --definition-term--font-family: var(--global--font-primary);
    112155
    113156    /* Colors */
     157    --global--color-black: #000;
     158    --global--color-dark-gray: #28303d;
     159    --global--color-gray: #39414d;
     160    --global--color-light-gray: #f0f0f0;
     161    --global--color-green: #d1e4dd;
     162    --global--color-blue: #d1dfe4;
     163    --global--color-purple: #d1d1e4;
     164    --global--color-red: #e4d1d1;
     165    --global--color-orange: #e4dad1;
     166    --global--color-yellow: #eeeadd;
     167    --global--color-white: #fff;
     168    --global--color-white-50: rgba(255, 255, 255, 0.5);
     169    --global--color-white-90: rgba(255, 255, 255, 0.9);
     170    --global--color-primary: var(--global--color-dark-gray);
    114171
    115172    /* Body text color, site title, footer text color. */
     173    --global--color-secondary: var(--global--color-gray);
    116174
    117175    /* Headings */
     176    --global--color-primary-hover: var(--global--color-primary);
     177    --global--color-background: var(--global--color-green);
    118178
    119179    /* Mint, default body background */
     180    --global--color-border: var(--global--color-primary);
    120181
    121182    /* Used for borders (separators) */
    122183
    123184    /* Spacing */
     185    --global--spacing-unit: 20px;
     186    --global--spacing-measure: unset;
     187    --global--spacing-horizontal: 25px;
     188    --global--spacing-vertical: 30px;
    124189
    125190    /* Elevation */
     191    --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
    126192
    127193    /* Forms */
     194    --form--font-family: var(--global--font-secondary);
     195    --form--font-size: var(--global--font-size-sm);
     196    --form--line-height: var(--global--line-height-body);
     197    --form--color-text: var(--global--color-dark-gray);
     198    --form--color-ranged: var(--global--color-secondary);
     199    --form--label-weight: 500;
     200    --form--border-color: var(--global--color-secondary);
     201    --form--border-width: 3px;
     202    --form--border-radius: 0;
     203    --form--spacing-unit: calc(0.5 * var(--global--spacing-unit));
    128204
    129205    /* Cover block */
     206    --cover--height: calc(15 * var(--global--spacing-vertical));
     207    --cover--color-foreground: var(--global--color-white);
     208    --cover--color-background: var(--global--color-black);
    130209
    131210    /* Buttons */
     211    --button--color-text: var(--global--color-background);
     212    --button--color-text-hover: var(--global--color-secondary);
     213    --button--color-text-active: var(--global--color-secondary);
     214    --button--color-background: var(--global--color-secondary);
     215    --button--color-background-active: var(--global--color-background);
     216    --button--font-family: var(--global--font-primary);
     217    --button--font-size: var(--global--font-size-base);
     218    --button--font-weight: 500;
     219    --button--line-height: 1.5;
     220    --button--border-width: 3px;
     221    --button--border-radius: 0;
     222    --button--padding-vertical: 15px;
     223    --button--padding-horizontal: calc(2 * var(--button--padding-vertical));
    132224
    133225    /* entry */
     226    --entry-header--color: var(--global--color-primary);
     227    --entry-header--color-link: currentColor;
     228    --entry-header--color-hover: var(--global--color-primary-hover);
     229    --entry-header--color-focus: var(--global--color-secondary);
     230    --entry-header--font-size: var(--heading--font-size-h2);
     231    --entry-content--font-family: var(--global--font-secondary);
     232    --entry-author-bio--font-family: var(--heading--font-family);
     233    --entry-author-bio--font-size: var(--heading--font-size-h4);
    134234
    135235    /* Header */
     236    --branding--color-text: var(--global--color-primary);
     237    --branding--color-link: var(--global--color-primary);
     238    --branding--color-link-hover: var(--global--color-secondary);
     239    --branding--title--font-family: var(--global--font-primary);
     240    --branding--title--font-size: var(--global--font-size-lg);
     241    --branding--title--font-size-mobile: var(--heading--font-size-h4);
     242    --branding--title--font-weight: normal;
     243    --branding--title--text-transform: uppercase;
     244    --branding--description--font-family: var(--global--font-secondary);
     245    --branding--description--font-size: var(--global--font-size-sm);
     246    --branding--description--font-family: var(--global--font-secondary);
     247    --branding--logo--max-width: 300px;
     248    --branding--logo--max-height: 100px;
     249    --branding--logo--max-width-mobile: 96px;
     250    --branding--logo--max-height-mobile: 96px;
    136251
    137252    /* Main navigation */
     253    --primary-nav--font-family: var(--global--font-secondary);
     254    --primary-nav--font-family-mobile: var(--global--font-primary);
     255    --primary-nav--font-size: var(--global--font-size-md);
     256    --primary-nav--font-size-sub-menu: var(--global--font-size-xs);
     257    --primary-nav--font-size-mobile: var(--global--font-size-sm);
     258    --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);
     259    --primary-nav--font-size-button: var(--global--font-size-xs);
     260    --primary-nav--font-style: normal;
     261    --primary-nav--font-style-sub-menu-mobile: normal;
     262    --primary-nav--font-weight: normal;
     263    --primary-nav--font-weight-button: 500;
     264    --primary-nav--color-link: var(--global--color-primary);
     265    --primary-nav--color-link-hover: var(--global--color-primary-hover);
     266    --primary-nav--color-text: var(--global--color-primary);
     267    --primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
     268    --primary-nav--border-color: var(--global--color-primary);
    138269
    139270    /* Pagination */
     271    --pagination--color-text: var(--global--color-primary);
     272    --pagination--color-link-hover: var(--global--color-primary-hover);
     273    --pagination--font-family: var(--global--font-secondary);
     274    --pagination--font-size: var(--global--font-size-lg);
     275    --pagination--font-weight: normal;
     276    --pagination--font-weight-strong: 600;
    140277
    141278    /* Footer */
     279    --footer--color-text: var(--global--color-primary);
     280    --footer--color-link: var(--global--color-primary);
     281    --footer--color-link-hover: var(--global--color-primary-hover);
     282    --footer--font-family: var(--global--font-primary);
     283    --footer--font-size: var(--global--font-size-sm);
    142284
    143285    /* Block: Pull quote */
     286    --pullquote--font-family: var(--global--font-primary);
     287    --pullquote--font-size: var(--heading--font-size-h3);
     288    --pullquote--font-style: normal;
     289    --pullquote--letter-spacing: var(--heading--letter-spacing-h4);
     290    --pullquote--line-height: var(--global--line-height-heading);
     291    --pullquote--border-width: 3px;
     292    --pullquote--border-color: var(--global--color-primary);
     293    --pullquote--color-foreground: var(--global--color-primary);
     294    --pullquote--color-background: var(--global--color-background);
     295    --quote--font-family: var(--global--font-secondary);
     296    --quote--font-size: var(--global--font-size-md);
     297    --quote--font-size-large: var(--global--font-size-xl);
     298    --quote--font-style: normal;
     299    --quote--font-weight: 700;
     300    --quote--font-weight-strong: bolder;
     301    --quote--font-style-large: normal;
     302    --quote--font-style-cite: normal;
     303    --quote--line-height: var(--global--line-height-body);
     304    --quote--line-height-large: 1.35;
     305    --separator--border-color: var(--global--color-border);
     306    --separator--height: 1px;
    144307
    145308    /* Block: Table */
     309    --table--stripes-border-color: var(--global--color-light-gray);
     310    --table--stripes-background-color: var(--global--color-light-gray);
     311    --table--has-background-text-color: var(--global--color-dark-gray);
    146312
    147313    /* Widgets */
     314    --widget--line-height-list: 1.9;
     315    --widget--line-height-title: 1.4;
     316    --widget--font-weight-title: 700;
     317    --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit));
    148318
    149319    /* Admin-bar height */
     320    --global--admin-bar--height: 0;
     321}
     322
     323.admin-bar {
     324    --global--admin-bar--height: 32px;
     325}
     326@media only screen and (max-width: 782px) {
     327
     328    .admin-bar {
     329        --global--admin-bar--height: 46px;
     330    }
     331}
     332
     333@media only screen and (min-width: 652px) {
     334
     335    :root {
     336        --global--font-size-xl: 2.5rem;
     337        --global--font-size-xxl: 6rem;
     338        --global--font-size-xxxl: 9rem;
     339        --heading--font-size-h3: 2rem;
     340        --heading--font-size-h2: 3rem;
     341    }
    150342}
    151343
    … …  
    540732 * Root Media Query Variables
    541733 */
     734:root {
     735    --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6);
     736    --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal));
     737    --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal));
     738    --responsive--alignfull-width: 100%;
     739    --responsive--alignright-margin: var(--global--spacing-horizontal);
     740    --responsive--alignleft-margin: var(--global--spacing-horizontal);
     741}
     742
     743@media only screen and (min-width: 482px) {
     744
     745    :root {
     746        --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), 610px);
     747        --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal));
     748        --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
     749        --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
     750    }
     751}
     752@media only screen and (min-width: 822px) {
     753
     754    :root {
     755        --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 610px);
     756        --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1240px);
     757    }
     758}
    542759
    543760/**
    544761 * Extends
    545762 */
    546 .post-thumbnail {
    547     max-width: calc(100vw - 30px);
     763.post-thumbnail,
     764.entry-content .wp-audio-shortcode,
     765.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
     766*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
     767.default-max-width {
     768    max-width: var(--responsive--aligndefault-width);
    548769    margin-left: auto;
    549770    margin-right: auto;
    550771}
    551 @media only screen and (min-width: 482px) {
    552 
    553     .post-thumbnail {
    554         max-width: min(calc(100vw - 100px), 610px);
    555     }
    556 }
    557 @media only screen and (min-width: 822px) {
    558 
    559     .post-thumbnail {
    560         max-width: min(calc(100vw - 200px), 610px);
    561     }
    562 }
    563 
    564 .entry-content .wp-audio-shortcode {
    565     max-width: calc(100vw - 30px);
     772
     773.widget-area,
     774.pagination,
     775.comments-pagination,
     776.post-navigation,
     777.site-footer,
     778.site-header,
     779.alignwide,
     780.wide-max-width {
     781    max-width: var(--responsive--alignwide-width);
    566782    margin-left: auto;
    567783    margin-right: auto;
    568784}
    569 @media only screen and (min-width: 482px) {
    570 
    571     .entry-content .wp-audio-shortcode {
    572         max-width: min(calc(100vw - 100px), 610px);
    573     }
    574 }
    575 @media only screen and (min-width: 822px) {
    576 
    577     .entry-content .wp-audio-shortcode {
    578         max-width: min(calc(100vw - 200px), 610px);
    579     }
    580 }
    581 
    582 .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    583     max-width: calc(100vw - 30px);
     785
     786.alignfull,
     787.wp-block-group .wp-block-group__inner-container > *.alignfull,
     788.full-max-width {
     789    max-width: var(--responsive--alignfull-width);
     790    width: var(--responsive--alignfull-width);
    584791    margin-left: auto;
    585792    margin-right: auto;
    586793}
     794
    587795@media only screen and (min-width: 482px) {
    588796
    589     .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    590         max-width: min(calc(100vw - 100px), 610px);
    591     }
    592 }
    593 @media only screen and (min-width: 822px) {
    594 
    595     .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    596         max-width: min(calc(100vw - 200px), 610px);
    597     }
    598 }
    599 
    600 *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    601     max-width: calc(100vw - 30px);
    602     margin-left: auto;
    603     margin-right: auto;
    604 }
    605 @media only screen and (min-width: 482px) {
    606 
    607     *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    608         max-width: min(calc(100vw - 100px), 610px);
    609     }
    610 }
    611 @media only screen and (min-width: 822px) {
    612 
    613     *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
    614         max-width: min(calc(100vw - 200px), 610px);
    615     }
    616 }
    617 
    618 .default-max-width {
    619     max-width: calc(100vw - 30px);
    620     margin-left: auto;
    621     margin-right: auto;
    622 }
    623 @media only screen and (min-width: 482px) {
    624 
    625     .default-max-width {
    626         max-width: min(calc(100vw - 100px), 610px);
    627     }
    628 }
    629 @media only screen and (min-width: 822px) {
    630 
    631     .default-max-width {
    632         max-width: min(calc(100vw - 200px), 610px);
    633     }
    634 }
    635 
    636 .widget-area {
    637     max-width: calc(100vw - 30px);
    638     margin-left: auto;
    639     margin-right: auto;
    640 }
    641 
    642 @media only screen and (min-width: 482px) {
    643 
    644     .widget-area {
    645         max-width: calc(100vw - 100px);
    646     }
    647 }
    648 
    649 @media only screen and (min-width: 822px) {
    650 
    651     .widget-area {
    652         max-width: min(calc(100vw - 200px), 1240px);
    653     }
    654 }
    655 
    656 .pagination {
    657     max-width: calc(100vw - 30px);
    658     margin-left: auto;
    659     margin-right: auto;
    660 }
    661 
    662 @media only screen and (min-width: 482px) {
    663 
    664     .pagination {
    665         max-width: calc(100vw - 100px);
    666     }
    667 }
    668 
    669 @media only screen and (min-width: 822px) {
    670 
    671     .pagination {
    672         max-width: min(calc(100vw - 200px), 1240px);
    673     }
    674 }
    675 
    676 .comments-pagination {
    677     max-width: calc(100vw - 30px);
    678     margin-left: auto;
    679     margin-right: auto;
    680 }
    681 
    682 @media only screen and (min-width: 482px) {
    683 
    684     .comments-pagination {
    685         max-width: calc(100vw - 100px);
    686     }
    687 }
    688 
    689 @media only screen and (min-width: 822px) {
    690 
    691     .comments-pagination {
    692         max-width: min(calc(100vw - 200px), 1240px);
    693     }
    694 }
    695 
    696 .post-navigation {
    697     max-width: calc(100vw - 30px);
    698     margin-left: auto;
    699     margin-right: auto;
    700 }
    701 
    702 @media only screen and (min-width: 482px) {
    703 
    704     .post-navigation {
    705         max-width: calc(100vw - 100px);
    706     }
    707 }
    708 
    709 @media only screen and (min-width: 822px) {
    710 
    711     .post-navigation {
    712         max-width: min(calc(100vw - 200px), 1240px);
    713     }
    714 }
    715 
    716 .site-footer {
    717     max-width: calc(100vw - 30px);
    718     margin-left: auto;
    719     margin-right: auto;
    720 }
    721 
    722 @media only screen and (min-width: 482px) {
    723 
    724     .site-footer {
    725         max-width: calc(100vw - 100px);
    726     }
    727 }
    728 
    729 @media only screen and (min-width: 822px) {
    730 
    731     .site-footer {
    732         max-width: min(calc(100vw - 200px), 1240px);
    733     }
    734 }
    735 
    736 .site-header {
    737     max-width: calc(100vw - 30px);
    738     margin-left: auto;
    739     margin-right: auto;
    740 }
    741 
    742 @media only screen and (min-width: 482px) {
    743 
    744     .site-header {
    745         max-width: calc(100vw - 100px);
    746     }
    747 }
    748 
    749 @media only screen and (min-width: 822px) {
    750 
    751     .site-header {
    752         max-width: min(calc(100vw - 200px), 1240px);
    753     }
    754 }
    755 
    756 .alignwide {
    757     max-width: calc(100vw - 30px);
    758     margin-left: auto;
    759     margin-right: auto;
    760 }
    761 
    762 @media only screen and (min-width: 482px) {
    763 
    764     .alignwide {
    765         max-width: calc(100vw - 100px);
    766     }
    767 }
    768 
    769 @media only screen and (min-width: 822px) {
    770 
    771     .alignwide {
    772         max-width: min(calc(100vw - 200px), 1240px);
    773     }
    774 }
    775 
    776 .wide-max-width {
    777     max-width: calc(100vw - 30px);
    778     margin-left: auto;
    779     margin-right: auto;
    780 }
    781 
    782 @media only screen and (min-width: 482px) {
    783 
    784     .wide-max-width {
    785         max-width: calc(100vw - 100px);
    786     }
    787 }
    788 
    789 @media only screen and (min-width: 822px) {
    790 
    791     .wide-max-width {
    792         max-width: min(calc(100vw - 200px), 1240px);
    793     }
    794 }
    795 
    796 .alignfull {
    797     max-width: 100%;
    798     width: 100%;
    799     margin-left: auto;
    800     margin-right: auto;
    801 }
    802 
    803 .wp-block-group .wp-block-group__inner-container > *.alignfull {
    804     max-width: 100%;
    805     width: 100%;
    806     margin-left: auto;
    807     margin-right: auto;
    808 }
    809 
    810 .full-max-width {
    811     max-width: 100%;
    812     width: 100%;
    813     margin-left: auto;
    814     margin-right: auto;
    815 }
    816 
    817 @media only screen and (min-width: 482px) {
    818 
    819     .alignfull {
    820         max-width: 100%;
     797    .alignfull,
     798    .full-max-width {
     799        max-width: var(--responsive--alignfull-width);
    821800        width: auto;
    822801        margin-left: auto;
    823802        margin-right: auto;
    824803    }
    825 
    826     .full-max-width {
    827         max-width: 100%;
    828         width: auto;
    829         margin-left: auto;
    830         margin-right: auto;
    831     }
    832 }
    833 
    834 .entry-header .post-thumbnail {
    835     margin-left: auto;
    836     margin-right: auto;
    837     width: calc(100vw - 30px);
    838     max-width: 100%;
    839 }
    840 @media only screen and (min-width: 482px) {
    841 
    842     .entry-header .post-thumbnail {
    843         width: calc(100vw - 100px);
    844     }
    845 }
    846 @media only screen and (min-width: 822px) {
    847 
    848     .entry-header .post-thumbnail {
    849         width: min(calc(100vw - 200px), 1240px);
    850     }
    851 }
    852 
    853 .singular .post-thumbnail {
    854     margin-left: auto;
    855     margin-right: auto;
    856     width: calc(100vw - 30px);
    857     max-width: 100%;
    858 }
    859 @media only screen and (min-width: 482px) {
    860 
    861     .singular .post-thumbnail {
    862         width: calc(100vw - 100px);
    863     }
    864 }
    865 @media only screen and (min-width: 822px) {
    866 
    867     .singular .post-thumbnail {
    868         width: min(calc(100vw - 200px), 1240px);
    869     }
    870 }
    871 
    872 .alignfull [class*=inner-container] > .alignwide {
    873     margin-left: auto;
    874     margin-right: auto;
    875     width: calc(100vw - 30px);
    876     max-width: 100%;
    877 }
    878 @media only screen and (min-width: 482px) {
    879 
    880     .alignfull [class*=inner-container] > .alignwide {
    881         width: calc(100vw - 100px);
    882     }
    883 }
    884 @media only screen and (min-width: 822px) {
    885 
    886     .alignfull [class*=inner-container] > .alignwide {
    887         width: min(calc(100vw - 200px), 1240px);
    888     }
    889 }
    890 
     804}
     805
     806.entry-header .post-thumbnail,
     807.singular .post-thumbnail,
     808.alignfull [class*=inner-container] > .alignwide,
    891809.alignwide [class*=inner-container] > .alignwide {
    892810    margin-left: auto;
    893811    margin-right: auto;
    894     width: calc(100vw - 30px);
    895     max-width: 100%;
    896 }
     812    width: var(--responsive--alignwide-width);
     813    max-width: var(--responsive--alignfull-width);
     814}
     815
    897816@media only screen and (min-width: 482px) {
    898817
    899     .alignwide [class*=inner-container] > .alignwide {
    900         width: calc(100vw - 100px);
    901     }
    902 }
    903 @media only screen and (min-width: 822px) {
    904 
    905     .alignwide [class*=inner-container] > .alignwide {
    906         width: min(calc(100vw - 200px), 1240px);
    907     }
    908 }
    909 
     818    .entry-content > .alignleft {
     819
     820        /*rtl:ignore*/
     821        margin-left: var(--responsive--alignleft-margin);
     822
     823        /*rtl:ignore*/
     824        margin-right: var(--global--spacing-horizontal);
     825    }
     826}
    910827@media only screen and (min-width: 482px) {
    911828
    912     .entry-content > .alignleft {
     829    .entry-content > .alignright {
    913830
    914831        /*rtl:ignore*/
    915         margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
     832        margin-left: var(--global--spacing-horizontal);
    916833
    917834        /*rtl:ignore*/
    918         margin-right: 25px;
    919     }
    920     @media only screen and (min-width: 482px) {
    921 
    922         .entry-content > .alignleft {
    923             margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    924         }
    925     }
    926     @media only screen and (min-width: 482px) {
    927 
    928         .entry-content > .alignleft {
    929             margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    930         }
    931     }
    932     @media only screen and (min-width: 822px) {
    933 
    934         .entry-content > .alignleft {
    935             margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    936         }
    937     }
    938 }
    939 @media only screen and (min-width: 482px) {
    940 
    941     .entry-content > .alignright {
    942 
    943         /*rtl:ignore*/
    944         margin-left: 25px;
    945 
    946         /*rtl:ignore*/
    947         margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    948     }
    949     @media only screen and (min-width: 482px) {
    950 
    951         .entry-content > .alignright {
    952             margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    953         }
    954     }
    955     @media only screen and (min-width: 482px) {
    956 
    957         .entry-content > .alignright {
    958             margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    959         }
    960     }
    961     @media only screen and (min-width: 822px) {
    962 
    963         .entry-content > .alignright {
    964             margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
    965         }
     835        margin-right: var(--responsive--alignright-margin);
    966836    }
    967837}
    … …  
    980850 * - Set vertical padding and horizontal margins
    981851 */
    982 .site-header {
    983     padding-top: 30px;
    984     padding-bottom: 30px;
     852.site-header,
     853.site-main,
     854.widget-area,
     855.site-footer {
     856    padding-top: var(--global--spacing-vertical);
     857    padding-bottom: var(--global--spacing-vertical);
    985858    margin-left: auto;
    986859    margin-right: auto;
    987860}
    988861
    989 .site-main {
    990     padding-top: 30px;
    991     padding-bottom: 30px;
    992     margin-left: auto;
    993     margin-right: auto;
    994 }
    995 
    996 .widget-area {
    997     padding-top: 30px;
    998     padding-bottom: 30px;
    999     margin-left: auto;
    1000     margin-right: auto;
    1001 }
    1002 
    1003 .site-footer {
    1004     padding-top: 30px;
    1005     padding-bottom: 30px;
    1006     margin-left: auto;
    1007     margin-right: auto;
    1008 }
    1009 
    1010862.site-header {
    1011     padding-top: 23px;
    1012     padding-bottom: 60px;
     863    padding-top: calc(0.75 * var(--global--spacing-vertical));
     864    padding-bottom: calc(2 * var(--global--spacing-vertical));
    1013865}
    1014866@media only screen and (min-width: 482px) {
    1015867
    1016868    .site-header {
    1017         padding-bottom: 90px;
     869        padding-bottom: calc(3 * var(--global--spacing-vertical));
    1018870    }
    1019871}
    … …  
    1024876 */
    1025877.site-main > * {
    1026     margin-top: 90px;
    1027     margin-bottom: 90px;
     878    margin-top: calc(3 * var(--global--spacing-vertical));
     879    margin-bottom: calc(3 * var(--global--spacing-vertical));
    1028880}
    1029881
    … …  
    1052904 * - Set margins
    1053905 */
    1054 .entry-header {
    1055     margin-top: 30px;
     906.entry-header,
     907.post-thumbnail,
     908.entry-content,
     909.entry-footer,
     910.author-bio {
     911    margin-top: var(--global--spacing-vertical);
    1056912    margin-right: auto;
    1057     margin-bottom: 30px;
    1058     margin-left: auto;
    1059 }
    1060 
    1061 .post-thumbnail {
    1062     margin-top: 30px;
    1063     margin-right: auto;
    1064     margin-bottom: 30px;
    1065     margin-left: auto;
    1066 }
    1067 
    1068 .entry-content {
    1069     margin-top: 30px;
    1070     margin-right: auto;
    1071     margin-bottom: 30px;
    1072     margin-left: auto;
    1073 }
    1074 
    1075 .entry-footer {
    1076     margin-top: 30px;
    1077     margin-right: auto;
    1078     margin-bottom: 30px;
    1079     margin-left: auto;
    1080 }
    1081 
    1082 .author-bio {
    1083     margin-top: 30px;
    1084     margin-right: auto;
    1085     margin-bottom: 30px;
     913    margin-bottom: var(--global--spacing-vertical);
    1086914    margin-left: auto;
    1087915}
    … …  
    1091919 * - Sets spacing-vertical margin logic
    1092920 */
    1093 .site-main > article > * {
    1094     margin-top: 20px;
    1095     margin-bottom: 20px;
    1096 }
    1097 
    1098 .site-main > .not-found > * {
    1099     margin-top: 20px;
    1100     margin-bottom: 20px;
    1101 }
    1102 
    1103 .entry-content > * {
    1104     margin-top: 20px;
    1105     margin-bottom: 20px;
    1106 }
    1107 
    1108 [class*=inner-container] > * {
    1109     margin-top: 20px;
    1110     margin-bottom: 20px;
    1111 }
    1112 
     921.site-main > article > *,
     922.site-main > .not-found > *,
     923.entry-content > *,
     924[class*=inner-container] > *,
    1113925.wp-block-template-part > * {
    1114     margin-top: 20px;
    1115     margin-bottom: 20px;
     926    margin-top: calc(0.666 * var(--global--spacing-vertical));
     927    margin-bottom: calc(0.666 * var(--global--spacing-vertical));
    1116928}
    1117929@media only screen and (min-width: 482px) {
    1118930
    1119     .site-main > article > * {
    1120         margin-top: 30px;
    1121         margin-bottom: 30px;
    1122     }
    1123 
    1124     .site-main > .not-found > * {
    1125         margin-top: 30px;
    1126         margin-bottom: 30px;
    1127     }
    1128 
    1129     .entry-content > * {
    1130         margin-top: 30px;
    1131         margin-bottom: 30px;
    1132     }
    1133 
    1134     [class*=inner-container] > * {
    1135         margin-top: 30px;
    1136         margin-bottom: 30px;
    1137     }
    1138 
     931    .site-main > article > *,
     932    .site-main > .not-found > *,
     933    .entry-content > *,
     934    [class*=inner-container] > *,
    1139935    .wp-block-template-part > * {
    1140         margin-top: 30px;
    1141         margin-bottom: 30px;
     936        margin-top: var(--global--spacing-vertical);
     937        margin-bottom: var(--global--spacing-vertical);
    1142938    }
    1143939}
    … …  
    1159955}
    1160956
    1161 .site-footer > * {
    1162     margin-top: 20px;
    1163     margin-bottom: 20px;
    1164 }
    1165 
     957.site-footer > *,
    1166958.widget-area > * {
    1167     margin-top: 20px;
    1168     margin-bottom: 20px;
     959    margin-top: calc(0.666 * var(--global--spacing-vertical));
     960    margin-bottom: calc(0.666 * var(--global--spacing-vertical));
    1169961}
    1170962@media only screen and (min-width: 482px) {
    1171963
    1172     .site-footer > * {
    1173         margin-top: 30px;
    1174         margin-bottom: 30px;
    1175     }
    1176 
     964    .site-footer > *,
    1177965    .widget-area > * {
    1178         margin-top: 30px;
    1179         margin-bottom: 30px;
     966        margin-top: var(--global--spacing-vertical);
     967        margin-bottom: var(--global--spacing-vertical);
    1180968    }
    1181969}
    … …  
    1185973 * - Sets spacing-unit margins
    1186974 */
    1187 .entry-header > * {
    1188     margin-top: 20px;
    1189     margin-bottom: 20px;
    1190 }
    1191 
    1192 .post-thumbnail > * {
    1193     margin-top: 20px;
    1194     margin-bottom: 20px;
    1195 }
    1196 
    1197 .page-content > * {
    1198     margin-top: 20px;
    1199     margin-bottom: 20px;
    1200 }
    1201 
    1202 .comment-content > * {
    1203     margin-top: 20px;
    1204     margin-bottom: 20px;
    1205 }
    1206 
     975.entry-header > *,
     976.post-thumbnail > *,
     977.page-content > *,
     978.comment-content > *,
    1207979.widget > * {
    1208     margin-top: 20px;
    1209     margin-bottom: 20px;
     980    margin-top: var(--global--spacing-unit);
     981    margin-bottom: var(--global--spacing-unit);
    1210982}
    1211983
    … …  
    12481020}
    12491021
    1250 .entry-content > *.alignfull + .alignleft {
    1251     margin-top: 30px;
    1252 }
    1253 
     1022.entry-content > *.alignfull + .alignleft,
    12541023.entry-content > *.alignfull + .alignright {
    1255     margin-top: 30px;
     1024    margin-top: var(--global--spacing-vertical);
    12561025}
    12571026
    … …  
    12981067    /* Apply border-box across the entire page. */
    12991068    box-sizing: border-box;
    1300     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1301     line-height: 1.7;
     1069    font-family: var(--global--font-secondary);
     1070    line-height: var(--global--line-height-body);
    13021071}
    13031072
    … …  
    13121081
    13131082body {
    1314     font-size: 1.25rem;
     1083    font-size: var(--global--font-size-base);
    13151084    font-weight: normal;
    1316     color: #28303d;
     1085    color: var(--global--color-primary);
    13171086    text-align: left;
    1318     background-color: #d1e4dd;
     1087    background-color: var(--global--color-background);
    13191088}
    13201089
    … …  
    13531122    padding: 0;
    13541123    position: relative;
    1355     margin: 30px 0 30px 25px;
     1124    margin: var(--global--spacing-vertical) 0 var(--global--spacing-vertical) var(--global--spacing-horizontal);
    13561125}
    13571126
    13581127blockquote > * {
    1359     margin-top: 20px;
    1360     margin-bottom: 20px;
     1128    margin-top: var(--global--spacing-unit);
     1129    margin-bottom: var(--global--spacing-unit);
    13611130}
    13621131
    … …  
    13701139
    13711140blockquote p {
    1372     letter-spacing: normal;
    1373     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    1374     font-size: 1.25rem;
    1375     font-style: normal;
    1376     font-weight: 700;
    1377     line-height: 1.7;
    1378 }
    1379 
    1380 blockquote cite {
    1381     font-weight: normal;
    1382     color: #28303d;
    1383     font-size: 1rem;
    1384     letter-spacing: normal;
    1385 }
    1386 
     1141    letter-spacing: var(--heading--letter-spacing-h4);
     1142    font-family: var(--quote--font-family);
     1143    font-size: var(--quote--font-size);
     1144    font-style: var(--quote--font-style);
     1145    font-weight: var(--quote--font-weight);
     1146    line-height: var(--quote--line-height);
     1147}
     1148
     1149blockquote cite,
    13871150blockquote footer {
    13881151    font-weight: normal;
    1389     color: #28303d;
    1390     font-size: 1rem;
    1391     letter-spacing: normal;
     1152    color: var(--global--color-primary);
     1153    font-size: var(--global--font-size-xs);
     1154    letter-spacing: var(--global--letter-spacing);
    13921155}
    13931156
    … …  
    13971160}
    13981161
    1399 blockquote.alignleft p {
    1400     font-size: 1.125rem;
     1162blockquote.alignleft p,
     1163blockquote.alignright p {
     1164    font-size: var(--heading--font-size-h5);
    14011165    max-width: inherit;
    14021166    width: inherit;
    14031167}
    14041168
    1405 blockquote.alignright p {
    1406     font-size: 1.125rem;
    1407     max-width: inherit;
    1408     width: inherit;
    1409 }
    1410 
    1411 blockquote.alignleft cite {
    1412     font-size: 1rem;
    1413     letter-spacing: normal;
    1414 }
    1415 
    1416 blockquote.alignleft footer {
    1417     font-size: 1rem;
    1418     letter-spacing: normal;
    1419 }
    1420 
    1421 blockquote.alignright cite {
    1422     font-size: 1rem;
    1423     letter-spacing: normal;
    1424 }
    1425 
     1169blockquote.alignleft cite,
     1170blockquote.alignleft footer,
     1171blockquote.alignright cite,
    14261172blockquote.alignright footer {
    1427     font-size: 1rem;
    1428     letter-spacing: normal;
     1173    font-size: var(--global--font-size-xs);
     1174    letter-spacing: var(--global--letter-spacing);
    14291175}
    14301176
    14311177blockquote strong {
    1432     font-weight: bolder;
     1178    font-weight: var(--quote--font-weight-strong);
    14331179}
    14341180
    14351181blockquote:before {
    14361182    content: "“";
    1437     font-size: 1.25rem;
    1438     line-height: 1.7;
    1439 }
    1440 
    1441 blockquote .wp-block-quote__citation {
    1442     color: #28303d;
    1443     font-size: 1rem;
    1444     font-style: normal;
    1445 }
    1446 
    1447 blockquote cite {
    1448     color: #28303d;
    1449     font-size: 1rem;
    1450     font-style: normal;
    1451 }
    1452 
     1183    font-size: var(--quote--font-size);
     1184    line-height: var(--quote--line-height);
     1185    position: absolute;
     1186    left: calc(-0.5 * var(--global--spacing-horizontal));
     1187}
     1188
     1189blockquote .wp-block-quote__citation,
     1190blockquote cite,
    14531191blockquote footer {
    1454     color: #28303d;
    1455     font-size: 1rem;
    1456     font-style: normal;
     1192    color: var(--global--color-primary);
     1193    font-size: var(--global--font-size-xs);
     1194    font-style: var(--quote--font-style-cite);
    14571195}
    14581196@media only screen and (max-width: 481px) {
    14591197
    14601198    blockquote {
    1461         padding-left: 13px;
     1199        padding-left: calc(0.5 * var(--global--spacing-horizontal));
    14621200    }
    14631201
    … …  
    14671205}
    14681206
    1469 input[type=text] {
    1470     border: 3px solid #39414d;
    1471     border-radius: 0;
    1472     color: #28303d;
    1473     line-height: 1.7;
    1474     padding: 10px;
     1207input[type=text],
     1208input[type=email],
     1209input[type=url],
     1210input[type=password],
     1211input[type=search],
     1212input[type=number],
     1213input[type=tel],
     1214input[type=date],
     1215input[type=month],
     1216input[type=week],
     1217input[type=time],
     1218input[type=datetime],
     1219input[type=datetime-local],
     1220input[type=color],
     1221.site textarea {
     1222    border: var(--form--border-width) solid var(--form--border-color);
     1223    border-radius: var(--form--border-radius);
     1224    color: var(--form--color-text);
     1225    line-height: var(--global--line-height-body);
     1226    padding: var(--form--spacing-unit);
    14751227    margin: 0 2px;
    14761228}
    14771229
    1478 input[type=email] {
    1479     border: 3px solid #39414d;
    1480     border-radius: 0;
    1481     color: #28303d;
    1482     line-height: 1.7;
    1483     padding: 10px;
    1484     margin: 0 2px;
    1485 }
    1486 
    1487 input[type=url] {
    1488     border: 3px solid #39414d;
    1489     border-radius: 0;
    1490     color: #28303d;
    1491     line-height: 1.7;
    1492     padding: 10px;
    1493     margin: 0 2px;
    1494 }
    1495 
    1496 input[type=password] {
    1497     border: 3px solid #39414d;
    1498     border-radius: 0;
    1499     color: #28303d;
    1500     line-height: 1.7;
    1501     padding: 10px;
    1502     margin: 0 2px;
    1503 }
    1504 
    1505 input[type=search] {
    1506     border: 3px solid #39414d;
    1507     border-radius: 0;
    1508     color: #28303d;
    1509     line-height: 1.7;
    1510     padding: 10px;
    1511     margin: 0 2px;
    1512 }
    1513 
    1514 input[type=number] {
    1515     border: 3px solid #39414d;
    1516     border-radius: 0;
    1517     color: #28303d;
    1518     line-height: 1.7;
    1519     padding: 10px;
    1520     margin: 0 2px;
    1521 }
    1522 
    1523 input[type=tel] {
    1524     border: 3px solid #39414d;
    1525     border-radius: 0;
    1526     color: #28303d;
    1527     line-height: 1.7;
    1528     padding: 10px;
    1529     margin: 0 2px;
    1530 }
    1531 
    1532 input[type=date] {
    1533     border: 3px solid #39414d;
    1534     border-radius: 0;
    1535     color: #28303d;
    1536     line-height: 1.7;
    1537     padding: 10px;
    1538     margin: 0 2px;
    1539 }
    1540 
    1541 input[type=month] {
    1542     border: 3px solid #39414d;
    1543     border-radius: 0;
    1544     color: #28303d;
    1545     line-height: 1.7;
    1546     padding: 10px;
    1547     margin: 0 2px;
    1548 }
    1549 
    1550 input[type=week] {
    1551     border: 3px solid #39414d;
    1552     border-radius: 0;
    1553     color: #28303d;
    1554     line-height: 1.7;
    1555     padding: 10px;
    1556     margin: 0 2px;
    1557 }
    1558 
    1559 input[type=time] {
    1560     border: 3px solid #39414d;
    1561     border-radius: 0;
    1562     color: #28303d;
    1563     line-height: 1.7;
    1564     padding: 10px;
    1565     margin: 0 2px;
    1566 }
    1567 
    1568 input[type=datetime] {
    1569     border: 3px solid #39414d;
    1570     border-radius: 0;
    1571     color: #28303d;
    1572     line-height: 1.7;
    1573     padding: 10px;
    1574     margin: 0 2px;
    1575 }
    1576 
    1577 input[type=datetime-local] {
    1578     border: 3px solid #39414d;
    1579     border-radius: 0;
    1580     color: #28303d;
    1581     line-height: 1.7;
    1582     padding: 10px;
    1583     margin: 0 2px;
    1584 }
    1585 
    1586 input[type=color] {
    1587     border: 3px solid #39414d;
    1588     border-radius: 0;
    1589     color: #28303d;
    1590     line-height: 1.7;
    1591     padding: 10px;
    1592     margin: 0 2px;
    1593 }
    1594 
    1595 .site textarea {
    1596     border: 3px solid #39414d;
    1597     border-radius: 0;
    1598     color: #28303d;
    1599     line-height: 1.7;
    1600     padding: 10px;
    1601     margin: 0 2px;
    1602 }
    1603 
    1604 input[type=text]:focus {
    1605     color: #28303d;
     1230input[type=text]:focus,
     1231input[type=email]:focus,
     1232input[type=url]:focus,
     1233input[type=password]:focus,
     1234input[type=search]:focus,
     1235input[type=number]:focus,
     1236input[type=tel]:focus,
     1237input[type=date]:focus,
     1238input[type=month]:focus,
     1239input[type=week]:focus,
     1240input[type=time]:focus,
     1241input[type=datetime]:focus,
     1242input[type=datetime-local]:focus,
     1243input[type=color]:focus,
     1244.site textarea:focus {
     1245    color: var(--form--color-text);
    16061246    outline-offset: 2px;
    1607     outline: 2px dotted #39414d;
    1608 }
    1609 
    1610 input[type=email]:focus {
    1611     color: #28303d;
    1612     outline-offset: 2px;
    1613     outline: 2px dotted #39414d;
    1614 }
    1615 
    1616 input[type=url]:focus {
    1617     color: #28303d;
    1618     outline-offset: 2px;
    1619     outline: 2px dotted #39414d;
    1620 }
    1621 
    1622 input[type=password]:focus {
    1623     color: #28303d;
    1624     outline-offset: 2px;
    1625     outline: 2px dotted #39414d;
    1626 }
    1627 
    1628 input[type=search]:focus {
    1629     color: #28303d;
    1630     outline-offset: 2px;
    1631     outline: 2px dotted #39414d;
    1632 }
    1633 
    1634 input[type=number]:focus {
    1635     color: #28303d;
    1636     outline-offset: 2px;
    1637     outline: 2px dotted #39414d;
    1638 }
    1639 
    1640 input[type=tel]:focus {
    1641     color: #28303d;
    1642     outline-offset: 2px;
    1643     outline: 2px dotted #39414d;
    1644 }
    1645 
    1646 input[type=date]:focus {
    1647     color: #28303d;
    1648     outline-offset: 2px;
    1649     outline: 2px dotted #39414d;
    1650 }
    1651 
    1652 input[type=month]:focus {
    1653     color: #28303d;
    1654     outline-offset: 2px;
    1655     outline: 2px dotted #39414d;
    1656 }
    1657 
    1658 input[type=week]:focus {
    1659     color: #28303d;
    1660     outline-offset: 2px;
    1661     outline: 2px dotted #39414d;
    1662 }
    1663 
    1664 input[type=time]:focus {
    1665     color: #28303d;
    1666     outline-offset: 2px;
    1667     outline: 2px dotted #39414d;
    1668 }
    1669 
    1670 input[type=datetime]:focus {
    1671     color: #28303d;
    1672     outline-offset: 2px;
    1673     outline: 2px dotted #39414d;
    1674 }
    1675 
    1676 input[type=datetime-local]:focus {
    1677     color: #28303d;
    1678     outline-offset: 2px;
    1679     outline: 2px dotted #39414d;
    1680 }
    1681 
    1682 input[type=color]:focus {
    1683     color: #28303d;
    1684     outline-offset: 2px;
    1685     outline: 2px dotted #39414d;
    1686 }
    1687 
    1688 .site textarea:focus {
    1689     color: #28303d;
    1690     outline-offset: 2px;
    1691     outline: 2px dotted #39414d;
     1247    outline: 2px dotted var(--form--border-color);
    16921248}
    16931249
    … …  
    17101266}
    17111267
    1712 .is-dark-theme input[type=text] {
    1713     background: rgba(255, 255, 255, 0.9);
    1714 }
    1715 
    1716 .is-dark-theme input[type=email] {
    1717     background: rgba(255, 255, 255, 0.9);
    1718 }
    1719 
    1720 .is-dark-theme input[type=url] {
    1721     background: rgba(255, 255, 255, 0.9);
    1722 }
    1723 
    1724 .is-dark-theme input[type=password] {
    1725     background: rgba(255, 255, 255, 0.9);
    1726 }
    1727 
    1728 .is-dark-theme input[type=search] {
    1729     background: rgba(255, 255, 255, 0.9);
    1730 }
    1731 
    1732 .is-dark-theme input[type=number] {
    1733     background: rgba(255, 255, 255, 0.9);
    1734 }
    1735 
    1736 .is-dark-theme input[type=tel] {
    1737     background: rgba(255, 255, 255, 0.9);
    1738 }
    1739 
    1740 .is-dark-theme input[type=date] {
    1741     background: rgba(255, 255, 255, 0.9);
    1742 }
    1743 
    1744 .is-dark-theme input[type=month] {
    1745     background: rgba(255, 255, 255, 0.9);
    1746 }
    1747 
    1748 .is-dark-theme input[type=week] {
    1749     background: rgba(255, 255, 255, 0.9);
    1750 }
    1751 
    1752 .is-dark-theme input[type=time] {
    1753     background: rgba(255, 255, 255, 0.9);
    1754 }
    1755 
    1756 .is-dark-theme input[type=datetime] {
    1757     background: rgba(255, 255, 255, 0.9);
    1758 }
    1759 
    1760 .is-dark-theme input[type=datetime-local] {
    1761     background: rgba(255, 255, 255, 0.9);
    1762 }
    1763 
    1764 .is-dark-theme input[type=color] {
    1765     background: rgba(255, 255, 255, 0.9);
    1766 }
    1767 
     1268.is-dark-theme input[type=text],
     1269.is-dark-theme input[type=email],
     1270.is-dark-theme input[type=url],
     1271.is-dark-theme input[type=password],
     1272.is-dark-theme input[type=search],
     1273.is-dark-theme input[type=number],
     1274.is-dark-theme input[type=tel],
     1275.is-dark-theme input[type=date],
     1276.is-dark-theme input[type=month],
     1277.is-dark-theme input[type=week],
     1278.is-dark-theme input[type=time],
     1279.is-dark-theme input[type=datetime],
     1280.is-dark-theme input[type=datetime-local],
     1281.is-dark-theme input[type=color],
    17681282.is-dark-theme .site textarea {
    1769     background: rgba(255, 255, 255, 0.9);
     1283    background: var(--global--color-white-90);
    17701284}
    17711285
    … …  
    17751289
    17761290.is-dark-theme input[type=search]:focus {
    1777     outline-color: #d1e4dd;
     1291    outline-color: var(--global--color-background);
    17781292}
    17791293
    17801294input[type=color] {
    1781     padding: 5px;
    1782     height: 40px;
     1295    padding: calc(var(--form--spacing-unit) / 2);
     1296    height: calc(4 * var(--form--spacing-unit));
    17831297}
    17841298
    … …  
    17911305
    17921306select {
    1793     border: 3px solid #39414d;
    1794     color: #28303d;
     1307    border: var(--form--border-width) solid var(--form--border-color);
     1308    color: var(--form--color-text);
    17951309    -moz-appearance: none;
    17961310    -webkit-appearance: none;
    17971311    appearance: none;
    1798     line-height: 1.7;
    1799     padding: 10px 30px 10px 10px;
    1800     background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
    1801     background-position: right 10px top 60%;
     1312    line-height: var(--global--line-height-body);
     1313    padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit);
     1314    background: var(--global--color-white) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
     1315    background-position: right var(--form--spacing-unit) top 60%;
    18021316}
    18031317
    18041318select:focus {
    18051319    outline-offset: 2px;
    1806     outline: 2px dotted #39414d;
     1320    outline: 2px dotted var(--form--border-color);
    18071321}
    18081322
    18091323.is-dark-theme select {
    1810     background: rgba(255, 255, 255, 0.9) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
    1811     background-position: right 10px top 60%;
     1324    background: var(--global--color-white-90) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
     1325    background-position: right var(--form--spacing-unit) top 60%;
    18121326}
    18131327
    … …  
    18171331
    18181332label {
    1819     font-size: 1.125rem;
    1820     font-weight: 500;
    1821     margin-bottom: 10px;
     1333    font-size: var(--form--font-size);
     1334    font-weight: var(--form--label-weight);
     1335    margin-bottom: calc(var(--global--spacing-vertical) / 3);
    18221336}
    18231337
    … …  
    18291343@supports (-webkit-appearance: none) or (-moz-appearance: none) {
    18301344
    1831     input[type=checkbox] {
    1832         -webkit-appearance: none;
    1833         -moz-appearance: none;
    1834         position: relative;
    1835         width: 25px;
    1836         height: 25px;
    1837         border: 3px solid #39414d;
    1838         background: #fff;
    1839     }
    1840 
     1345    input[type=checkbox],
    18411346    input[type=radio] {
    18421347        -webkit-appearance: none;
    … …  
    18451350        width: 25px;
    18461351        height: 25px;
    1847         border: 3px solid #39414d;
    1848         background: #fff;
     1352        border: var(--form--border-width) solid var(--form--border-color);
     1353        background: var(--global--color-white);
    18491354    }
    18501355
    … …  
    18541359    }
    18551360
    1856     .is-dark-theme input[type=checkbox] {
    1857         background: rgba(255, 255, 255, 0.9);
    1858     }
    1859 
     1361    .is-dark-theme input[type=checkbox],
    18601362    .is-dark-theme input[type=radio] {
    1861         background: rgba(255, 255, 255, 0.9);
     1363        background: var(--global--color-white-90);
    18621364    }
    18631365
    18641366    input[type=checkbox]:focus {
    18651367        outline-offset: 2px;
    1866         outline: 2px dotted #39414d;
     1368        outline: 2px dotted var(--form--border-color);
    18671369    }
    18681370
    … …  
    18761378        width: 7px;
    18771379        height: 13px;
    1878         border: 3px solid #28303d;
     1380        border: 3px solid var(--form--color-text);
    18791381        border-top: 0;
    18801382        border-left: 0;
    … …  
    18831385
    18841386    input[type=checkbox]:checked {
    1885         color: #28303d;
     1387        color: var(--form--color-text);
    18861388    }
    18871389
    … …  
    18961398    input[type=radio]:focus {
    18971399        outline-offset: 2px;
    1898         outline: 2px dotted #39414d;
     1400        outline: 2px dotted var(--form--border-color);
    18991401    }
    19001402
    … …  
    19091411        height: 11px;
    19101412        border-radius: 50%;
    1911         background: #28303d;
     1413        background: var(--form--color-text);
    19121414    }
    19131415
    19141416    input[type=radio]:checked {
    1915         border: 4px solid #39414d;
     1417        border: 4px solid var(--form--border-color);
    19161418    }
    19171419
    … …  
    19221424    input[type=radio]:checked:focus {
    19231425        outline-offset: 4px;
    1924         outline: 2px dotted #39414d;
    1925     }
    1926 }
    1927 
    1928 input[type=checkbox] + label {
    1929     display: inline-block;
    1930     padding-left: 10px;
    1931     font-size: 1rem;
    1932     vertical-align: top;
    1933 }
    1934 
     1426        outline: 2px dotted var(--form--border-color);
     1427    }
     1428}
     1429
     1430input[type=checkbox] + label,
    19351431input[type=radio] + label {
    19361432    display: inline-block;
    19371433    padding-left: 10px;
    1938     font-size: 1rem;
     1434    font-size: var(--global--font-size-xs);
    19391435    vertical-align: top;
    19401436}
    … …  
    19531449        /* Specific width is required for Firefox. */
    19541450        height: 6px;
    1955         background: #39414d;
     1451        background: var(--form--color-ranged);
    19561452        border-radius: 6px;
    19571453        outline-offset: 10px;
    … …  
    19641460    input[type=range]::-webkit-slider-thumb {
    19651461        -webkit-appearance: none;
    1966         border: 3px solid #39414d;
    1967         height: 25px;
    1968         width: 25px;
     1462        border: 3px solid var(--form--color-ranged);
     1463        height: 44px;
     1464        width: 44px;
    19691465        border-radius: 50%;
    1970         background: #d1e4dd;
     1466        background: var(--global--color-background);
    19711467        cursor: pointer;
    19721468    }
    19731469
    19741470    input[type=range]::-moz-range-thumb {
    1975         border: 3px solid #39414d;
    1976         height: 25px;
    1977         width: 25px;
     1471        border: 3px solid var(--form--color-ranged);
     1472        height: 44px;
     1473        width: 44px;
    19781474        border-radius: 50%;
    1979         background: #d1e4dd;
     1475        background: var(--global--color-background);
    19801476        cursor: pointer;
     1477        box-sizing: border-box;
    19811478    }
    19821479}
    … …  
    19871484    border-radius: 6px;
    19881485    border-width: 19px 0;
    1989     border-color: #d1e4dd;
     1486    border-color: var(--global--color-background);
    19901487    background: transparent;
    19911488    color: transparent;
    … …  
    19941491
    19951492input[type=range]::-ms-fill-upper {
    1996     background: #39414d;
     1493    background: var(--form--color-ranged);
    19971494    border-radius: 6px;
    19981495}
    19991496
    20001497input[type=range]::-ms-fill-lower {
    2001     background: #39414d;
     1498    background: var(--form--color-ranged);
    20021499    border-radius: 6px;
    20031500}
    20041501
    20051502input[type=range]::-ms-thumb {
    2006     border: 3px solid #39414d;
    2007     height: 25px;
    2008     width: 25px;
     1503    border: 3px solid var(--form--color-ranged);
     1504    height: 44px;
     1505    width: 44px;
    20091506    border-radius: 50%;
    2010     background: #d1e4dd;
     1507    background: var(--global--color-background);
    20111508    cursor: pointer;
    20121509}
    … …  
    20141511fieldset {
    20151512    display: grid;
    2016     border-color: #39414d;
    2017     padding: 25px;
     1513    border-color: var(--global--color-secondary);
     1514    padding: var(--global--spacing-horizontal);
    20181515}
    20191516
    20201517fieldset legend {
    2021     font-size: 1.5rem;
     1518    font-size: var(--global--font-size-lg);
    20221519}
    20231520
    … …  
    20271524
    20281525fieldset input:not([type=submit]) {
    2029     margin-bottom: 20px;
     1526    margin-bottom: var(--global--spacing-unit);
    20301527}
    20311528
    … …  
    20351532}
    20361533
    2037 fieldset input[type=radio] + label {
    2038     font-size: 1.125rem;
     1534fieldset input[type=radio] + label,
     1535fieldset input[type=checkbox] + label {
     1536    font-size: var(--form--font-size);
    20391537    padding-left: 0;
    2040     margin-bottom: 20px;
    2041 }
    2042 
    2043 fieldset input[type=checkbox] + label {
    2044     font-size: 1.125rem;
    2045     padding-left: 0;
    2046     margin-bottom: 20px;
     1538    margin-bottom: var(--global--spacing-unit);
    20471539}
    20481540
    … …  
    20521544
    20531545.post-password-message {
    2054     font-size: 1.5rem;
     1546    font-size: var(--global--font-size-lg);
    20551547}
    20561548
    … …  
    20671559.post-password-form input[type=password] {
    20681560    flex-grow: 1;
    2069     margin-top: 10px;
    2070     margin-right: 17px;
     1561    margin-top: calc(var(--global--spacing-vertical) / 3);
     1562    margin-right: calc(0.66 * var(--global--spacing-horizontal));
    20711563}
    20721564
    20731565.post-password-form__submit {
    2074     margin-top: 10px;
     1566    margin-top: calc(var(--global--spacing-vertical) / 3);
    20751567}
    20761568@media only screen and (min-width: 592px) {
    20771569
    20781570    .post-password-form__submit {
    2079         margin-left: 10px;
     1571        margin-left: calc(0.4 * var(--global--spacing-horizontal));
    20801572    }
    20811573}
    … …  
    21011593
    21021594/* Media captions */
    2103 figcaption {
     1595figcaption,
     1596.wp-caption,
     1597.wp-caption-text,
     1598.wp-block-embed figcaption {
    21041599    color: currentColor;
    2105     font-size: 1rem;
    2106     line-height: 1.7;
    2107     margin-top: 10px;
    2108     margin-bottom: 20px;
    2109     text-align: center;
    2110 }
    2111 
    2112 .wp-caption {
    2113     color: currentColor;
    2114     font-size: 1rem;
    2115     line-height: 1.7;
    2116     margin-top: 10px;
    2117     margin-bottom: 20px;
    2118     text-align: center;
    2119 }
    2120 
    2121 .wp-caption-text {
    2122     color: currentColor;
    2123     font-size: 1rem;
    2124     line-height: 1.7;
    2125     margin-top: 10px;
    2126     margin-bottom: 20px;
     1600    font-size: var(--global--font-size-xs);
     1601    line-height: var(--global--line-height-body);
     1602    margin-top: calc(0.5 * var(--global--spacing-unit));
     1603    margin-bottom: var(--global--spacing-unit);
    21271604    text-align: center;
    21281605}
    … …  
    21331610.alignright .wp-caption,
    21341611.alignleft .wp-caption-text,
    2135 .alignright .wp-caption-text {
     1612.alignright .wp-caption-text,
     1613.alignleft .wp-block-embed figcaption,
     1614.alignright .wp-block-embed figcaption {
    21361615    margin-bottom: 0;
    21371616}
    … …  
    21721651a {
    21731652    cursor: pointer;
    2174     color: #28303d;
     1653    color: var(--wp--style--color--link, var(--global--color-primary));
    21751654    text-underline-offset: 3px;
    21761655    text-decoration-skip-ink: all;
    … …  
    21821661}
    21831662
    2184 .site a:focus {
     1663.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    21851664
    21861665    /* Only visible in Windows High Contrast mode */
    21871666    outline: 2px solid transparent;
     1667    text-decoration: underline 1px dotted currentColor;
     1668    text-decoration-skip-ink: none;
    21881669    background: rgba(255, 255, 255, 0.9);
    21891670}
    21901671
    2191 .is-dark-theme .site a:focus {
    2192     color: #d1e4dd;
    2193 }
    2194 
    2195 .is-dark-theme .site a:focus .meta-nav {
    2196     color: #d1e4dd;
    2197 }
    2198 
    2199 .has-background-white .site a:focus {
     1672.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     1673.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
     1674    color: var(--wp--style--color--link, var(--global--color-background));
     1675}
     1676
     1677.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    22001678    background: rgba(0, 0, 0, 0.9);
    2201     color: #fff;
    2202 }
    2203 
    2204 .has-background-white .site a:focus .meta-nav {
    2205     color: #fff;
    2206 }
    2207 
    2208 .site a:focus.skip-link {
     1679    color: var(--wp--style--color--link, var(--global--color-white));
     1680}
     1681
     1682.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
     1683    color: var(--wp--style--color--link, var(--global--color-white));
     1684}
     1685
     1686.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
    22091687
    22101688    /* Only visible in Windows High Contrast mode */
    … …  
    22131691}
    22141692
    2215 .site a:focus.skip-link:focus {
     1693.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
    22161694    color: #21759b;
    22171695    background-color: #f1f1f1;
    22181696}
    22191697
    2220 .site a:focus img {
    2221     outline: 2px dotted #28303d;
    2222 }
    2223 
    2224 .has-background:not(.has-background-background-color) .has-link-color a {
    2225     color: #28303d;
    2226 }
    2227 
    2228 .has-background:not(.has-background-background-color).has-link-color a {
    2229     color: #28303d;
     1698.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
     1699    outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
     1700}
     1701
     1702.has-background .has-link-color a,
     1703.has-background.has-link-color a {
     1704    color: var(--wp--style--color--link, var(--global--color-primary));
    22301705}
    22311706
    … …  
    22331708.wp-block-audio audio:focus {
    22341709    outline-offset: 5px;
    2235     outline: 2px solid #28303d;
     1710    outline: 2px solid var(--global--color-primary);
    22361711}
    22371712
    … …  
    22391714 * Button
    22401715 */
    2241 .site .button {
    2242     line-height: 1.5;
    2243     color: #d1e4dd;
     1716.site .button,
     1717input[type=submit],
     1718input[type=reset],
     1719.wp-block-search__button,
     1720.wp-block-button .wp-block-button__link {
     1721    line-height: var(--button--line-height);
     1722    color: var(--button--color-text);
    22441723    cursor: pointer;
    2245     font-weight: 500;
    2246     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2247     font-size: 1.25rem;
    2248     background-color: #39414d;
    2249     border-radius: 0;
    2250     border: 3px solid #39414d;
     1724    font-weight: var(--button--font-weight);
     1725    font-family: var(--button--font-family);
     1726    font-size: var(--button--font-size);
     1727    background-color: var(--button--color-background);
     1728    border-radius: var(--button--border-radius);
     1729    border: var(--button--border-width) solid var(--button--color-background);
    22511730    text-decoration: none;
    2252     padding: 15px 30px;
    2253 }
    2254 
    2255 input[type=submit] {
    2256     line-height: 1.5;
    2257     color: #d1e4dd;
    2258     cursor: pointer;
    2259     font-weight: 500;
    2260     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2261     font-size: 1.25rem;
    2262     background-color: #39414d;
    2263     border-radius: 0;
    2264     border: 3px solid #39414d;
    2265     text-decoration: none;
    2266     padding: 15px 30px;
    2267 }
    2268 
    2269 input[type=reset] {
    2270     line-height: 1.5;
    2271     color: #d1e4dd;
    2272     cursor: pointer;
    2273     font-weight: 500;
    2274     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2275     font-size: 1.25rem;
    2276     background-color: #39414d;
    2277     border-radius: 0;
    2278     border: 3px solid #39414d;
    2279     text-decoration: none;
    2280     padding: 15px 30px;
    2281 }
    2282 
    2283 .wp-block-search__button {
    2284     line-height: 1.5;
    2285     color: #d1e4dd;
    2286     cursor: pointer;
    2287     font-weight: 500;
    2288     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2289     font-size: 1.25rem;
    2290     background-color: #39414d;
    2291     border-radius: 0;
    2292     border: 3px solid #39414d;
    2293     text-decoration: none;
    2294     padding: 15px 30px;
    2295 }
    2296 
    2297 .wp-block-button .wp-block-button__link {
    2298     line-height: 1.5;
    2299     color: #d1e4dd;
    2300     cursor: pointer;
    2301     font-weight: 500;
    2302     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    2303     font-size: 1.25rem;
    2304     background-color: #39414d;
    2305     border-radius: 0;
    2306     border: 3px solid #39414d;
    2307     text-decoration: none;
    2308     padding: 15px 30px;
    2309 }
    2310 
    2311 .site .button:before,
    2312 .site .button:after,
    2313 input[type=submit]:before,
    2314 input[type=submit]:after,
    2315 input[type=reset]:before,
    2316 input[type=reset]:after,
    2317 .wp-block-search__button:before,
    2318 .wp-block-search__button:after,
    2319 .wp-block-button .wp-block-button__link:before,
    2320 .wp-block-button .wp-block-button__link:after {
    2321     content: "";
    2322     display: block;
    2323     height: 0;
    2324     width: 0;
    2325 }
    2326 
    2327 .site .button:before {
    2328     margin-bottom: -calc(1em - 0);
    2329 }
    2330 
    2331 input[type=submit]:before {
    2332     margin-bottom: -calc(1em - 0);
    2333 }
    2334 
    2335 input[type=reset]:before {
    2336     margin-bottom: -calc(1em - 0);
    2337 }
    2338 
    2339 .wp-block-search__button:before {
    2340     margin-bottom: -calc(1em - 0);
    2341 }
    2342 
    2343 .wp-block-button .wp-block-button__link:before {
    2344     margin-bottom: -calc(1em - 0);
    2345 }
    2346 
    2347 .site .button:after {
    2348     margin-top: -calc(1em - 0);
    2349 }
    2350 
    2351 input[type=submit]:after {
    2352     margin-top: -calc(1em - 0);
    2353 }
    2354 
    2355 input[type=reset]:after {
    2356     margin-top: -calc(1em - 0);
    2357 }
    2358 
    2359 .wp-block-search__button:after {
    2360     margin-top: -calc(1em - 0);
    2361 }
    2362 
    2363 .wp-block-button .wp-block-button__link:after {
    2364     margin-top: -calc(1em - 0);
     1731    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    23651732}
    23661733
    … …  
    23751742}
    23761743
    2377 .is-dark-theme .site .button:focus {
    2378     color: #39414d;
    2379 }
    2380 
    2381 .is-dark-theme input[type=submit]:focus {
    2382     color: #39414d;
    2383 }
    2384 
    2385 .is-dark-theme input[type=reset]:focus {
    2386     color: #39414d;
    2387 }
    2388 
    2389 .is-dark-theme .wp-block-search__button:focus {
    2390     color: #39414d;
    2391 }
    2392 
     1744.is-dark-theme .site .button:focus,
     1745.is-dark-theme input[type=submit]:focus,
     1746.is-dark-theme input[type=reset]:focus,
     1747.is-dark-theme .wp-block-search__button:focus,
    23931748.is-dark-theme .wp-block-button .wp-block-button__link:focus {
    2394     color: #39414d;
    2395 }
    2396 
    2397 .site .button:focus:not(.has-background) {
    2398     color: #39414d;
    2399 }
    2400 
    2401 input[type=submit]:focus:not(.has-background) {
    2402     color: #39414d;
    2403 }
    2404 
    2405 input[type=reset]:focus:not(.has-background) {
    2406     color: #39414d;
    2407 }
    2408 
    2409 .wp-block-search__button:focus:not(.has-background) {
    2410     color: #39414d;
    2411 }
    2412 
     1749    color: var(--button--color-background);
     1750}
     1751
     1752.site .button:focus:not(.has-background),
     1753input[type=submit]:focus:not(.has-background),
     1754input[type=reset]:focus:not(.has-background),
     1755.wp-block-search__button:focus:not(.has-background),
    24131756.wp-block-button .wp-block-button__link:focus:not(.has-background) {
    2414     color: #39414d;
    2415 }
    2416 
    2417 .site .button:disabled {
    2418     background-color: rgba(255, 255, 255, 0.5);
    2419     border-color: rgba(255, 255, 255, 0.5);
    2420     color: #39414d;
    2421 }
    2422 
    2423 input[type=submit]:disabled {
    2424     background-color: rgba(255, 255, 255, 0.5);
    2425     border-color: rgba(255, 255, 255, 0.5);
    2426     color: #39414d;
    2427 }
    2428 
    2429 input[type=reset]:disabled {
    2430     background-color: rgba(255, 255, 255, 0.5);
    2431     border-color: rgba(255, 255, 255, 0.5);
    2432     color: #39414d;
    2433 }
    2434 
    2435 .wp-block-search__button:disabled {
    2436     background-color: rgba(255, 255, 255, 0.5);
    2437     border-color: rgba(255, 255, 255, 0.5);
    2438     color: #39414d;
    2439 }
    2440 
     1757    color: var(--button--color-text-hover);
     1758}
     1759
     1760.site .button:disabled,
     1761input[type=submit]:disabled,
     1762input[type=reset]:disabled,
     1763.wp-block-search__button:disabled,
    24411764.wp-block-button .wp-block-button__link:disabled {
    2442     background-color: rgba(255, 255, 255, 0.5);
    2443     border-color: rgba(255, 255, 255, 0.5);
    2444     color: #39414d;
    2445 }
    2446 
    2447 .site .button:active {
    2448     color: #39414d;
    2449     background-color: #d1e4dd;
    2450 }
    2451 
    2452 input[type=submit]:active {
    2453     color: #39414d;
    2454     background-color: #d1e4dd;
    2455 }
    2456 
    2457 input[type=reset]:active {
    2458     color: #39414d;
    2459     background-color: #d1e4dd;
    2460 }
    2461 
    2462 .wp-block-search .wp-block-search__button:active {
    2463     color: #39414d;
    2464     background-color: #d1e4dd;
    2465 }
    2466 
     1765    background-color: var(--global--color-white-50);
     1766    border-color: var(--global--color-white-50);
     1767    color: var(--button--color-text-active);
     1768}
     1769
     1770.site .button:active,
     1771input[type=submit]:active,
     1772input[type=reset]:active,
     1773.wp-block-search .wp-block-search__button:active,
    24671774.wp-block-file .wp-block-file__button:active {
    2468     color: #39414d;
    2469     background-color: #d1e4dd;
    2470 }
    2471 
    2472 .site .button:hover {
    2473     color: #39414d;
     1775    color: var(--button--color-text-active);
     1776    background-color: var(--button--color-background-active);
     1777}
     1778
     1779.site .button:hover,
     1780input[type=submit]:hover,
     1781input[type=reset]:hover,
     1782.wp-block-search .wp-block-search__button:hover,
     1783.wp-block-file .wp-block-file__button:hover {
     1784    color: var(--button--color-text-hover);
    24741785    background: transparent;
    24751786}
    24761787
    2477 input[type=submit]:hover {
    2478     color: #39414d;
    2479     background: transparent;
    2480 }
    2481 
    2482 input[type=reset]:hover {
    2483     color: #39414d;
    2484     background: transparent;
    2485 }
    2486 
    2487 .wp-block-search .wp-block-search__button:hover {
    2488     color: #39414d;
    2489     background: transparent;
    2490 }
    2491 
    2492 .wp-block-file .wp-block-file__button:hover {
    2493     color: #39414d;
    2494     background: transparent;
    2495 }
    2496 
    24971788/**
    24981789 * Block Options
    24991790 */
    25001791.wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
    2501     color: #39414d !important;
     1792    color: var(--button--color-text-active) !important;
    25021793    background: transparent !important;
    2503     border-color: #39414d;
     1794    border-color: var(--button--color-background);
    25041795}
    25051796
    25061797.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
    2507     color: #39414d !important;
     1798    color: var(--button--color-text-hover) !important;
    25081799    background: transparent !important;
    2509     border-color: #39414d;
     1800    border-color: var(--button--color-background);
    25101801}
    25111802
    25121803.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus {
    2513     color: #d1e4dd !important;
    2514     background: #39414d !important;
     1804    color: var(--button--color-text) !important;
     1805    background: var(--button--color-background) !important;
    25151806}
    25161807
    25171808.wp-block-button.is-style-outline .wp-block-button__link {
    2518     padding: 15px 30px;
     1809    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    25191810}
    25201811
    … …  
    25251816.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color) {
    25261817    background: transparent;
    2527     color: #39414d;
    2528     border-color: #39414d;
     1818    color: var(--button--color-background);
     1819    border-color: var(--button--color-background);
    25291820}
    25301821
    … …  
    25331824}
    25341825
    2535 .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-gray-background-color:not(.has-text-color) {
    2536     color: #fff;
    2537 }
    2538 
    2539 .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-dark-gray-background-color:not(.has-text-color) {
    2540     color: #fff;
    2541 }
    2542 
     1826.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-gray-background-color:not(.has-text-color),
     1827.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-dark-gray-background-color:not(.has-text-color),
    25431828.wp-block-button.is-style-outline .wp-block-button__link.has-background.has-black-background-color:not(.has-text-color) {
    2544     color: #fff;
     1829    color: var(--global--color-white);
    25451830}
    25461831
    25471832.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background {
    2548     color: #28303d;
    2549 }
    2550 
    2551 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-gray-background-color {
    2552     color: #fff;
    2553 }
    2554 
    2555 .is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-dark-gray-background-color {
    2556     color: #fff;
    2557 }
    2558 
     1833    color: var(--global--color-dark-gray);
     1834}
     1835
     1836.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-gray-background-color,
     1837.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-dark-gray-background-color,
    25591838.is-dark-theme .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color).has-background.has-black-background-color {
    2560     color: #fff;
     1839    color: var(--global--color-white);
    25611840}
    25621841
    … …  
    25661845}
    25671846
    2568 .wp-block-button.is-style-outline .wp-block-button__link:active {
    2569     color: #d1e4dd !important;
    2570     background: #39414d !important;
    2571     border-color: #39414d;
    2572 }
    2573 
     1847.wp-block-button.is-style-outline .wp-block-button__link:active,
    25741848.wp-block-button.is-style-outline .wp-block-button__link:hover {
    2575     color: #d1e4dd !important;
    2576     background: #39414d !important;
    2577     border-color: #39414d;
    2578 }
    2579 
    2580 .wp-block-button.is-style-outline .wp-block-button__link:active.has-text-color {
    2581     border-color: #39414d;
    2582 }
    2583 
     1849    color: var(--button--color-text) !important;
     1850    background: var(--button--color-background) !important;
     1851    border-color: var(--button--color-background);
     1852}
     1853
     1854.wp-block-button.is-style-outline .wp-block-button__link:active.has-text-color,
    25841855.wp-block-button.is-style-outline .wp-block-button__link:hover.has-text-color {
    2585     border-color: #39414d;
     1856    border-color: var(--button--color-background);
    25861857}
    25871858
    25881859.wp-block-button.is-style-outline .wp-block-button__link:focus {
    2589     color: #39414d !important;
     1860    color: var(--button--color-background) !important;
    25901861    background: transparent !important;
    25911862}
    … …  
    25951866}
    25961867
    2597 .is-style-outline .wp-block-button__link[style*=radius]:focus {
    2598     outline-offset: 2px;
    2599     outline: 2px dotted #39414d;
    2600 }
    2601 
     1868.is-style-outline .wp-block-button__link[style*=radius]:focus,
    26021869.wp-block-button a.wp-block-button__link[style*=radius]:focus {
    26031870    outline-offset: 2px;
    2604     outline: 2px dotted #39414d;
     1871    outline: 2px dotted var(--button--color-background);
    26051872}
    26061873
    26071874.wp-block-code {
    2608     border-color: #28303d;
     1875    border-color: var(--global--color-border);
    26091876    border-radius: 0;
    26101877    border-style: solid;
    26111878    border-width: 0.1rem;
    2612     padding: 20px;
     1879    padding: var(--global--spacing-unit);
    26131880}
    26141881
    26151882.wp-block-code code {
    2616     font-size: 1rem;
     1883    font-size: var(--global--font-size-xs);
    26171884    white-space: pre;
    26181885    overflow-x: auto;
    … …  
    26251892
    26261893.wp-block-columns .wp-block-column > * {
    2627     margin-top: 20px;
    2628     margin-bottom: 20px;
     1894    margin-top: calc(0.66 * var(--global--spacing-vertical));
     1895    margin-bottom: calc(0.66 * var(--global--spacing-vertical));
    26291896}
    26301897@media only screen and (min-width: 482px) {
    26311898
    26321899    .wp-block-columns .wp-block-column > * {
    2633         margin-top: 30px;
    2634         margin-bottom: 30px;
     1900        margin-top: var(--global--spacing-vertical);
     1901        margin-bottom: var(--global--spacing-vertical);
    26351902    }
    26361903}
    … …  
    26491916
    26501917.wp-block-columns .wp-block-column:not(:last-child) {
    2651     margin-bottom: 20px;
     1918    margin-bottom: calc(0.66 * var(--global--spacing-vertical));
    26521919}
    26531920@media only screen and (min-width: 482px) {
    26541921
    26551922    .wp-block-columns .wp-block-column:not(:last-child) {
    2656         margin-bottom: 30px;
     1923        margin-bottom: var(--global--spacing-vertical);
    26571924    }
    26581925}
    … …  
    26701937
    26711938    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) {
    2672         margin-left: -50px;
    2673         margin-top: 63px;
     1939        margin-left: calc(-2 * var(--global--spacing-horizontal));
     1940        margin-top: calc(2.5 * var(--global--spacing-horizontal));
    26741941        z-index: 2;
    26751942    }
    26761943
    2677     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background) {
    2678         background-color: #d1e4dd;
    2679         padding: 20px;
    2680     }
    2681 
    2682     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background) {
    2683         background-color: #d1e4dd;
    2684         padding: 20px;
    2685     }
    2686 
    2687     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background) {
    2688         background-color: #d1e4dd;
    2689         padding: 20px;
    2690     }
    2691 
    2692     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background) {
    2693         background-color: #d1e4dd;
    2694         padding: 20px;
    2695     }
    2696 
    2697     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background) {
    2698         background-color: #d1e4dd;
    2699         padding: 20px;
    2700     }
    2701 
    2702     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background) {
    2703         background-color: #d1e4dd;
    2704         padding: 20px;
    2705     }
    2706 
    2707     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background) {
    2708         background-color: #d1e4dd;
    2709         padding: 20px;
    2710     }
    2711 
    2712     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) {
    2713         background-color: #d1e4dd;
    2714         padding: 20px;
    2715     }
    2716 
     1944    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background),
     1945    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background),
     1946    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background),
     1947    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background),
     1948    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background),
     1949    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background),
     1950    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background),
     1951    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background),
     1952    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background),
     1953    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) {
     1954        background-color: var(--global--color-background);
     1955        padding: var(--global--spacing-unit);
     1956    }
     1957
     1958    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background),
    27171959    .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) {
    2718         background-color: #d1e4dd;
    2719         padding: 20px;
    2720     }
    2721 
    2722     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) {
    2723         background-color: #d1e4dd;
    2724         padding: 20px;
    2725     }
    2726 
    2727     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) {
    2728         padding-left: 50px;
    2729     }
    2730 
    2731     .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) {
    2732         padding-left: 50px;
     1960        padding-left: calc(2 * var(--global--spacing-horizontal));
    27331961    }
    27341962
    … …  
    27381966}
    27391967
    2740 .wp-block-columns.alignfull .wp-block-column p:not(.has-background) {
    2741     padding-left: 20px;
    2742     padding-right: 20px;
    2743 }
    2744 
    2745 .wp-block-columns.alignfull .wp-block-column h1:not(.has-background) {
    2746     padding-left: 20px;
    2747     padding-right: 20px;
    2748 }
    2749 
    2750 .wp-block-columns.alignfull .wp-block-column h2:not(.has-background) {
    2751     padding-left: 20px;
    2752     padding-right: 20px;
    2753 }
    2754 
    2755 .wp-block-columns.alignfull .wp-block-column h3:not(.has-background) {
    2756     padding-left: 20px;
    2757     padding-right: 20px;
    2758 }
    2759 
    2760 .wp-block-columns.alignfull .wp-block-column h4:not(.has-background) {
    2761     padding-left: 20px;
    2762     padding-right: 20px;
    2763 }
    2764 
    2765 .wp-block-columns.alignfull .wp-block-column h5:not(.has-background) {
    2766     padding-left: 20px;
    2767     padding-right: 20px;
    2768 }
    2769 
     1968.wp-block-columns.alignfull .wp-block-column p:not(.has-background),
     1969.wp-block-columns.alignfull .wp-block-column h1:not(.has-background),
     1970.wp-block-columns.alignfull .wp-block-column h2:not(.has-background),
     1971.wp-block-columns.alignfull .wp-block-column h3:not(.has-background),
     1972.wp-block-columns.alignfull .wp-block-column h4:not(.has-background),
     1973.wp-block-columns.alignfull .wp-block-column h5:not(.has-background),
    27701974.wp-block-columns.alignfull .wp-block-column h6:not(.has-background) {
    2771     padding-left: 20px;
    2772     padding-right: 20px;
    2773 }
    2774 
    2775 .wp-block-cover {
    2776     background-color: #000;
    2777     min-height: 450px;
    2778     margin-top: inherit;
    2779     margin-bottom: inherit;
    2780 
    2781     /* default & custom background-color */
    2782 
    2783     /* Treating H2 separately to account for legacy /core styles */
    2784 
    2785     /* Block Styles */
    2786 }
    2787 
     1975    padding-left: var(--global--spacing-unit);
     1976    padding-right: var(--global--spacing-unit);
     1977}
     1978
     1979.wp-block-cover,
    27881980.wp-block-cover-image {
    2789     background-color: #000;
    2790     min-height: 450px;
     1981    background-color: var(--cover--color-background);
     1982    min-height: var(--cover--height);
    27911983    margin-top: inherit;
    27921984    margin-bottom: inherit;
    … …  
    28102002}
    28112003
    2812 .wp-block-cover .wp-block-cover__inner-container {
    2813     color: currentColor;
    2814     margin-top: 30px;
    2815     margin-bottom: 30px;
    2816 }
    2817 
    2818 .wp-block-cover .wp-block-cover-image-text {
    2819     color: currentColor;
    2820     margin-top: 30px;
    2821     margin-bottom: 30px;
    2822 }
    2823 
    2824 .wp-block-cover .wp-block-cover-text {
    2825     color: currentColor;
    2826     margin-top: 30px;
    2827     margin-bottom: 30px;
    2828 }
    2829 
    2830 .wp-block-cover-image .wp-block-cover__inner-container {
    2831     color: currentColor;
    2832     margin-top: 30px;
    2833     margin-bottom: 30px;
    2834 }
    2835 
    2836 .wp-block-cover-image .wp-block-cover-image-text {
    2837     color: currentColor;
    2838     margin-top: 30px;
    2839     margin-bottom: 30px;
    2840 }
    2841 
     2004.wp-block-cover .wp-block-cover__inner-container,
     2005.wp-block-cover .wp-block-cover-image-text,
     2006.wp-block-cover .wp-block-cover-text,
     2007.wp-block-cover-image .wp-block-cover__inner-container,
     2008.wp-block-cover-image .wp-block-cover-image-text,
    28422009.wp-block-cover-image .wp-block-cover-text {
    28432010    color: currentColor;
    2844     margin-top: 30px;
    2845     margin-bottom: 30px;
    2846 }
    2847 
    2848 .wp-block-cover .wp-block-cover__inner-container a,
    2849 .wp-block-cover .wp-block-cover-image-text a,
    2850 .wp-block-cover .wp-block-cover-text a,
    2851 .wp-block-cover-image .wp-block-cover__inner-container a,
    2852 .wp-block-cover-image .wp-block-cover-image-text a,
    2853 .wp-block-cover-image .wp-block-cover-text a {
     2011    margin-top: var(--global--spacing-vertical);
     2012    margin-bottom: var(--global--spacing-vertical);
     2013}
     2014
     2015.wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2016.wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2017.wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2018.wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2019.wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2020.wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) {
    28542021    color: currentColor;
    28552022}
    28562023
    2857 .wp-block-cover .wp-block-cover__inner-container .has-link-color a {
    2858     color: #28303d;
    2859 }
    2860 
    2861 .wp-block-cover .wp-block-cover-image-text .has-link-color a {
    2862     color: #28303d;
    2863 }
    2864 
    2865 .wp-block-cover .wp-block-cover-text .has-link-color a {
    2866     color: #28303d;
    2867 }
    2868 
    2869 .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a {
    2870     color: #28303d;
    2871 }
    2872 
    2873 .wp-block-cover-image .wp-block-cover-image-text .has-link-color a {
    2874     color: #28303d;
    2875 }
    2876 
     2024.wp-block-cover .wp-block-cover__inner-container .has-link-color a,
     2025.wp-block-cover .wp-block-cover-image-text .has-link-color a,
     2026.wp-block-cover .wp-block-cover-text .has-link-color a,
     2027.wp-block-cover-image .wp-block-cover__inner-container .has-link-color a,
     2028.wp-block-cover-image .wp-block-cover-image-text .has-link-color a,
    28772029.wp-block-cover-image .wp-block-cover-text .has-link-color a {
    2878     color: #28303d;
    2879 }
    2880 
    2881 .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container {
    2882     color: #fff;
    2883 }
    2884 
    2885 .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text {
    2886     color: #fff;
    2887 }
    2888 
    2889 .wp-block-cover:not([class*=background-color]) .wp-block-cover-text {
    2890     color: #fff;
    2891 }
    2892 
    2893 .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container {
    2894     color: #fff;
    2895 }
    2896 
    2897 .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text {
    2898     color: #fff;
    2899 }
    2900 
     2030    color: var(--wp--style--color--link, var(--global--color-primary));
     2031}
     2032
     2033.wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container,
     2034.wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text,
     2035.wp-block-cover:not([class*=background-color]) .wp-block-cover-text,
     2036.wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container,
     2037.wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text,
    29012038.wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text {
    2902     color: #fff;
    2903 }
    2904 
    2905 .wp-block-cover h2 {
    2906     font-size: 2.25rem;
    2907     letter-spacing: normal;
    2908     line-height: 1.3;
     2039    color: var(--cover--color-foreground);
     2040}
     2041
     2042.wp-block-cover h2,
     2043.wp-block-cover-image h2 {
     2044    font-size: var(--heading--font-size-h2);
     2045    letter-spacing: var(--heading--letter-spacing-h2);
     2046    line-height: var(--heading--line-height-h2);
    29092047    max-width: inherit;
    29102048    text-align: inherit;
    29112049    padding: 0;
    29122050}
    2913 @media only screen and (min-width: 652px) {
    2914 
    2915     .wp-block-cover h2 {
    2916         font-size: 3rem;
    2917     }
    2918 }
    2919 @media only screen and (min-width: 652px) {
    2920 
    2921     .wp-block-cover h2 {
    2922         font-size: 3rem;
    2923     }
    2924 }
    2925 
    2926 .wp-block-cover-image h2 {
    2927     font-size: 2.25rem;
    2928     letter-spacing: normal;
    2929     line-height: 1.3;
    2930     max-width: inherit;
    2931     text-align: inherit;
    2932     padding: 0;
    2933 }
    2934 @media only screen and (min-width: 652px) {
    2935 
    2936     .wp-block-cover-image h2 {
    2937         font-size: 3rem;
    2938     }
    2939 }
    2940 @media only screen and (min-width: 652px) {
    2941 
    2942     .wp-block-cover-image h2 {
    2943         font-size: 3rem;
    2944     }
    2945 }
    29462051
    29472052.wp-block-cover h2.has-text-align-left,
    … …  
    29602065}
    29612066
    2962 .wp-block-cover .wp-block-cover__inner-container {
    2963     width: calc(100% - 60px);
    2964 }
    2965 
     2067.wp-block-cover .wp-block-cover__inner-container,
    29662068.wp-block-cover-image .wp-block-cover__inner-container {
    2967     width: calc(100% - 60px);
    2968 }
    2969 
    2970 .wp-block-cover .wp-block-cover__inner-container > * {
    2971     margin-top: 20px;
    2972     margin-bottom: 20px;
    2973 }
    2974 
     2069    width: calc(100% - calc(2 * var(--global--spacing-vertical)));
     2070}
     2071
     2072.wp-block-cover .wp-block-cover__inner-container > *,
    29752073.wp-block-cover-image .wp-block-cover__inner-container > * {
    2976     margin-top: 20px;
    2977     margin-bottom: 20px;
     2074    margin-top: calc(0.666 * var(--global--spacing-vertical));
     2075    margin-bottom: calc(0.666 * var(--global--spacing-vertical));
    29782076}
    29792077@media only screen and (min-width: 482px) {
    29802078
    2981     .wp-block-cover .wp-block-cover__inner-container > * {
    2982         margin-top: 30px;
    2983         margin-bottom: 30px;
    2984     }
    2985 
     2079    .wp-block-cover .wp-block-cover__inner-container > *,
    29862080    .wp-block-cover-image .wp-block-cover__inner-container > * {
    2987         margin-top: 30px;
    2988         margin-bottom: 30px;
     2081        margin-top: var(--global--spacing-vertical);
     2082        margin-bottom: var(--global--spacing-vertical);
    29892083    }
    29902084}
    … …  
    30072101}
    30082102
    3009 .wp-block-cover.alignleft > * {
    3010     margin-top: 60px;
    3011     margin-bottom: 60px;
    3012     padding-left: 25px;
    3013     padding-right: 25px;
    3014     width: 100%;
    3015 }
    3016 
    3017 .wp-block-cover.alignright > * {
    3018     margin-top: 60px;
    3019     margin-bottom: 60px;
    3020     padding-left: 25px;
    3021     padding-right: 25px;
    3022     width: 100%;
    3023 }
    3024 
    3025 .wp-block-cover-image.alignleft > * {
    3026     margin-top: 60px;
    3027     margin-bottom: 60px;
    3028     padding-left: 25px;
    3029     padding-right: 25px;
    3030     width: 100%;
    3031 }
    3032 
     2103.wp-block-cover.alignleft > *,
     2104.wp-block-cover.alignright > *,
     2105.wp-block-cover-image.alignleft > *,
    30332106.wp-block-cover-image.alignright > * {
    3034     margin-top: 60px;
    3035     margin-bottom: 60px;
    3036     padding-left: 25px;
    3037     padding-right: 25px;
     2107    margin-top: calc(2 * var(--global--spacing-vertical));
     2108    margin-bottom: calc(2 * var(--global--spacing-vertical));
     2109    padding-left: var(--global--spacing-horizontal);
     2110    padding-right: var(--global--spacing-horizontal);
    30382111    width: 100%;
    30392112}
    … …  
    30462119}
    30472120
    3048 .wp-block-cover.is-style-twentytwentyone-border {
    3049     border: 3px solid #28303d;
    3050 }
    3051 
     2121.wp-block-cover.is-style-twentytwentyone-border,
    30522122.wp-block-cover-image.is-style-twentytwentyone-border {
    3053     border: 3px solid #28303d;
    3054 }
    3055 
    3056 .wp-block-file a.wp-block-file__button:active {
    3057     color: #39414d;
     2123    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
     2124}
     2125
     2126.wp-block-file a.wp-block-file__button:active,
     2127.wp-block-file a.wp-block-file__button:focus,
     2128.wp-block-file a.wp-block-file__button:hover {
     2129    color: var(--button--color-text-hover);
    30582130    opacity: inherit;
    30592131}
    30602132
    3061 .wp-block-file a.wp-block-file__button:focus {
    3062     color: #39414d;
    3063     opacity: inherit;
    3064 }
    3065 
    3066 .wp-block-file a.wp-block-file__button:hover {
    3067     color: #39414d;
    3068     opacity: inherit;
    3069 }
    3070 
    30712133.wp-block-file a.wp-block-file__button:visited {
    3072     color: #d1e4dd;
     2134    color: var(--button--color-text);
    30732135}
    30742136
    30752137.wp-block-file a.wp-block-file__button:visited:hover {
    3076     color: #39414d;
     2138    color: var(--button--color-text-hover);
    30772139}
    30782140
    30792141.wp-block-file .wp-block-file__button {
    3080     line-height: 1.5;
    3081     color: #d1e4dd;
     2142    line-height: var(--button--line-height);
     2143    color: var(--button--color-text);
    30822144    cursor: pointer;
    3083     font-weight: 500;
    3084     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3085     font-size: 1.25rem;
    3086     background-color: #39414d;
    3087     border-radius: 0;
    3088     border: 3px solid #39414d;
     2145    font-weight: var(--button--font-weight);
     2146    font-family: var(--button--font-family);
     2147    font-size: var(--button--font-size);
     2148    background-color: var(--button--color-background);
     2149    border-radius: var(--button--border-radius);
     2150    border: var(--button--border-width) solid var(--button--color-background);
    30892151    text-decoration: none;
    3090     padding: 15px 30px;
     2152    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    30912153    display: inline-block;
    3092 }
    3093 
    3094 .wp-block-file .wp-block-file__button:before,
    3095 .wp-block-file .wp-block-file__button:after {
    3096     content: "";
    3097     display: block;
    3098     height: 0;
    3099     width: 0;
    3100 }
    3101 
    3102 .wp-block-file .wp-block-file__button:before {
    3103     margin-bottom: -calc(1em - 0);
    3104 }
    3105 
    3106 .wp-block-file .wp-block-file__button:after {
    3107     margin-top: -calc(1em - 0);
    31082154}
    31092155
    … …  
    31152161
    31162162.is-dark-theme .wp-block-file .wp-block-file__button:focus {
    3117     color: #39414d;
     2163    color: var(--button--color-background);
    31182164}
    31192165
    31202166.wp-block-file .wp-block-file__button:focus:not(.has-background) {
    3121     color: #39414d;
     2167    color: var(--button--color-text-hover);
    31222168}
    31232169
    31242170.wp-block-file .wp-block-file__button:disabled {
    3125     background-color: rgba(255, 255, 255, 0.5);
    3126     border-color: rgba(255, 255, 255, 0.5);
    3127     color: #39414d;
     2171    background-color: var(--global--color-white-50);
     2172    border-color: var(--global--color-white-50);
     2173    color: var(--button--color-text-active);
    31282174}
    31292175
    … …  
    31322178}
    31332179
    3134 .wp-block-gallery .blocks-gallery-image {
    3135     width: calc(50% - 10px);
    3136 }
    3137 
     2180.wp-block-gallery .blocks-gallery-image,
    31382181.wp-block-gallery .blocks-gallery-item {
    3139     width: calc(50% - 10px);
    3140 }
    3141 
    3142 .wp-block-gallery .blocks-gallery-image figcaption {
    3143     margin: 0;
    3144     color: #fff;
    3145     font-size: 1rem;
    3146 }
    3147 
     2182    width: calc((100% - var(--global--spacing-unit)) / 2);
     2183}
     2184
     2185.wp-block-gallery .blocks-gallery-image figcaption,
    31482186.wp-block-gallery .blocks-gallery-item figcaption {
    31492187    margin: 0;
    3150     color: #fff;
    3151     font-size: 1rem;
    3152 }
    3153 
    3154 .wp-block-gallery .blocks-gallery-image figcaption a {
    3155     color: #fff;
    3156 }
    3157 
     2188    color: var(--global--color-white);
     2189    font-size: var(--global--font-size-xs);
     2190}
     2191
     2192.wp-block-gallery .blocks-gallery-image figcaption a,
    31582193.wp-block-gallery .blocks-gallery-item figcaption a {
    3159     color: #fff;
    3160 }
    3161 
    3162 .wp-block-gallery .blocks-gallery-image figcaption a:focus {
    3163     background-color: transparent;
    3164     outline: 2px solid #28303d;
    3165     text-decoration: none;
    3166 }
    3167 
     2194    color: var(--global--color-white);
     2195}
     2196
     2197.wp-block-gallery .blocks-gallery-image figcaption a:focus,
    31682198.wp-block-gallery .blocks-gallery-item figcaption a:focus {
    31692199    background-color: transparent;
    3170     outline: 2px solid #28303d;
     2200    outline: 2px solid var(--wp--style--color--link, var(--global--color-primary));
    31712201    text-decoration: none;
    31722202}
    … …  
    31962226
    31972227.wp-block-group .wp-block-group__inner-container > * {
    3198     margin-top: 20px;
    3199     margin-bottom: 20px;
     2228    margin-top: calc(0.666 * var(--global--spacing-vertical));
     2229    margin-bottom: calc(0.666 * var(--global--spacing-vertical));
    32002230}
    32012231@media only screen and (min-width: 482px) {
    32022232
    32032233    .wp-block-group .wp-block-group__inner-container > * {
    3204         margin-top: 30px;
    3205         margin-bottom: 30px;
     2234        margin-top: var(--global--spacing-vertical);
     2235        margin-bottom: var(--global--spacing-vertical);
    32062236    }
    32072237}
    … …  
    32162246
    32172247.wp-block-group.has-background {
    3218     padding: 20px;
     2248    padding: calc(0.666 * var(--global--spacing-vertical));
    32192249}
    32202250@media only screen and (min-width: 482px) {
    32212251
    32222252    .wp-block-group.has-background {
    3223         padding: 30px;
     2253        padding: var(--global--spacing-vertical);
    32242254    }
    32252255}
    32262256
    32272257.wp-block-group.is-style-twentytwentyone-border {
    3228     border: 3px solid #28303d;
    3229     padding: 30px;
    3230 }
    3231 
    3232 .wp-block-group.has-background .wp-block-group__inner-container > .alignfull {
    3233     max-width: calc(100% + 60px);
    3234     width: calc(100% + 60px);
    3235     margin-left: -30px;
    3236 }
    3237 
    3238 .wp-block-group.has-background .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull {
    3239     max-width: calc(100% + 60px);
    3240     width: calc(100% + 60px);
    3241     margin-left: -30px;
    3242 }
    3243 
    3244 .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > .alignfull {
    3245     max-width: calc(100% + 60px);
    3246     width: calc(100% + 60px);
    3247     margin-left: -30px;
    3248 }
    3249 
     2258    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
     2259    padding: var(--global--spacing-vertical);
     2260}
     2261
     2262.wp-block-group.has-background .wp-block-group__inner-container > .alignfull,
     2263.wp-block-group.has-background .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull,
     2264.wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > .alignfull,
    32502265.wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull {
    3251     max-width: calc(100% + 60px);
    3252     width: calc(100% + 60px);
    3253     margin-left: -30px;
    3254 }
    3255 
    3256 h1 {
    3257     clear: both;
    3258     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3259     font-weight: normal;
    3260 }
    3261 
    3262 .h1 {
    3263     clear: both;
    3264     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3265     font-weight: normal;
    3266 }
    3267 
    3268 h2 {
    3269     clear: both;
    3270     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3271     font-weight: normal;
    3272 }
    3273 
    3274 .h2 {
    3275     clear: both;
    3276     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3277     font-weight: normal;
    3278 }
    3279 
    3280 h3 {
    3281     clear: both;
    3282     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3283     font-weight: normal;
    3284 }
    3285 
    3286 .h3 {
    3287     clear: both;
    3288     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3289     font-weight: normal;
    3290 }
    3291 
    3292 h4 {
    3293     clear: both;
    3294     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3295     font-weight: normal;
    3296 }
    3297 
    3298 .h4 {
    3299     clear: both;
    3300     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3301     font-weight: normal;
    3302 }
    3303 
    3304 h5 {
    3305     clear: both;
    3306     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3307     font-weight: normal;
    3308 }
    3309 
    3310 .h5 {
    3311     clear: both;
    3312     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3313     font-weight: normal;
    3314 }
    3315 
    3316 h6 {
    3317     clear: both;
    3318     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3319     font-weight: normal;
    3320 }
    3321 
     2266    max-width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical)));
     2267    width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical)));
     2268    margin-left: calc(-1 * var(--global--spacing-vertical));
     2269}
     2270
     2271h1,
     2272.h1,
     2273h2,
     2274.h2,
     2275h3,
     2276.h3,
     2277h4,
     2278.h4,
     2279h5,
     2280.h5,
     2281h6,
    33222282.h6 {
    33232283    clear: both;
    3324     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3325     font-weight: normal;
    3326 }
    3327 
    3328 h1 strong {
    3329     font-weight: 600;
    3330 }
    3331 
    3332 .h1 strong {
    3333     font-weight: 600;
    3334 }
    3335 
    3336 h2 strong {
    3337     font-weight: 600;
    3338 }
    3339 
    3340 .h2 strong {
    3341     font-weight: 600;
    3342 }
    3343 
    3344 h3 strong {
    3345     font-weight: 600;
    3346 }
    3347 
    3348 .h3 strong {
    3349     font-weight: 600;
    3350 }
    3351 
    3352 h4 strong {
    3353     font-weight: 600;
    3354 }
    3355 
    3356 .h4 strong {
    3357     font-weight: 600;
    3358 }
    3359 
    3360 h5 strong {
    3361     font-weight: 600;
    3362 }
    3363 
    3364 .h5 strong {
    3365     font-weight: 600;
    3366 }
    3367 
    3368 h6 strong {
    3369     font-weight: 600;
    3370 }
    3371 
     2284    font-family: var(--heading--font-family);
     2285    font-weight: var(--heading--font-weight);
     2286}
     2287
     2288h1 strong,
     2289.h1 strong,
     2290h2 strong,
     2291.h2 strong,
     2292h3 strong,
     2293.h3 strong,
     2294h4 strong,
     2295.h4 strong,
     2296h5 strong,
     2297.h5 strong,
     2298h6 strong,
    33722299.h6 strong {
    3373     font-weight: 600;
    3374 }
    3375 
    3376 h1 {
    3377     font-size: 4rem;
    3378     letter-spacing: normal;
    3379     line-height: 1.1;
    3380 }
    3381 
    3382 @media only screen and (min-width: 652px) {
    3383 
    3384     h1 {
    3385         font-size: 6rem;
    3386     }
    3387 }
    3388 
     2300    font-weight: var(--heading--font-weight-strong);
     2301}
     2302
     2303h1,
    33892304.h1 {
    3390     font-size: 4rem;
    3391     letter-spacing: normal;
    3392     line-height: 1.1;
    3393 }
    3394 
    3395 @media only screen and (min-width: 652px) {
    3396 
    3397     .h1 {
    3398         font-size: 6rem;
    3399     }
    3400 }
    3401 
    3402 h2 {
    3403     font-size: 2.25rem;
    3404     letter-spacing: normal;
    3405     line-height: 1.3;
    3406 }
    3407 
    3408 @media only screen and (min-width: 652px) {
    3409 
    3410     h2 {
    3411         font-size: 3rem;
    3412     }
    3413 }
    3414 
    3415 @media only screen and (min-width: 652px) {
    3416 
    3417     h2 {
    3418         font-size: 3rem;
    3419     }
    3420 }
    3421 
     2305    font-size: var(--heading--font-size-h1);
     2306    letter-spacing: var(--heading--letter-spacing-h1);
     2307    line-height: var(--heading--line-height-h1);
     2308}
     2309
     2310h2,
    34222311.h2 {
    3423     font-size: 2.25rem;
    3424     letter-spacing: normal;
    3425     line-height: 1.3;
    3426 }
    3427 
    3428 @media only screen and (min-width: 652px) {
    3429 
    3430     .h2 {
    3431         font-size: 3rem;
    3432     }
    3433 }
    3434 
    3435 @media only screen and (min-width: 652px) {
    3436 
    3437     .h2 {
    3438         font-size: 3rem;
    3439     }
    3440 }
    3441 
    3442 h3 {
    3443     font-size: 2rem;
    3444     letter-spacing: normal;
    3445     line-height: 1.3;
    3446 }
    3447 
    3448 @media only screen and (min-width: 652px) {
    3449 
    3450     h3 {
    3451         font-size: 2rem;
    3452     }
    3453 }
    3454 
     2312    font-size: var(--heading--font-size-h2);
     2313    letter-spacing: var(--heading--letter-spacing-h2);
     2314    line-height: var(--heading--line-height-h2);
     2315}
     2316
     2317h3,
    34552318.h3 {
    3456     font-size: 2rem;
    3457     letter-spacing: normal;
    3458     line-height: 1.3;
    3459 }
    3460 
    3461 @media only screen and (min-width: 652px) {
    3462 
    3463     .h3 {
    3464         font-size: 2rem;
    3465     }
    3466 }
    3467 
    3468 h4 {
    3469     font-size: 1.5rem;
    3470     font-weight: 600;
    3471     letter-spacing: normal;
    3472     line-height: 1.3;
    3473 }
    3474 
     2319    font-size: var(--heading--font-size-h3);
     2320    letter-spacing: var(--heading--letter-spacing-h3);
     2321    line-height: var(--heading--line-height-h3);
     2322}
     2323
     2324h4,
    34752325.h4 {
    3476     font-size: 1.5rem;
    3477     font-weight: 600;
    3478     letter-spacing: normal;
    3479     line-height: 1.3;
    3480 }
    3481 
    3482 h5 {
    3483     font-size: 1.125rem;
    3484     font-weight: 600;
    3485     letter-spacing: 0.05em;
    3486     line-height: 1.3;
    3487 }
    3488 
     2326    font-size: var(--heading--font-size-h4);
     2327    font-weight: var(--heading--font-weight-strong);
     2328    letter-spacing: var(--heading--letter-spacing-h4);
     2329    line-height: var(--heading--line-height-h4);
     2330}
     2331
     2332h5,
    34892333.h5 {
    3490     font-size: 1.125rem;
    3491     font-weight: 600;
    3492     letter-spacing: 0.05em;
    3493     line-height: 1.3;
    3494 }
    3495 
    3496 h6 {
    3497     font-size: 1rem;
    3498     font-weight: 600;
    3499     letter-spacing: 0.05em;
    3500     line-height: 1.3;
    3501 }
    3502 
     2334    font-size: var(--heading--font-size-h5);
     2335    font-weight: var(--heading--font-weight-strong);
     2336    letter-spacing: var(--heading--letter-spacing-h5);
     2337    line-height: var(--heading--line-height-h5);
     2338}
     2339
     2340h6,
    35032341.h6 {
    3504     font-size: 1rem;
    3505     font-weight: 600;
    3506     letter-spacing: 0.05em;
    3507     line-height: 1.3;
     2342    font-size: var(--heading--font-size-h6);
     2343    font-weight: var(--heading--font-weight-strong);
     2344    letter-spacing: var(--heading--letter-spacing-h6);
     2345    line-height: var(--heading--line-height-h6);
    35082346}
    35092347
    … …  
    35132351
    35142352.wp-block-image figcaption {
    3515     color: #28303d;
    3516     font-size: 1rem;
    3517     line-height: 1.7;
    3518     margin-top: 10px;
    3519     margin-bottom: 20px;
     2353    color: var(--global--color-primary);
     2354    font-size: var(--global--font-size-xs);
     2355    line-height: var(--global--line-height-body);
     2356    margin-top: calc(0.5 * var(--global--spacing-unit));
     2357    margin-bottom: var(--global--spacing-unit);
    35202358    text-align: center;
    35212359}
    35222360
    35232361.wp-block-image .alignright {
    3524     margin-left: 25px;
     2362    margin-left: var(--global--spacing-horizontal);
    35252363}
    35262364
    35272365.wp-block-image .alignleft {
    3528     margin-right: 25px;
     2366    margin-right: var(--global--spacing-horizontal);
    35292367}
    35302368
    … …  
    35502388}
    35512389
    3552 .wp-block-image.is-style-twentytwentyone-border img {
    3553     border: 3px solid #28303d;
    3554 }
    3555 
     2390.wp-block-image.is-style-twentytwentyone-border img,
    35562391.wp-block-image.is-style-twentytwentyone-image-frame img {
    3557     border: 3px solid #28303d;
     2392    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
    35582393}
    35592394
    35602395.wp-block-image.is-style-twentytwentyone-image-frame img {
    3561     padding: 20px;
     2396    padding: var(--global--spacing-unit);
    35622397}
    35632398
    … …  
    35832418
    35842419.wp-block-latest-comments .wp-block-latest-comments__comment {
    3585     font-size: 1.125rem;
    3586     line-height: 1.7;
     2420    font-size: var(--global--font-size-sm);
     2421    line-height: var(--global--line-height-body);
    35872422
    35882423    /* Vertical margins logic */
    3589     margin-top: 30px;
    3590     margin-bottom: 30px;
     2424    margin-top: var(--global--spacing-vertical);
     2425    margin-bottom: var(--global--spacing-vertical);
    35912426}
    35922427
    … …  
    36002435
    36012436.wp-block-latest-comments .wp-block-latest-comments__comment-meta {
    3602     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     2437    font-family: var(--heading--font-family);
    36032438}
    36042439
    36052440.wp-block-latest-comments .wp-block-latest-comments__comment-date {
    3606     color: #28303d;
    3607     font-size: 1.125rem;
     2441    color: var(--global--color-primary);
     2442    font-size: var(--global--font-size-sm);
    36082443}
    36092444
    36102445.wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p {
    3611     font-size: 1.125rem;
    3612     line-height: 1.7;
     2446    font-size: var(--global--font-size-sm);
     2447    line-height: var(--global--line-height-body);
    36132448    margin: 0;
    36142449}
    … …  
    36192454
    36202455.wp-block-latest-posts:not(.is-grid) > li {
    3621     margin-top: 50px;
    3622     margin-bottom: 50px;
     2456    margin-top: calc(1.666 * var(--global--spacing-vertical));
     2457    margin-bottom: calc(1.666 * var(--global--spacing-vertical));
    36232458}
    36242459
    … …  
    36372472
    36382473.wp-block-latest-posts.is-grid > li {
    3639     margin-bottom: 30px;
     2474    margin-bottom: var(--global--spacing-vertical);
    36402475}
    36412476
    … …  
    36582493
    36592494.wp-block-latest-posts > li > * {
    3660     margin-top: 10px;
    3661     margin-bottom: 10px;
     2495    margin-top: calc(0.333 * var(--global--spacing-vertical));
     2496    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    36622497}
    36632498
    … …  
    36722507.wp-block-latest-posts > li > a {
    36732508    display: inline-block;
    3674     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3675     font-size: 2rem;
    3676     font-weight: normal;
    3677     line-height: 1.3;
    3678     margin-bottom: 10px;
    3679 }
    3680 @media only screen and (min-width: 652px) {
    3681 
    3682     .wp-block-latest-posts > li > a {
    3683         font-size: 2rem;
    3684     }
     2509    font-family: var(--latest-posts--title-font-family);
     2510    font-size: var(--latest-posts--title-font-size);
     2511    font-weight: var(--heading--font-weight);
     2512    line-height: var(--global--line-height-heading);
     2513    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    36852514}
    36862515
    36872516.wp-block-latest-posts .wp-block-latest-posts__post-author {
    3688     color: #28303d;
    3689     font-size: 1.25rem;
    3690     line-height: 1.7;
     2517    color: var(--global--color-primary);
     2518    font-size: var(--global--font-size-md);
     2519    line-height: var(--global--line-height-body);
    36912520}
    36922521
    36932522.wp-block-latest-posts .wp-block-latest-posts__post-date {
    3694     color: #28303d;
    3695     font-size: 1rem;
    3696     line-height: 1.7;
     2523    color: var(--global--color-primary);
     2524    font-size: var(--global--font-size-xs);
     2525    line-height: var(--global--line-height-body);
    36972526}
    36982527
    … …  
    37022531}
    37032532
    3704 .wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
    3705     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3706     font-size: 1.125rem;
    3707     line-height: 1.7;
    3708     margin-top: 20px;
    3709 }
    3710 
     2533.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
    37112534.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
    3712     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3713     font-size: 1.125rem;
    3714     line-height: 1.7;
    3715     margin-top: 20px;
     2535    font-family: var(--latest-posts--description-font-family);
     2536    font-size: var(--latest-posts--description-font-size);
     2537    line-height: var(--global--line-height-body);
     2538    margin-top: calc(0.666 * var(--global--spacing-vertical));
    37162539}
    37172540
    37182541.wp-block-latest-posts.alignfull {
    3719     padding-left: 20px;
    3720     padding-right: 20px;
     2542    padding-left: var(--global--spacing-unit);
     2543    padding-right: var(--global--spacing-unit);
    37212544}
    37222545
    … …  
    37282551
    37292552.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers {
    3730     border-top: 3px solid #28303d;
    3731     border-bottom: 3px solid #28303d;
    3732 }
    3733 
    3734 .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li {
    3735     padding-bottom: 30px;
    3736     border-bottom: 1px solid #28303d;
    3737     margin-top: 30px;
    3738     margin-bottom: 30px;
    3739 }
    3740 
     2553    border-top: calc(3 * var(--separator--height)) solid var(--global--color-border);
     2554    border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border);
     2555}
     2556
     2557.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li,
    37412558.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li {
    3742     padding-bottom: 30px;
    3743     border-bottom: 1px solid #28303d;
    3744     margin-top: 30px;
    3745     margin-bottom: 30px;
     2559    padding-bottom: var(--global--spacing-vertical);
     2560    border-bottom: var(--separator--height) solid var(--global--color-border);
     2561    margin-top: var(--global--spacing-vertical);
     2562    margin-bottom: var(--global--spacing-vertical);
    37462563}
    37472564
    … …  
    37532570
    37542571.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid {
    3755     box-shadow: inset 0 -1px 0 0 #28303d;
    3756     border-bottom: 2px solid #28303d;
     2572    box-shadow: inset 0 -1px 0 0 var(--global--color-border);
     2573    border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border);
    37572574}
    37582575
    37592576.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li {
    37602577    margin: 0;
    3761     padding-top: 30px;
    3762     padding-right: 25px;
     2578    padding-top: var(--global--spacing-vertical);
     2579    padding-right: var(--global--spacing-horizontal);
    37632580}
    37642581
    37652582.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child {
    3766     padding-bottom: 30px;
     2583    padding-bottom: var(--global--spacing-vertical);
    37672584}
    37682585@media screen and (min-width: 600px) {
    37692586
    37702587    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li {
    3771         width: 50%;
     2588        width: calc((100% / 2));
    37722589    }
    37732590
    37742591    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li {
    3775         width: 33%;
     2592        width: calc((100% / 3));
    37762593    }
    37772594
    37782595    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li {
    3779         width: 25%;
     2596        width: calc((100% / 4));
    37802597    }
    37812598
    37822599    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li {
    3783         width: 20%;
     2600        width: calc((100% / 5));
    37842601    }
    37852602
    37862603    .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li {
    3787         width: 17%;
     2604        width: calc((100% / 6));
    37882605    }
    37892606}
    37902607
    37912608.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li {
    3792     border: 3px solid #28303d;
    3793     padding: 30px 25px;
     2609    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
     2610    padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
    37942611}
    37952612
    37962613.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child {
    3797     padding-bottom: 30px;
     2614    padding-bottom: var(--global--spacing-vertical);
    37982615}
    37992616
    38002617.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li {
    3801     margin-top: 25px;
    3802     margin-bottom: 25px;
     2618    margin-top: var(--global--spacing-horizontal);
     2619    margin-bottom: var(--global--spacing-horizontal);
    38032620}
    38042621
    … …  
    38582675}
    38592676
    3860 ul {
    3861     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     2677ul,
     2678ol {
     2679    font-family: var(--list--font-family);
    38622680    margin: 0;
    3863     padding-left: 50px;
    3864 }
    3865 
    3866 ol {
    3867     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3868     margin: 0;
    3869     padding-left: 50px;
     2681    padding-left: calc(2 * var(--global--spacing-horizontal));
    38702682}
    38712683
    … …  
    38922704
    38932705dt {
    3894     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     2706    font-family: var(--definition-term--font-family);
    38952707    font-weight: bold;
    38962708}
    … …  
    38982710dd {
    38992711    margin: 0;
    3900     padding-left: 50px;
     2712    padding-left: calc(2 * var(--global--spacing-horizontal));
    39012713}
    39022714
    … …  
    39182730
    39192731.wp-block-media-text .wp-block-media-text__content {
    3920     padding: 25px;
     2732    padding: var(--global--spacing-horizontal);
    39212733}
    39222734@media only screen and (min-width: 592px) {
    39232735
    39242736    .wp-block-media-text .wp-block-media-text__content {
    3925         padding: 30px;
     2737        padding: var(--global--spacing-vertical);
    39262738    }
    39272739}
    39282740
    39292741.wp-block-media-text .wp-block-media-text__content > * {
    3930     margin-top: 20px;
    3931     margin-bottom: 20px;
     2742    margin-top: calc(0.666 * var(--global--spacing-vertical));
     2743    margin-bottom: calc(0.666 * var(--global--spacing-vertical));
    39322744}
    39332745@media only screen and (min-width: 482px) {
    39342746
    39352747    .wp-block-media-text .wp-block-media-text__content > * {
    3936         margin-top: 30px;
    3937         margin-bottom: 30px;
     2748        margin-top: var(--global--spacing-vertical);
     2749        margin-bottom: var(--global--spacing-vertical);
    39382750    }
    39392751}
    … …  
    39492761
    39502762    .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
    3951         padding-top: 30px;
    3952         padding-bottom: 30px;
     2763        padding-top: var(--global--spacing-vertical);
     2764        padding-bottom: var(--global--spacing-vertical);
    39532765    }
    39542766}
    39552767
    39562768.wp-block-media-text.is-style-twentytwentyone-border {
    3957     border: 3px solid #28303d;
     2769    border: calc(3 * var(--separator--height)) solid var(--global--color-border);
    39582770}
    39592771
    … …  
    39632775
    39642776.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
    3965     padding: 13px;
     2777    padding: var(--primary-nav--padding);
    39662778}
    39672779
    39682780.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
    3969     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    3970     font-size: 1.25rem;
    3971     font-weight: normal;
     2781    font-family: var(--primary-nav--font-family);
     2782    font-size: var(--primary-nav--font-size);
     2783    font-weight: var(--primary-nav--font-weight);
    39722784}
    39732785
    … …  
    39832795    border: none;
    39842796    left: 0;
    3985     margin-left: 13px;
     2797    margin-left: var(--primary-nav--padding);
    39862798    min-width: max-content;
    39872799    opacity: 0;
    … …  
    39932805.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
    39942806    display: inline-block;
    3995     padding: 7px 13px;
     2807    padding: calc(0.5 * var(--primary-nav--padding)) var(--primary-nav--padding);
    39962808}
    39972809
    … …  
    40082820
    40092821.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container {
    4010     background: #d1e4dd;
     2822    background: var(--global--color-background);
    40112823    margin: 0;
    40122824    padding: 0;
    40132825    position: absolute;
    40142826    top: 100%;
    4015     border: 1px solid #28303d;
    4016 }
    4017 
    4018 .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before {
    4019     content: "";
    4020     display: block;
    4021     position: absolute;
    4022     width: 0;
    4023     top: -10px;
    4024     left: 25px;
    4025     border-style: solid;
    4026     border-color: #28303d transparent;
    4027     border-width: 0 7px 10px 7px;
    4028 }
    4029 
     2827    border: 1px solid var(--primary-nav--border-color);
     2828}
     2829
     2830.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before,
    40302831.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
    40312832    content: "";
    … …  
    40342835    width: 0;
    40352836    top: -10px;
    4036     left: 25px;
     2837    left: var(--global--spacing-horizontal);
    40372838    border-style: solid;
    4038     border-color: #28303d transparent;
     2839    border-color: var(--primary-nav--border-color) transparent;
    40392840    border-width: 0 7px 10px 7px;
    40402841}
    … …  
    40422843.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
    40432844    top: -9px;
    4044     border-color: #d1e4dd transparent;
     2845    border-color: var(--global--color-background) transparent;
    40452846}
    40462847
    40472848.wp-block-navigation:not(.has-background) .wp-block-navigation__container {
    4048     background: #d1e4dd;
     2849    background: var(--global--color-background);
    40492850}
    40502851
    40512852.wp-block-navigation:not(.has-background) .wp-block-navigation__container .wp-block-navigation__container {
    4052     background: #d1e4dd;
    4053 }
    4054 
    4055 .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover {
    4056     color: #28303d;
    4057 }
    4058 
     2853    background: var(--global--color-background);
     2854}
     2855
     2856.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover,
    40592857.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus {
    4060     color: #28303d;
     2858    color: var(--primary-nav--color-link-hover);
    40612859}
    40622860
    … …  
    40712869
    40722870p {
    4073     line-height: --global--line-height-body;
     2871    line-height: var(--wp--typography--line-height, --global--line-height-body);
    40742872}
    40752873
    40762874p.has-background {
    4077     padding: 20px;
     2875    padding: var(--global--spacing-unit);
    40782876}
    40792877
    40802878p.has-text-color a {
    4081     color: #28303d;
     2879    color: var(--wp--style--color--link, var(--global--color-primary));
    40822880}
    40832881
    … …  
    40882886
    40892887.wp-block-pullquote {
    4090     padding: 40px 0;
     2888    padding: calc(2 * var(--global--spacing-unit)) 0;
    40912889    text-align: center;
    4092     border-width: 3px;
     2890    border-width: var(--pullquote--border-width);
    40932891    border-bottom-style: solid;
    40942892    border-top-style: solid;
     2893    color: currentColor;
     2894    border-color: currentColor;
    40952895    position: relative;
    40962896
    … …  
    41042904    content: "“";
    41052905    display: block;
     2906    position: relative;
     2907    left: 0;
    41062908    font-size: 3rem;
    41072909    font-weight: 500;
    … …  
    41102912
    41112913.wp-block-pullquote p {
    4112     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4113     font-size: 2rem;
    4114     font-style: normal;
     2914    font-family: var(--pullquote--font-family);
     2915    font-size: var(--pullquote--font-size);
     2916    font-style: var(--pullquote--font-style);
    41152917    font-weight: 700;
    4116     letter-spacing: normal;
    4117     line-height: 1.3;
     2918    letter-spacing: var(--pullquote--letter-spacing);
     2919    line-height: var(--pullquote--line-height);
    41182920    margin: 0;
    4119 }
    4120 @media only screen and (min-width: 652px) {
    4121 
    4122     .wp-block-pullquote p {
    4123         font-size: 2rem;
    4124     }
    41252921}
    41262922
    … …  
    41292925}
    41302926
    4131 .wp-block-pullquote .wp-block-pullquote__citation {
    4132     color: currentColor;
    4133     display: block;
    4134     font-size: 1rem;
    4135     font-style: normal;
    4136     text-transform: none;
    4137 }
    4138 
    4139 .wp-block-pullquote cite {
    4140     color: currentColor;
    4141     display: block;
    4142     font-size: 1rem;
    4143     font-style: normal;
    4144     text-transform: none;
    4145 }
    4146 
     2927.wp-block-pullquote .wp-block-pullquote__citation,
     2928.wp-block-pullquote cite,
    41472929.wp-block-pullquote footer {
    41482930    color: currentColor;
    41492931    display: block;
    4150     font-size: 1rem;
    4151     font-style: normal;
     2932    font-size: var(--global--font-size-xs);
     2933    font-style: var(--pullquote--font-style);
    41522934    text-transform: none;
    41532935}
    … …  
    41572939}
    41582940
    4159 .wp-block-pullquote.alignleft blockquote:before,
    4160 .wp-block-pullquote.alignleft cite {
     2941.wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before,
     2942.wp-block-pullquote.alignleft:not(.is-style-solid-color) cite {
    41612943    text-align: center;
    41622944}
    41632945
    4164 .wp-block-pullquote.alignwide > p {
    4165     max-width: calc(100vw - 30px);
    4166 }
    4167 @media only screen and (min-width: 482px) {
    4168 
    4169     .wp-block-pullquote.alignwide > p {
    4170         max-width: calc(100vw - 100px);
    4171     }
    4172 }
    4173 @media only screen and (min-width: 822px) {
    4174 
    4175     .wp-block-pullquote.alignwide > p {
    4176         max-width: min(calc(100vw - 200px), 1240px);
    4177     }
    4178 }
    4179 
     2946.wp-block-pullquote.alignwide > p,
    41802947.wp-block-pullquote.alignwide blockquote {
    4181     max-width: calc(100vw - 30px);
    4182 }
    4183 @media only screen and (min-width: 482px) {
    4184 
    4185     .wp-block-pullquote.alignwide blockquote {
    4186         max-width: calc(100vw - 100px);
    4187     }
    4188 }
    4189 @media only screen and (min-width: 822px) {
    4190 
    4191     .wp-block-pullquote.alignwide blockquote {
    4192         max-width: min(calc(100vw - 200px), 1240px);
    4193     }
    4194 }
    4195 
    4196 .wp-block-pullquote.alignfull:not(.is-style-solid-color) > p {
    4197     padding: 0 40px;
    4198 }
    4199 
     2948    max-width: var(--responsive--alignwide-width);
     2949}
     2950
     2951.wp-block-pullquote.alignfull:not(.is-style-solid-color) > p,
    42002952.wp-block-pullquote.alignfull:not(.is-style-solid-color) blockquote {
    4201     padding: 0 40px;
     2953    padding: 0 calc(2 * var(--global--spacing-unit));
    42022954}
    42032955
    42042956.wp-block-pullquote.is-style-solid-color {
    4205     color: #28303d;
    4206     padding: 50px;
    4207     border-width: 3px;
     2957    color: var(--pullquote--color-foreground);
     2958    padding: calc(2.5 * var(--global--spacing-unit));
     2959    border-width: var(--pullquote--border-width);
    42082960    border-style: solid;
    4209     border-color: #28303d;
     2961    border-color: var(--pullquote--border-color);
    42102962}
    42112963@media (min-width: 600px) {
    42122964
    42132965    .wp-block-pullquote.is-style-solid-color {
    4214         padding: 100px;
     2966        padding: calc(5 * var(--global--spacing-unit));
    42152967    }
    42162968}
    … …  
    42212973
    42222974.wp-block-pullquote.is-style-solid-color blockquote {
     2975    margin: 0;
    42232976    max-width: inherit;
    42242977}
    42252978
    42262979.wp-block-pullquote.is-style-solid-color blockquote p {
    4227     font-size: 2rem;
    4228 }
    4229 @media only screen and (min-width: 652px) {
    4230 
    4231     .wp-block-pullquote.is-style-solid-color blockquote p {
    4232         font-size: 2rem;
    4233     }
     2980    font-size: var(--pullquote--font-size);
    42342981}
    42352982
    … …  
    42402987}
    42412988
     2989.wp-block-pullquote.is-style-solid-color.alignleft,
     2990.wp-block-pullquote.is-style-solid-color.alignright {
     2991    padding: var(--global--spacing-unit);
     2992}
     2993
     2994.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
     2995.wp-block-pullquote.is-style-solid-color.alignright blockquote {
     2996    max-width: initial;
     2997}
     2998
    42422999.wp-block-quote {
     3000    border-left: none;
    42433001
    42443002    /**
    … …  
    42473005}
    42483006
    4249 .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    4250 [class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
     3007.wp-block-quote:before {
     3008    content: "“";
     3009    font-size: var(--quote--font-size);
     3010    line-height: var(--quote--line-height);
     3011    left: 8px;
     3012}
     3013
     3014.has-background .wp-block-quote .wp-block-quote__citation,
     3015[class*=background-color] .wp-block-quote .wp-block-quote__citation,
    42513016[style*=background-color] .wp-block-quote .wp-block-quote__citation,
    42523017.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation,
    4253 .has-background:not(.has-background-background-color) .wp-block-quote cite,
    4254 [class*=background-color]:not(.has-background-background-color) .wp-block-quote cite,
     3018.has-background .wp-block-quote cite,
     3019[class*=background-color] .wp-block-quote cite,
    42553020[style*=background-color] .wp-block-quote cite,
    42563021.wp-block-cover[style*=background-image] .wp-block-quote cite,
    4257 .has-background:not(.has-background-background-color) .wp-block-quote footer,
    4258 [class*=background-color]:not(.has-background-background-color) .wp-block-quote footer,
     3022.has-background .wp-block-quote footer,
     3023[class*=background-color] .wp-block-quote footer,
    42593024[style*=background-color] .wp-block-quote footer,
    42603025.wp-block-cover[style*=background-image] .wp-block-quote footer {
    … …  
    42633028
    42643029.wp-block-quote.has-text-align-right {
    4265     margin: 30px 25px 30px auto;
     3030    margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto;
    42663031    padding-right: 0;
    42673032    border-right: none;
    … …  
    42693034
    42703035.wp-block-quote.has-text-align-right:before {
     3036    display: none;
     3037}
     3038
     3039.wp-block-quote.has-text-align-right p:before {
    42713040    content: "”";
    4272     left: initial;
    4273     right: -12px;
     3041    font-size: var(--quote--font-size);
     3042    font-weight: normal;
     3043    line-height: var(--quote--line-height);
     3044    margin-right: 5px;
    42743045}
    42753046
    42763047.wp-block-quote.has-text-align-center {
    4277     margin: 30px auto;
     3048    margin: var(--global--spacing-vertical) auto;
    42783049}
    42793050
    … …  
    42823053}
    42833054
    4284 .wp-block-quote.is-large {
    4285     padding-left: 0;
    4286     padding-right: 0;
    4287 
    4288     /* Resetting margins to match _block-container.scss */
    4289     margin-top: 30px;
    4290     margin-bottom: 30px;
    4291 }
    4292 
     3055.wp-block-quote.is-large,
    42933056.wp-block-quote.is-style-large {
    42943057    padding-left: 0;
    … …  
    42963059
    42973060    /* Resetting margins to match _block-container.scss */
    4298     margin-top: 30px;
    4299     margin-bottom: 30px;
    4300 }
    4301 
    4302 .wp-block-quote.is-large p {
    4303     font-size: 2.25rem;
    4304     font-style: normal;
    4305     line-height: 1.35;
    4306 }
    4307 @media only screen and (min-width: 652px) {
    4308 
    4309     .wp-block-quote.is-large p {
    4310         font-size: 2.5rem;
    4311     }
    4312 }
    4313 
     3061    margin-top: var(--global--spacing-vertical);
     3062    margin-bottom: var(--global--spacing-vertical);
     3063}
     3064
     3065.wp-block-quote.is-large p,
    43143066.wp-block-quote.is-style-large p {
    4315     font-size: 2.25rem;
    4316     font-style: normal;
    4317     line-height: 1.35;
    4318 }
    4319 @media only screen and (min-width: 652px) {
    4320 
    4321     .wp-block-quote.is-style-large p {
    4322         font-size: 2.5rem;
    4323     }
    4324 }
    4325 
    4326 .wp-block-quote.is-large:before {
    4327     font-size: 2.25rem;
    4328     line-height: 1.35;
    4329     left: -25px;
    4330 }
    4331 @media only screen and (min-width: 652px) {
    4332 
    4333     .wp-block-quote.is-large:before {
    4334         font-size: 2.5rem;
    4335     }
    4336 }
    4337 
     3067    font-size: var(--quote--font-size-large);
     3068    font-style: var(--quote--font-style-large);
     3069    line-height: var(--quote--line-height-large);
     3070}
     3071
     3072.wp-block-quote.is-large:before,
    43383073.wp-block-quote.is-style-large:before {
    4339     font-size: 2.25rem;
    4340     line-height: 1.35;
    4341     left: -25px;
    4342 }
    4343 @media only screen and (min-width: 652px) {
    4344 
    4345     .wp-block-quote.is-style-large:before {
    4346         font-size: 2.5rem;
    4347     }
    4348 }
    4349 
    4350 .wp-block-quote.is-large.has-text-align-right:before {
    4351     left: initial;
    4352     right: -25px;
    4353 }
    4354 
     3074    font-size: var(--quote--font-size-large);
     3075    line-height: var(--quote--line-height-large);
     3076    left: calc(-1 * var(--global--spacing-horizontal));
     3077}
     3078
     3079.wp-block-quote.is-large.has-text-align-right:before,
    43553080.wp-block-quote.is-style-large.has-text-align-right:before {
    4356     left: initial;
    4357     right: -25px;
    4358 }
    4359 
    4360 .wp-block-quote.is-large .wp-block-quote__citation {
    4361     color: #28303d;
    4362     font-size: 1.125rem;
    4363 }
    4364 
    4365 .wp-block-quote.is-large cite {
    4366     color: #28303d;
    4367     font-size: 1.125rem;
    4368 }
    4369 
    4370 .wp-block-quote.is-large footer {
    4371     color: #28303d;
    4372     font-size: 1.125rem;
    4373 }
    4374 
    4375 .wp-block-quote.is-style-large .wp-block-quote__citation {
    4376     color: #28303d;
    4377     font-size: 1.125rem;
    4378 }
    4379 
    4380 .wp-block-quote.is-style-large cite {
    4381     color: #28303d;
    4382     font-size: 1.125rem;
    4383 }
    4384 
     3081    display: none;
     3082}
     3083
     3084.wp-block-quote.is-large.has-text-align-right p:before,
     3085.wp-block-quote.is-style-large.has-text-align-right p:before {
     3086    content: "”";
     3087    font-size: var(--quote--font-size-large);
     3088    font-weight: normal;
     3089    line-height: var(--quote--line-height-large);
     3090    margin-right: 10px;
     3091}
     3092
     3093.wp-block-quote.is-large .wp-block-quote__citation,
     3094.wp-block-quote.is-large cite,
     3095.wp-block-quote.is-large footer,
     3096.wp-block-quote.is-style-large .wp-block-quote__citation,
     3097.wp-block-quote.is-style-large cite,
    43853098.wp-block-quote.is-style-large footer {
    4386     color: #28303d;
    4387     font-size: 1.125rem;
     3099    color: var(--global--color-primary);
     3100    font-size: var(--global--font-size-sm);
    43883101}
    43893102@media only screen and (max-width: 481px) {
    43903103
    4391     .wp-block-quote.is-large {
    4392         padding-left: 25px;
    4393     }
    4394 
     3104    .wp-block-quote.is-large,
    43953105    .wp-block-quote.is-style-large {
    4396         padding-left: 25px;
     3106        padding-left: var(--global--spacing-horizontal);
    43973107    }
    43983108
    … …  
    44023112    }
    44033113
    4404     .wp-block-quote.is-large.has-text-align-right {
    4405         padding-left: 0;
    4406         padding-right: 25px;
    4407     }
    4408 
     3114    .wp-block-quote.is-large.has-text-align-right,
    44093115    .wp-block-quote.is-style-large.has-text-align-right {
    44103116        padding-left: 0;
    4411         padding-right: 25px;
     3117        padding-right: var(--global--spacing-horizontal);
    44123118    }
    44133119
    … …  
    44273133    .wp-block-quote.has-text-align-right {
    44283134        padding-left: 0;
    4429         padding-right: 13px;
     3135        padding-right: calc(0.5 * var(--global--spacing-horizontal));
    44303136    }
    44313137
    … …  
    44493155
    44503156.wp-block-rss:not(.is-grid) > li {
    4451     margin-top: 50px;
    4452     margin-bottom: 50px;
     3157    margin-top: calc(1.666 * var(--global--spacing-vertical));
     3158    margin-bottom: calc(1.666 * var(--global--spacing-vertical));
    44533159}
    44543160
    … …  
    44623168
    44633169.wp-block-rss.is-grid > li {
    4464     margin-bottom: 30px;
     3170    margin-bottom: var(--global--spacing-vertical);
    44653171}
    44663172
    … …  
    44833189
    44843190.wp-block-rss > li > * {
    4485     margin-top: 10px;
    4486     margin-bottom: 10px;
     3191    margin-top: calc(0.333 * var(--global--spacing-vertical));
     3192    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    44873193}
    44883194
    … …  
    44973203.wp-block-rss .wp-block-rss__item-title > a {
    44983204    display: inline-block;
    4499     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4500     font-size: 2rem;
    4501     font-weight: normal;
    4502     line-height: 1.3;
    4503     margin-bottom: 10px;
    4504 }
    4505 @media only screen and (min-width: 652px) {
    4506 
    4507     .wp-block-rss .wp-block-rss__item-title > a {
    4508         font-size: 2rem;
    4509     }
     3205    font-family: var(--latest-posts--title-font-family);
     3206    font-size: var(--latest-posts--title-font-size);
     3207    font-weight: var(--heading--font-weight);
     3208    line-height: var(--global--line-height-heading);
     3209    margin-bottom: calc(0.333 * var(--global--spacing-vertical));
    45103210}
    45113211
    45123212.wp-block-rss .wp-block-rss__item-author {
    4513     color: #28303d;
    4514     font-size: 1.25rem;
    4515     line-height: 1.7;
     3213    color: var(--global--color-primary);
     3214    font-size: var(--global--font-size-md);
     3215    line-height: var(--global--line-height-body);
    45163216}
    45173217
    45183218.wp-block-rss .wp-block-rss__item-publish-date {
    4519     color: #28303d;
    4520     font-size: 1rem;
    4521     line-height: 1.7;
     3219    color: var(--global--color-primary);
     3220    font-size: var(--global--font-size-xs);
     3221    line-height: var(--global--line-height-body);
    45223222}
    45233223
    … …  
    45273227}
    45283228
    4529 .wp-block-rss .wp-block-rss__item-excerpt {
    4530     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4531     font-size: 1.125rem;
    4532     line-height: 1.7;
    4533     margin-top: 20px;
    4534 }
    4535 
     3229.wp-block-rss .wp-block-rss__item-excerpt,
    45363230.wp-block-rss .wp-block-rss__item-full-content {
    4537     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4538     font-size: 1.125rem;
    4539     line-height: 1.7;
    4540     margin-top: 20px;
     3231    font-family: var(--latest-posts--description-font-family);
     3232    font-size: var(--latest-posts--description-font-size);
     3233    line-height: var(--global--line-height-body);
     3234    margin-top: calc(0.666 * var(--global--spacing-vertical));
    45413235}
    45423236
    45433237.wp-block-rss.alignfull {
    4544     padding-left: 20px;
    4545     padding-right: 20px;
     3238    padding-left: var(--global--spacing-unit);
     3239    padding-right: var(--global--spacing-unit);
    45463240}
    45473241
    … …  
    45533247
    45543248.wp-block-search {
    4555     max-width: calc(100vw - 30px);
    4556 }
    4557 
    4558 @media only screen and (min-width: 482px) {
    4559 
    4560     .wp-block-search {
    4561         max-width: min(calc(100vw - 100px), 610px);
    4562     }
    4563 }
    4564 
    4565 @media only screen and (min-width: 822px) {
    4566 
    4567     .wp-block-search {
    4568         max-width: min(calc(100vw - 200px), 610px);
    4569     }
    4570 }
    4571 
    4572 .wp-block-search__button-inside .wp-block-search__inside-wrapper {
    4573     background-color: #fff;
     3249    max-width: var(--responsive--aligndefault-width);
    45743250}
    45753251
    … …  
    45793255
    45803256.wp-block-search .wp-block-search__label {
    4581     font-size: 1.125rem;
    4582     font-weight: 500;
    4583     margin-bottom: 10px;
     3257    font-size: var(--form--font-size);
     3258    font-weight: var(--form--label-weight);
     3259    margin-bottom: calc(var(--global--spacing-vertical) / 3);
    45843260}
    45853261
    45863262.wp-block-search .wp-block-search__input {
    4587     border: 3px solid #39414d;
    4588     border-radius: 0;
    4589     color: #28303d;
    4590     line-height: 1.7;
     3263    border: var(--form--border-width) solid var(--form--border-color);
     3264    border-radius: var(--form--border-radius);
     3265    color: var(--form--color-text);
     3266    line-height: var(--form--line-height);
    45913267    max-width: inherit;
    4592     margin-right: -3px;
    4593     padding: 10px;
     3268    margin-right: calc(-1 * var(--button--border-width));
     3269    padding: var(--form--spacing-unit);
    45943270}
    45953271
    45963272.wp-block-search .wp-block-search__input:focus {
    4597     color: #28303d;
    4598     border-color: #39414d;
    4599 }
    4600 
    4601 .has-background:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
    4602 [class*=background-color]:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
     3273    color: var(--form--color-text);
     3274    border-color: var(--form--border-color);
     3275}
     3276
     3277.has-background .wp-block-search .wp-block-search__input,
     3278[class*=background-color] .wp-block-search .wp-block-search__input,
    46033279[style*=background-color] .wp-block-search .wp-block-search__input,
    46043280.wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input {
    … …  
    46063282}
    46073283
    4608 .has-background.has-gray-background-color .wp-block-search .wp-block-search__input {
    4609     border-color: #fff;
    4610 }
    4611 
    4612 .has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__input {
    4613     border-color: #fff;
    4614 }
    4615 
     3284.has-background.has-gray-background-color .wp-block-search .wp-block-search__input,
     3285.has-background.has-dark-gray-background-color .wp-block-search .wp-block-search__input,
    46163286.has-background.has-black-background-color .wp-block-search .wp-block-search__input {
    4617     border-color: #fff;
     3287    border-color: var(--global--color-white);
    46183288}
    46193289
    … …  
    46213291    margin-left: 0;
    46223292    background-color: transparent;
    4623     color: #39414d;
     3293    color: var(--button--color-text-hover);
    46243294    line-height: 1;
    46253295}
    46263296
    46273297.wp-block-search button.wp-block-search__button:hover {
    4628     background-color: #39414d;
    4629     color: #d1e4dd;
     3298    background-color: var(--button--color-background);
     3299    color: var(--button--color-text);
    46303300}
    46313301
    46323302.wp-block-search button.wp-block-search__button.has-icon {
    4633     padding: 6px 15px;
     3303    padding: 6px calc(0.5 * var(--button--padding-horizontal));
    46343304}
    46353305
    … …  
    46403310}
    46413311
    4642 .has-background.has-gray-background-color .wp-block-search button.wp-block-search__button {
    4643     color: #fff;
     3312.has-background.has-gray-background-color .wp-block-search button.wp-block-search__button,
     3313.has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button,
     3314.has-background.has-black-background-color .wp-block-search button.wp-block-search__button {
     3315    color: var(--global--color-white);
    46443316    border-color: currentColor;
    46453317}
    46463318
    4647 .has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button {
    4648     color: #fff;
    4649     border-color: currentColor;
    4650 }
    4651 
    4652 .has-background.has-black-background-color .wp-block-search button.wp-block-search__button {
    4653     color: #fff;
    4654     border-color: currentColor;
    4655 }
    4656 
    4657 .has-background.has-gray-background-color .wp-block-search button.wp-block-search__button:hover {
    4658     background-color: #39414d;
    4659     border-color: #fff;
    4660     color: #fff;
    4661 }
    4662 
    4663 .has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button:hover {
    4664     background-color: #39414d;
    4665     border-color: #fff;
    4666     color: #fff;
    4667 }
    4668 
     3319.has-background.has-gray-background-color .wp-block-search button.wp-block-search__button:hover,
     3320.has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button:hover,
    46693321.has-background.has-black-background-color .wp-block-search button.wp-block-search__button:hover {
    4670     background-color: #39414d;
    4671     border-color: #fff;
    4672     color: #fff;
    4673 }
    4674 
    4675 .is-dark-theme .has-background.has-gray-background-color .wp-block-search button.wp-block-search__button:hover {
    4676     color: #d1e4dd;
    4677 }
    4678 
    4679 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button:hover {
    4680     color: #d1e4dd;
    4681 }
    4682 
     3322    background-color: var(--button--color-background);
     3323    border-color: var(--global--color-white);
     3324    color: var(--global--color-white);
     3325}
     3326
     3327.is-dark-theme .has-background.has-gray-background-color .wp-block-search button.wp-block-search__button:hover,
     3328.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search button.wp-block-search__button:hover,
    46833329.is-dark-theme .has-background.has-black-background-color .wp-block-search button.wp-block-search__button:hover {
    4684     color: #d1e4dd;
     3330    color: var(--button--color-text);
    46853331}
    46863332
    … …  
    46963342}
    46973343
    4698 .has-background.has-white-background-color .wp-block-search button.wp-block-search__button:hover {
    4699     background-color: #39414d;
    4700     border-color: #39414d;
    4701     color: #fff;
    4702 }
    4703 
    4704 .has-background.has-green-background-color .wp-block-search button.wp-block-search__button:hover {
    4705     background-color: #39414d;
    4706     border-color: #39414d;
    4707     color: #fff;
    4708 }
    4709 
    4710 .has-background.has-blue-background-color .wp-block-search button.wp-block-search__button:hover {
    4711     background-color: #39414d;
    4712     border-color: #39414d;
    4713     color: #fff;
    4714 }
    4715 
    4716 .has-background.has-purple-background-color .wp-block-search button.wp-block-search__button:hover {
    4717     background-color: #39414d;
    4718     border-color: #39414d;
    4719     color: #fff;
    4720 }
    4721 
    4722 .has-background.has-red-background-color .wp-block-search button.wp-block-search__button:hover {
    4723     background-color: #39414d;
    4724     border-color: #39414d;
    4725     color: #fff;
    4726 }
    4727 
    4728 .has-background.has-orange-background-color .wp-block-search button.wp-block-search__button:hover {
    4729     background-color: #39414d;
    4730     border-color: #39414d;
    4731     color: #fff;
    4732 }
    4733 
     3344.has-background.has-white-background-color .wp-block-search button.wp-block-search__button:hover,
     3345.has-background.has-green-background-color .wp-block-search button.wp-block-search__button:hover,
     3346.has-background.has-blue-background-color .wp-block-search button.wp-block-search__button:hover,
     3347.has-background.has-purple-background-color .wp-block-search button.wp-block-search__button:hover,
     3348.has-background.has-red-background-color .wp-block-search button.wp-block-search__button:hover,
     3349.has-background.has-orange-background-color .wp-block-search button.wp-block-search__button:hover,
    47343350.has-background.has-yellow-background-color .wp-block-search button.wp-block-search__button:hover {
    4735     background-color: #39414d;
    4736     border-color: #39414d;
    4737     color: #fff;
    4738 }
    4739 
    4740 .is-dark-theme .has-background.has-white-background-color .wp-block-search button.wp-block-search__button:hover {
    4741     border-color: #d1e4dd;
    4742     background-color: #d1e4dd;
    4743     color: #39414d;
    4744 }
    4745 
    4746 .is-dark-theme .has-background.has-green-background-color .wp-block-search button.wp-block-search__button:hover {
    4747     border-color: #d1e4dd;
    4748     background-color: #d1e4dd;
    4749     color: #39414d;
    4750 }
    4751 
    4752 .is-dark-theme .has-background.has-blue-background-color .wp-block-search button.wp-block-search__button:hover {
    4753     border-color: #d1e4dd;
    4754     background-color: #d1e4dd;
    4755     color: #39414d;
    4756 }
    4757 
    4758 .is-dark-theme .has-background.has-purple-background-color .wp-block-search button.wp-block-search__button:hover {
    4759     border-color: #d1e4dd;
    4760     background-color: #d1e4dd;
    4761     color: #39414d;
    4762 }
    4763 
    4764 .is-dark-theme .has-background.has-red-background-color .wp-block-search button.wp-block-search__button:hover {
    4765     border-color: #d1e4dd;
    4766     background-color: #d1e4dd;
    4767     color: #39414d;
    4768 }
    4769 
    4770 .is-dark-theme .has-background.has-orange-background-color .wp-block-search button.wp-block-search__button:hover {
    4771     border-color: #d1e4dd;
    4772     background-color: #d1e4dd;
    4773     color: #39414d;
    4774 }
    4775 
     3351    background-color: var(--form--border-color);
     3352    border-color: var(--form--border-color);
     3353    color: var(--global--color-white);
     3354}
     3355
     3356.is-dark-theme .has-background.has-white-background-color .wp-block-search button.wp-block-search__button:hover,
     3357.is-dark-theme .has-background.has-green-background-color .wp-block-search button.wp-block-search__button:hover,
     3358.is-dark-theme .has-background.has-blue-background-color .wp-block-search button.wp-block-search__button:hover,
     3359.is-dark-theme .has-background.has-purple-background-color .wp-block-search button.wp-block-search__button:hover,
     3360.is-dark-theme .has-background.has-red-background-color .wp-block-search button.wp-block-search__button:hover,
     3361.is-dark-theme .has-background.has-orange-background-color .wp-block-search button.wp-block-search__button:hover,
    47763362.is-dark-theme .has-background.has-yellow-background-color .wp-block-search button.wp-block-search__button:hover {
    4777     border-color: #d1e4dd;
    4778     background-color: #d1e4dd;
    4779     color: #39414d;
     3363    border-color: var(--button--color-text);
     3364    background-color: var(--button--color-text);
     3365    color: var(--button--color-background);
     3366}
     3367
     3368.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
     3369    background-color: var(--global--color-white);
     3370    border: var(--form--border-width) solid var(--form--border-color);
     3371    border-radius: var(--form--border-radius);
     3372}
     3373
     3374.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
     3375    margin-right: 0;
     3376}
     3377
     3378.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3379    outline: 2px dotted var(--form--border-color);
     3380    outline-offset: -5px;
     3381}
     3382
     3383.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3384    outline-color: currentColor;
    47803385}
    47813386
    47823387.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button {
    4783     padding: 15px 30px;
    4784 }
    4785 
    4786 .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4787     border-color: #39414d;
    4788     color: #39414d;
    4789 }
    4790 
    4791 .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4792     border-color: #39414d;
    4793     color: #39414d;
    4794 }
    4795 
     3388    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
     3389}
     3390
     3391.has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button,
     3392.has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button,
    47963393.has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4797     border-color: #39414d;
    4798     color: #39414d;
    4799 }
    4800 
    4801 .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4802     color: #fff;
    4803 }
    4804 
    4805 .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4806     color: #fff;
    4807 }
    4808 
     3394    border-color: var(--button--color-background);
     3395    color: var(--button--color-background);
     3396}
     3397
     3398.has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover,
     3399.has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover,
    48093400.has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4810     color: #fff;
    4811 }
    4812 
    4813 .is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4814     border-color: #d1e4dd;
    4815     color: #d1e4dd;
    4816 }
    4817 
    4818 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4819     border-color: #d1e4dd;
    4820     color: #d1e4dd;
    4821 }
    4822 
     3401    color: var(--global--color-white);
     3402}
     3403
     3404.is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button,
     3405.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button,
    48233406.is-dark-theme .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4824     border-color: #d1e4dd;
    4825     color: #d1e4dd;
    4826 }
    4827 
    4828 .is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4829     color: #fff;
    4830 }
    4831 
    4832 .is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4833     color: #fff;
    4834 }
    4835 
     3407    border-color: var(--button--color-text);
     3408    color: var(--button--color-text);
     3409}
     3410
     3411.is-dark-theme .has-background.has-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover,
     3412.is-dark-theme .has-background.has-dark-gray-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover,
    48363413.is-dark-theme .has-background.has-black-background-color .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4837     color: #fff;
     3414    color: var(--global--color-white);
    48383415}
    48393416
    48403417.is-dark-theme .wp-block-search.wp-block-search__button-inside button.wp-block-search__button {
    4841     border-color: #d1e4dd;
    4842     color: #d1e4dd;
     3418    border-color: var(--button--color-text);
     3419    color: var(--button--color-text);
    48433420}
    48443421
    48453422.is-dark-theme .wp-block-search.wp-block-search__button-inside button.wp-block-search__button:hover {
    4846     border-color: #d1e4dd;
    4847     background-color: #d1e4dd;
    4848     color: #39414d;
     3423    border-color: var(--button--color-text);
     3424    background-color: var(--button--color-text);
     3425    color: var(--button--color-background);
    48493426}
    48503427
    … …  
    48553432hr {
    48563433    border-style: none;
    4857     border-bottom: 1px solid #28303d;
     3434    border-bottom: var(--separator--height) solid var(--separator--border-color);
    48583435    clear: both;
    48593436    margin-left: auto;
    … …  
    48623439
    48633440hr.wp-block-separator {
    4864     border-bottom: 1px solid #28303d;
     3441    border-bottom: var(--separator--height) solid var(--separator--border-color);
     3442    opacity: 1;
    48653443
    48663444    /**
    … …  
    48703448
    48713449hr.wp-block-separator:not(.is-style-dots):not(.alignwide) {
    4872     max-width: calc(100vw - 30px);
    4873 }
    4874 @media only screen and (min-width: 482px) {
    4875 
    4876     hr.wp-block-separator:not(.is-style-dots):not(.alignwide) {
    4877         max-width: min(calc(100vw - 100px), 610px);
    4878     }
    4879 }
    4880 @media only screen and (min-width: 822px) {
    4881 
    4882     hr.wp-block-separator:not(.is-style-dots):not(.alignwide) {
    4883         max-width: min(calc(100vw - 200px), 610px);
    4884     }
    4885 }
    4886 
    4887 hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull {
    4888     max-width: 100%;
     3450    max-width: var(--responsive--aligndefault-width);
     3451}
     3452
     3453hr.wp-block-separator:not(.is-style-dots).alignwide {
     3454    max-width: var(--responsive--alignwide-width);
     3455}
     3456
     3457hr.wp-block-separator:not(.is-style-dots).alignfull {
     3458    max-width: var(--responsive--alignfull-width);
    48893459}
    48903460
    48913461hr.wp-block-separator.is-style-twentytwentyone-separator-thick {
    4892     border-bottom-width: 3px;
     3462    border-bottom-width: calc(3 * var(--separator--height));
    48933463}
    48943464
    … …  
    49043474
    49053475hr.wp-block-separator.is-style-dots:before {
    4906     color: #28303d;
    4907     font-size: 2.25rem;
    4908     letter-spacing: 1.125rem;
    4909     padding-left: 1.125rem;
    4910 }
    4911 @media only screen and (min-width: 652px) {
    4912 
    4913     hr.wp-block-separator.is-style-dots:before {
    4914         font-size: 2.5rem;
    4915     }
    4916 }
    4917 
    4918 .has-background:not(.has-background-background-color) hr.wp-block-separator,
    4919 [class*=background-color]:not(.has-background-background-color) hr.wp-block-separator,
     3476    color: var(--separator--border-color);
     3477    font-size: var(--global--font-size-xl);
     3478    letter-spacing: var(--global--font-size-sm);
     3479    padding-left: var(--global--font-size-sm);
     3480}
     3481
     3482.has-background hr.wp-block-separator,
     3483[class*=background-color] hr.wp-block-separator,
    49203484[style*=background-color] hr.wp-block-separator,
    49213485.wp-block-cover[style*=background-image] hr.wp-block-separator {
    … …  
    49233487}
    49243488
     3489.wp-block-social-links a:focus {
     3490    color: var(--global--color-primary);
     3491}
     3492
    49253493.wp-block-social-links.is-style-twentytwentyone-social-icons-color a {
    4926     color: #28303d;
     3494    color: var(--global--color-primary);
    49273495}
    49283496
    … …  
    49393507
    49403508    .wp-block-spacer[style] {
    4941         height: 20px !important;
     3509        height: var(--global--spacing-unit) !important;
    49423510    }
    49433511}
    … …  
    49503518}
    49513519
    4952 table th {
    4953     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4954 }
    4955 
     3520table th,
    49563521.wp-block-table th {
    4957     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    4958 }
    4959 
    4960 table td {
    4961     padding: 10px;
     3522    font-family: var(--heading--font-family);
     3523}
     3524
     3525table td,
     3526table th,
     3527.wp-block-table td,
     3528.wp-block-table th {
     3529    padding: calc(0.5 * var(--global--spacing-unit));
    49623530    border: 1px solid;
    49633531}
    49643532
    4965 table th {
    4966     padding: 10px;
    4967     border: 1px solid;
    4968 }
    4969 
    4970 .wp-block-table td {
    4971     padding: 10px;
    4972     border: 1px solid;
    4973 }
    4974 
    4975 .wp-block-table th {
    4976     padding: 10px;
    4977     border: 1px solid;
    4978 }
    4979 
    4980 table.is-style-regular .has-background {
    4981     color: #28303d;
    4982 }
    4983 
    4984 table.is-style-stripes .has-background thead tr {
    4985     color: #28303d;
    4986 }
    4987 
    4988 table.is-style-stripes .has-background tfoot tr {
    4989     color: #28303d;
    4990 }
    4991 
    4992 table.is-style-stripes .has-background tbody tr:nth-child(even) {
    4993     color: #28303d;
    4994 }
    4995 
    4996 .wp-block-table.is-style-regular .has-background {
    4997     color: #28303d;
    4998 }
    4999 
    5000 .wp-block-table.is-style-stripes .has-background thead tr {
    5001     color: #28303d;
    5002 }
    5003 
    5004 .wp-block-table.is-style-stripes .has-background tfoot tr {
    5005     color: #28303d;
    5006 }
    5007 
     3533table.is-style-regular .has-background,
     3534table.is-style-stripes .has-background thead tr,
     3535table.is-style-stripes .has-background tfoot tr,
     3536table.is-style-stripes .has-background tbody tr:nth-child(even),
     3537.wp-block-table.is-style-regular .has-background,
     3538.wp-block-table.is-style-stripes .has-background thead tr,
     3539.wp-block-table.is-style-stripes .has-background tfoot tr,
    50083540.wp-block-table.is-style-stripes .has-background tbody tr:nth-child(even) {
    5009     color: #28303d;
    5010 }
    5011 
    5012 table.is-style-stripes {
    5013     border-color: #f0f0f0;
    5014 }
    5015 
     3541    color: var(--table--has-background-text-color);
     3542}
     3543
     3544table.is-style-stripes,
    50163545.wp-block-table.is-style-stripes {
    5017     border-color: #f0f0f0;
     3546    border-color: var(--table--stripes-border-color);
    50183547}
    50193548
    … …  
    50253554}
    50263555
    5027 table.is-style-stripes tbody tr:nth-child(odd) {
    5028     background-color: #f0f0f0;
    5029 }
    5030 
     3556table.is-style-stripes tbody tr:nth-child(odd),
    50313557.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    5032     background-color: #f0f0f0;
     3558    background-color: var(--table--stripes-background-color);
    50333559}
    50343560
    … …  
    50563582    font-weight: bold;
    50573583    text-align: left;
    5058     margin-bottom: 20px;
     3584    margin-bottom: var(--global--spacing-unit);
    50593585    color: currentColor;
    50603586}
    … …  
    50623588.wp-calendar-nav {
    50633589    text-align: left;
    5064     margin-top: 10px;
     3590    margin-top: calc(var(--global--spacing-unit) / 2);
    50653591}
    50663592
    … …  
    50793605
    50803606.wp-block-tag-cloud.alignfull {
    5081     padding-left: 20px;
    5082     padding-right: 20px;
     3607    padding-left: var(--global--spacing-unit);
     3608    padding-right: var(--global--spacing-unit);
    50833609}
    50843610
    50853611.wp-block-verse {
    5086     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     3612    font-family: var(--entry-content--font-family);
    50873613}
    50883614
    50893615.wp-block-video figcaption {
    5090     color: #28303d;
    5091     font-size: 1rem;
    5092     margin-top: 10px;
    5093     margin-bottom: 20px;
     3616    color: var(--global--color-primary);
     3617    font-size: var(--global--font-size-xs);
     3618    margin-top: calc(0.5 * var(--global--spacing-unit));
     3619    margin-bottom: var(--global--spacing-unit);
    50943620    text-align: center;
    50953621}
    … …  
    51013627}
    51023628
    5103 :root .is-extra-small-text {
    5104     font-size: 1rem;
    5105 }
    5106 
     3629:root .is-extra-small-text,
    51073630:root .has-extra-small-font-size {
    5108     font-size: 1rem;
    5109 }
    5110 
    5111 :root .is-small-text {
    5112     font-size: 1.125rem;
    5113 }
    5114 
     3631    font-size: var(--global--font-size-xs);
     3632}
     3633
     3634:root .is-small-text,
    51153635:root .has-small-font-size {
    5116     font-size: 1.125rem;
    5117 }
    5118 
    5119 :root .is-regular-text {
    5120     font-size: 1.25rem;
    5121 }
    5122 
    5123 :root .has-regular-font-size {
    5124     font-size: 1.25rem;
    5125 }
    5126 
    5127 :root .is-normal-font-size {
    5128     font-size: 1.25rem;
    5129 }
    5130 
    5131 :root .has-normal-font-size {
    5132     font-size: 1.25rem;
    5133 }
    5134 
     3636    font-size: var(--global--font-size-sm);
     3637}
     3638
     3639:root .is-regular-text,
     3640:root .has-regular-font-size,
     3641:root .is-normal-font-size,
     3642:root .has-normal-font-size,
    51353643:root .has-medium-font-size {
    5136     font-size: 1.25rem;
    5137 }
    5138 
    5139 :root .is-large-text {
    5140     font-size: 1.5rem;
    5141     line-height: 1.3;
    5142 }
    5143 
     3644    font-size: var(--global--font-size-base);
     3645}
     3646
     3647:root .is-large-text,
    51443648:root .has-large-font-size {
    5145     font-size: 1.5rem;
    5146     line-height: 1.3;
    5147 }
    5148 
    5149 :root .is-larger-text {
    5150     font-size: 2.5rem;
    5151     line-height: 1.3;
    5152 }
    5153 @media only screen and (min-width: 652px) {
    5154 
    5155     :root .is-larger-text {
    5156         font-size: 2.5rem;
    5157     }
    5158 }
    5159 
    5160 :root .has-larger-font-size {
    5161     font-size: 2.5rem;
    5162     line-height: 1.3;
    5163 }
    5164 @media only screen and (min-width: 652px) {
    5165 
    5166     :root .has-larger-font-size {
    5167         font-size: 2.5rem;
    5168     }
    5169 }
    5170 
    5171 :root .is-extra-large-text {
    5172     font-size: 2.5rem;
    5173     line-height: 1.3;
    5174 }
    5175 @media only screen and (min-width: 652px) {
    5176 
    5177     :root .is-extra-large-text {
    5178         font-size: 2.5rem;
    5179     }
    5180 }
    5181 
     3649    font-size: var(--global--font-size-lg);
     3650    line-height: var(--global--line-height-heading);
     3651}
     3652
     3653:root .is-larger-text,
     3654:root .has-larger-font-size,
     3655:root .is-extra-large-text,
    51823656:root .has-extra-large-font-size {
    5183     font-size: 2.5rem;
    5184     line-height: 1.3;
    5185 }
    5186 @media only screen and (min-width: 652px) {
    5187 
    5188     :root .has-extra-large-font-size {
    5189         font-size: 2.5rem;
    5190     }
    5191 }
    5192 
    5193 :root .is-huge-text {
    5194     font-size: 6rem;
    5195     line-height: 1.3;
    5196     font-weight: 300;
    5197 }
    5198 @media only screen and (min-width: 652px) {
    5199 
    5200     :root .is-huge-text {
    5201         font-size: 6rem;
    5202     }
    5203 }
    5204 
     3657    font-size: var(--global--font-size-xl);
     3658    line-height: var(--global--line-height-heading);
     3659}
     3660
     3661:root .is-huge-text,
    52053662:root .has-huge-font-size {
    5206     font-size: 6rem;
    5207     line-height: 1.3;
    5208     font-weight: 300;
    5209 }
    5210 @media only screen and (min-width: 652px) {
    5211 
    5212     :root .has-huge-font-size {
    5213         font-size: 6rem;
    5214     }
    5215 }
    5216 
    5217 :root .is-gigantic-text {
    5218     font-size: 9rem;
    5219     line-height: 1.3;
    5220     font-weight: 300;
    5221 }
    5222 @media only screen and (min-width: 652px) {
    5223 
    5224     :root .is-gigantic-text {
    5225         font-size: 9rem;
    5226     }
    5227 }
    5228 
     3663    font-size: var(--global--font-size-xxl);
     3664    line-height: var(--global--line-height-heading);
     3665    font-weight: var(--heading--font-weight-page-title);
     3666}
     3667
     3668:root .is-gigantic-text,
    52293669:root .has-gigantic-font-size {
    5230     font-size: 9rem;
    5231     line-height: 1.3;
    5232     font-weight: 300;
    5233 }
    5234 @media only screen and (min-width: 652px) {
    5235 
    5236     :root .has-gigantic-font-size {
    5237         font-size: 9rem;
    5238     }
     3670    font-size: var(--global--font-size-xxxl);
     3671    line-height: var(--global--line-height-heading);
     3672    font-weight: var(--heading--font-weight-page-title);
    52393673}
    52403674
    … …  
    52563690
    52573691.entry-content > .alignleft {
    5258     max-width: calc(100vw - 30px);
    5259 }
    5260 
    5261 @media only screen and (min-width: 482px) {
    5262 
    5263     .entry-content > .alignleft {
    5264         max-width: min(calc(100vw - 100px), 610px);
    5265     }
    5266 }
    5267 
    5268 @media only screen and (min-width: 822px) {
    5269 
    5270     .entry-content > .alignleft {
    5271         max-width: min(calc(100vw - 200px), 610px);
    5272     }
     3692    max-width: var(--responsive--aligndefault-width);
    52733693}
    52743694
    … …  
    52813701
    52823702        /*rtl:ignore*/
    5283         margin-right: 25px;
    5284         margin-bottom: 30px;
     3703        margin-right: var(--global--spacing-horizontal);
     3704        margin-bottom: var(--global--spacing-vertical);
    52853705    }
    52863706
    52873707    .entry-content > .alignleft {
    5288         max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5289     }
    5290 
    5291     @media only screen and (min-width: 482px) {
    5292 
    5293         .entry-content > .alignleft {
    5294             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5295         }
    5296     }
    5297 
    5298     @media only screen and (min-width: 482px) {
    5299 
    5300         .entry-content > .alignleft {
    5301             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5302         }
    5303     }
    5304 
    5305     @media only screen and (min-width: 822px) {
    5306 
    5307         .entry-content > .alignleft {
    5308             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5309         }
     3708        max-width: calc(50% - var(--responsive--alignleft-margin));
    53103709    }
    53113710}
    … …  
    53283727.alignright {
    53293728    margin-top: 0;
    5330     margin-bottom: 30px;
     3729    margin-bottom: var(--global--spacing-vertical);
    53313730}
    53323731
    53333732.entry-content > .alignright {
    5334     max-width: calc(100vw - 30px);
    5335 }
    5336 
    5337 @media only screen and (min-width: 482px) {
    5338 
    5339     .entry-content > .alignright {
    5340         max-width: min(calc(100vw - 100px), 610px);
    5341     }
    5342 }
    5343 
    5344 @media only screen and (min-width: 822px) {
    5345 
    5346     .entry-content > .alignright {
    5347         max-width: min(calc(100vw - 200px), 610px);
    5348     }
     3733    max-width: var(--responsive--aligndefault-width);
    53493734}
    53503735
    … …  
    53573742
    53583743        /*rtl:ignore*/
    5359         margin-left: 25px;
     3744        margin-left: var(--global--spacing-horizontal);
    53603745    }
    53613746
    53623747    .entry-content > .alignright {
    5363         max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5364     }
    5365 
    5366     @media only screen and (min-width: 482px) {
    5367 
    5368         .entry-content > .alignright {
    5369             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5370         }
    5371     }
    5372 
    5373     @media only screen and (min-width: 482px) {
    5374 
    5375         .entry-content > .alignright {
    5376             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5377         }
    5378     }
    5379 
    5380     @media only screen and (min-width: 822px) {
    5381 
    5382         .entry-content > .alignright {
    5383             max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
    5384         }
     3748        max-width: calc(50% - var(--responsive--alignright-margin));
    53853749    }
    53863750}
    … …  
    54183782
    54193783.has-drop-cap:not(:focus)::first-letter {
    5420     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5421     font-weight: normal;
     3784    font-family: var(--heading--font-family);
     3785    font-weight: var(--heading--font-weight);
    54223786    line-height: 0.66;
    54233787    text-transform: uppercase;
    … …  
    54253789    float: left;
    54263790    margin: 0.1em 0.1em 0 0;
    5427     font-size: 5rem;
    5428 }
    5429 
    5430 @media only screen and (min-width: 652px) {
    5431 
    5432     .has-drop-cap:not(:focus)::first-letter {
    5433         font-size: 7rem;
    5434     }
     3791    font-size: calc(1.2 * var(--heading--font-size-h1));
    54353792}
    54363793
    … …  
    54573814    align-items: flex-start;
    54583815    flex-wrap: wrap;
    5459     row-gap: 30px;
     3816    row-gap: var(--global--spacing-vertical);
    54603817}
    54613818
    … …  
    54663823
    54673824    .site-header {
    5468         padding-top: 40px;
     3825        padding-top: calc(var(--global--spacing-vertical) / 0.75);
    54693826    }
    54703827}
    … …  
    54723829
    54733830    .site-header {
    5474         padding-top: 72px;
     3831        padding-top: calc(2.4 * var(--global--spacing-vertical));
    54753832    }
    54763833}
    54773834
    54783835.site-branding {
    5479     color: #28303d;
     3836    color: var(--branding--color-text);
    54803837    margin-right: 140px;
    54813838}
    … …  
    54953852
    54963853.site-title {
    5497     color: #28303d;
    5498     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5499     font-size: 1.5rem;
     3854    color: var(--branding--color-link);
     3855    font-family: var(--branding--title--font-family);
     3856    font-size: var(--branding--title--font-size-mobile);
    55003857    letter-spacing: normal;
    5501     text-transform: uppercase;
    5502     line-height: 1.3;
    5503     margin-bottom: 5px;
     3858    text-transform: var(--branding--title--text-transform);
     3859    line-height: var(--global--line-height-heading);
     3860    margin-bottom: calc(var(--global--spacing-vertical) / 6);
    55043861}
    55053862
    55063863.site-title a {
    55073864    color: currentColor;
    5508     font-weight: normal;
     3865    font-weight: var(--branding--title--font-weight);
    55093866}
    55103867
    … …  
    55153872}
    55163873
    5517 .site-title a:hover {
    5518     color: #39414d;
    5519 }
    5520 
     3874.site-title a:hover,
    55213875.site-title a:focus {
    5522     color: #39414d;
     3876    color: var(--branding--color-link-hover);
    55233877}
    55243878@media only screen and (min-width: 482px) {
    55253879
    55263880    .site-title {
    5527         font-size: 1.5rem;
     3881        font-size: var(--branding--title--font-size);
    55283882    }
    55293883}
    … …  
    55313885.site-description {
    55323886    color: currentColor;
    5533     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5534     font-size: 1.125rem;
     3887    font-family: var(--branding--description--font-family);
     3888    font-size: var(--branding--description--font-size);
    55353889    line-height: 1.4;
    55363890}
    … …  
    55403894}
    55413895
     3896.has-background-white a.custom-logo-link:focus,
     3897.is-dark-theme a.custom-logo-link:focus {
     3898    background: none;
     3899}
     3900
    55423901.site-title > a {
    5543     text-decoration-color: #39414d;
     3902    text-decoration-color: var(--global--color-secondary);
    55443903}
    55453904
    55463905.site-logo {
    5547     margin: 15px 0;
     3906    margin: calc(var(--global--spacing-vertical) / 2) 0;
    55483907}
    55493908
    55503909.site-header > .site-logo {
    55513910    width: 100%;
    5552     padding-bottom: 45px;
     3911    padding-bottom: calc(var(--global--spacing-vertical) * 1.5);
    55533912    border-bottom: 1px solid;
    55543913    text-align: center;
    … …  
    55583917    margin-left: auto;
    55593918    margin-right: auto;
    5560     max-width: 96px;
    5561     max-height: 96px;
     3919    max-width: var(--branding--logo--max-width-mobile);
     3920    max-height: var(--branding--logo--max-height-mobile);
    55623921    height: auto;
    55633922    display: inline-block;
    … …  
    55673926
    55683927    .site-logo .custom-logo {
    5569         max-width: 300px;
    5570         max-height: 100px;
     3928        max-width: var(--branding--logo--max-width);
     3929        max-height: var(--branding--logo--max-height);
    55713930        height: auto;
    55723931        width: auto;
    … …  
    55783937    .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo {
    55793938        position: absolute;
    5580         padding-top: 15px;
     3939        padding-top: calc(0.5 * var(--global--spacing-vertical));
    55813940        margin-top: 0;
    5582         top: 0;
     3941        top: var(--global--admin-bar--height);
    55833942    }
    55843943
    … …  
    55883947
    55893948    .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo img {
    5590         max-height: calc(10px + 2em);
     3949        max-height: calc(var(--button--padding-vertical) - (0.25 * var(--global--spacing-unit)) + 1.7em);
    55913950    }
    55923951
    … …  
    56193978        position: relative;
    56203979        padding-top: 0;
    5621         margin-top: -10px;
     3980        margin-top: calc(0px - var(--button--padding-vertical) + (0.25 * var(--global--spacing-unit)));
    56223981    }
    56233982
    56243983    body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu {
    5625         padding-left: 11px;
    5626         padding-right: 11px;
    5627         margin-right: -15px;
     3984        padding-left: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px);
     3985        padding-right: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px);
     3986        margin-right: calc(0px - var(--global--spacing-horizontal) * 0.6);
    56283987    }
    56293988
    … …  
    56403999.site-footer {
    56414000    padding-top: 0;
    5642     padding-bottom: 51px;
     4001    padding-bottom: calc(1.7 * var(--global--spacing-vertical));
    56434002}
    56444003
    56454004.no-widgets .site-footer {
    5646     margin-top: 180px;
     4005    margin-top: calc(6 * var(--global--spacing-vertical));
     4006}
     4007@media only screen and (max-width: 481px) {
     4008
     4009    .no-widgets .site-footer {
     4010        margin-top: calc(3 * var(--global--spacing-vertical));
     4011    }
    56474012}
    56484013
    56494014.site-footer > .site-info {
    5650     padding-top: 30px;
    5651     color: #28303d;
    5652     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5653     font-size: 1.125rem;
    5654     line-height: 1.7;
    5655     border-top: 3px solid #28303d;
     4015    padding-top: var(--global--spacing-vertical);
     4016    color: var(--footer--color-text);
     4017    font-family: var(--footer--font-family);
     4018    font-size: var(--footer--font-size);
     4019    line-height: var(--global--line-height-body);
     4020    border-top: 3px solid var(--global--color-border);
    56564021}
    56574022
    56584023.site-footer > .site-info .site-name {
    5659     text-transform: uppercase;
    5660     font-size: 1.5rem;
     4024    text-transform: var(--branding--title--text-transform);
     4025    font-size: var(--branding--title--font-size);
    56614026}
    56624027
    56634028.site-footer > .site-info .powered-by {
    5664     margin-top: 15px;
     4029    margin-top: calc(0.5 * var(--global--spacing-vertical));
    56654030}
    56664031@media only screen and (min-width: 822px) {
    … …  
    56784043
    56794044.site-footer > .site-info a {
    5680     color: #28303d;
    5681 }
    5682 
    5683 .site-footer > .site-info a:link {
    5684     color: #28303d;
    5685 }
    5686 
    5687 .site-footer > .site-info a:visited {
    5688     color: #28303d;
    5689 }
    5690 
     4045    color: var(--footer--color-link);
     4046}
     4047
     4048.site-footer > .site-info a:link,
     4049.site-footer > .site-info a:visited,
    56914050.site-footer > .site-info a:active {
    5692     color: #28303d;
     4051    color: var(--footer--color-link);
    56934052}
    56944053
    56954054.site-footer > .site-info a:hover {
    5696     color: #28303d;
     4055    color: var(--footer--color-link-hover);
    56974056}
    56984057
    56994058.site-footer > .site-info a:focus {
    5700     color: #28303d;
     4059    color: var(--footer--color-link-hover);
    57014060}
    57024061
    57034062.is-dark-theme .site-footer > .site-info a:focus {
    5704     color: #d1e4dd;
     4063    color: var(--wp--style--color--link, var(--global--color-background));
     4064}
     4065
     4066.has-background-white .site-footer > .site-info a:focus {
     4067    color: var(--wp--style--color--link, var(--global--color-white));
    57054068}
    57064069
    57074070.singular .entry-header {
    5708     border-bottom: 3px solid #28303d;
    5709     padding-bottom: 60px;
    5710     margin-bottom: 90px;
     4071    border-bottom: 3px solid var(--global--color-border);
     4072    padding-bottom: calc(2 * var(--global--spacing-vertical));
     4073    margin-bottom: calc(3 * var(--global--spacing-vertical));
    57114074}
    57124075
    … …  
    57194082.singular .has-post-thumbnail .entry-header {
    57204083    border-bottom: none;
    5721     padding-bottom: 39px;
     4084    padding-bottom: calc(1.3 * var(--global--spacing-vertical));
    57224085    margin-bottom: 0;
    57234086}
    57244087
    57254088.no-results.not-found > *:first-child {
    5726     margin-bottom: 90px;
     4089    margin-bottom: calc(3 * var(--global--spacing-vertical));
    57274090}
    57284091
    … …  
    57334096.page-links .post-page-numbers {
    57344097    display: inline-block;
    5735     margin-left: 13px;
    5736     margin-right: 13px;
     4098    margin-left: calc(0.66 * var(--global--spacing-unit));
     4099    margin-right: calc(0.66 * var(--global--spacing-unit));
    57374100    min-width: 44px;
    57384101    min-height: 44px;
    … …  
    57444107
    57454108.entry-title {
    5746     color: #28303d;
    5747     font-size: 2.25rem;
    5748     letter-spacing: normal;
    5749     line-height: 1.3;
     4109    color: var(--entry-header--color);
     4110    font-size: var(--entry-header--font-size);
     4111    letter-spacing: var(--heading--letter-spacing-h2);
     4112    line-height: var(--heading--line-height-h2);
    57504113    overflow-wrap: break-word;
    57514114}
    57524115
    5753 @media only screen and (min-width: 652px) {
    5754 
    5755     .entry-title {
    5756         font-size: 3rem;
    5757     }
    5758 }
    5759 
    5760 @media only screen and (min-width: 652px) {
    5761 
    5762     .entry-title {
    5763         font-size: 3rem;
    5764     }
    5765 }
    5766 
    57674116.entry-title a {
    5768     color: currentColor;
     4117    color: var(--entry-header--color-link);
    57694118    text-underline-offset: 0.15em;
    57704119}
    57714120
    57724121.entry-title a:hover {
    5773     color: #28303d;
     4122    color: var(--entry-header--color-hover);
    57744123}
    57754124
    57764125.entry-title a:focus {
    5777     color: #39414d;
     4126    color: var(--entry-header--color-focus);
    57784127}
    57794128
    57804129.entry-title a:active {
    5781     color: currentColor;
     4130    color: var(--entry-header--color-link);
    57824131}
    57834132
    57844133.singular .entry-title {
    5785     font-size: 4rem;
    5786 }
    5787 
    5788 @media only screen and (min-width: 652px) {
    5789 
    5790     .singular .entry-title {
    5791         font-size: 6rem;
    5792     }
     4134    font-size: var(--global--font-size-page-title);
    57934135}
    57944136
    57954137h1.entry-title {
    5796     line-height: 1.1;
    5797     font-weight: 300;
     4138    line-height: var(--heading--line-height-h1);
     4139    font-weight: var(--heading--font-weight-page-title);
    57984140}
    57994141
    … …  
    58014143 * Entry Content
    58024144 */
    5803 .entry-content {
    5804     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5805 }
    5806 
     4145.entry-content,
    58074146.entry-summary {
    5808     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     4147    font-family: var(--entry-content--font-family);
    58094148}
    58104149
    … …  
    58144153
    58154154.entry-content > iframe[style] {
    5816     margin: 30px 0 !important;
     4155    margin: var(--global--spacing-vertical) 0 !important;
    58174156    max-width: 100% !important;
    58184157}
    … …  
    58204159
    58214160    .entry-content > iframe[style] {
    5822         max-width: 30px !important;
     4161        max-width: var(--global--spacing-vertical) !important;
    58234162    }
    58244163}
    58254164
    58264165.entry-footer {
    5827     color: #28303d;
     4166    color: var(--global--color-primary);
    58284167    clear: both;
    58294168    float: none;
    5830     font-size: 1rem;
     4169    font-size: var(--global--font-size-xs);
    58314170    display: block;
    58324171}
    … …  
    58404179}
    58414180
    5842 .entry-footer a:hover {
    5843     color: #28303d;
    5844 }
    5845 
     4181.entry-footer a:hover,
    58464182.entry-footer a:focus {
    5847     color: #28303d;
     4183    color: var(--global--color-primary-hover);
    58484184}
    58494185
    … …  
    58534189
    58544190.site-main > article > .entry-footer {
    5855     margin-top: 30px;
    5856     padding-top: 20px;
    5857     padding-bottom: 90px;
    5858     border-bottom: 1px solid #28303d;
     4191    margin-top: var(--global--spacing-vertical);
     4192    padding-top: var(--global--spacing-unit);
     4193    padding-bottom: calc(3 * var(--global--spacing-vertical));
     4194    border-bottom: var(--separator--height) solid var(--separator--border-color);
    58594195}
    58604196
    58614197body:not(.single) .site-main > article:last-of-type .entry-footer {
    5862     border-bottom: 1px solid transparent;
     4198    border-bottom: var(--separator--height) solid transparent;
    58634199}
    58644200
    58654201.single .site-main > article > .entry-footer {
    5866     margin-top: 102px;
    5867     margin-bottom: 102px;
     4202    margin-top: calc(3.4 * var(--global--spacing-vertical));
     4203    margin-bottom: calc(3.4 * var(--global--spacing-vertical));
    58684204    padding-bottom: 0;
    5869     padding-top: 24px;
    5870     border-top: 3px solid #28303d;
    5871     border-bottom: 1px solid transparent;
     4205    padding-top: calc(0.8 * var(--global--spacing-vertical));
     4206    border-top: 3px solid var(--separator--border-color);
     4207    border-bottom: var(--separator--height) solid transparent;
    58724208    display: grid;
    58734209    grid-template-columns: repeat(2, 1fr);
    5874     column-gap: 50px;
     4210    column-gap: calc(2 * var(--global--spacing-horizontal));
    58754211}
    58764212
    … …  
    59204256    margin-left: auto;
    59214257    margin-right: auto;
    5922     margin-top: 60px;
     4258    margin-top: calc(2 * var(--global--spacing-vertical));
    59234259}
    59244260
    … …  
    59284264.author-bio {
    59294265    position: relative;
    5930     font-size: 1rem;
    5931     max-width: calc(100vw - 30px);
    5932 }
    5933 @media only screen and (min-width: 482px) {
    5934 
    5935     .author-bio {
    5936         max-width: min(calc(100vw - 100px), 610px);
    5937     }
    5938 }
    5939 @media only screen and (min-width: 822px) {
    5940 
    5941     .author-bio {
    5942         max-width: min(calc(100vw - 200px), 610px);
    5943     }
     4266    font-size: var(--global--font-size-xs);
     4267    max-width: var(--responsive--aligndefault-width);
    59444268}
    59454269
    59464270.site-main > article > .author-bio {
    5947     margin-top: 60px;
     4271    margin-top: calc(2 * var(--global--spacing-vertical));
    59484272}
    59494273
    … …  
    59564280.author-bio.show-avatars .author-bio-content {
    59574281    display: inline-block;
    5958     padding-left: 25px;
    5959     max-width: calc(100vw - 120px);
    5960 }
    5961 @media only screen and (min-width: 482px) {
    5962 
    5963     .author-bio.show-avatars .author-bio-content {
    5964         max-width: calc(min(calc(100vw - 4 * 25px), 610px) - 90px);
    5965     }
    5966 }
    5967 @media only screen and (min-width: 822px) {
    5968 
    5969     .author-bio.show-avatars .author-bio-content {
    5970         max-width: calc(min(calc(100vw - 8 * 25px), 610px) - 90px);
    5971     }
     4282    padding-left: var(--global--spacing-horizontal);
     4283    max-width: calc(var(--responsive--aligndefault-width) - 90px);
    59724284}
    59734285
    59744286.author-bio .author-bio-content .author-title {
    5975     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    5976     font-size: 1.5rem;
     4287    font-family: var(--entry-author-bio--font-family);
     4288    font-size: var(--entry-author-bio--font-size);
    59774289    display: inline;
    59784290}
    59794291
    59804292.author-bio .author-bio-content .author-description {
    5981     font-size: 1rem;
    5982     margin-top: 15px;
    5983     margin-bottom: 15px;
     4293    font-size: var(--global--font-size-xs);
     4294    margin-top: calc(0.5 * var(--global--spacing-vertical));
     4295    margin-bottom: calc(0.5 * var(--global--spacing-vertical));
    59844296}
    59854297
    59864298.page-title {
    5987     font-size: 4rem;
    5988 }
    5989 
    5990 @media only screen and (min-width: 652px) {
    5991 
    5992     .page-title {
    5993         font-size: 6rem;
    5994     }
     4299    font-size: var(--global--font-size-page-title);
     4300}
     4301
     4302h1.page-title,
     4303h2.page-title {
     4304    font-weight: var(--heading--font-weight-page-title);
    59954305}
    59964306
    59974307h1.page-title {
    5998     font-weight: 300;
    5999 }
    6000 
    6001 h2.page-title {
    6002     font-weight: 300;
    6003 }
    6004 
    6005 h1.page-title {
    6006     line-height: 1.1;
     4308    line-height: var(--heading--line-height-h1);
    60074309}
    60084310
    60094311.page-header {
    6010     border-bottom: 3px solid #28303d;
    6011     padding-bottom: 60px;
    6012 }
    6013 
    6014 .archive .content-area .format-aside .entry-content {
    6015     font-size: 1.5rem;
    6016 }
    6017 
    6018 .archive .content-area .format-status .entry-content {
    6019     font-size: 1.5rem;
    6020 }
    6021 
    6022 .archive .content-area .format-link .entry-content {
    6023     font-size: 1.5rem;
    6024 }
    6025 
    6026 .search .content-area .format-aside .entry-content {
    6027     font-size: 1.5rem;
    6028 }
    6029 
    6030 .search .content-area .format-status .entry-content {
    6031     font-size: 1.5rem;
    6032 }
    6033 
    6034 .search .content-area .format-link .entry-content {
    6035     font-size: 1.5rem;
    6036 }
    6037 
    6038 .blog .content-area .format-aside .entry-content {
    6039     font-size: 1.5rem;
    6040 }
    6041 
    6042 .blog .content-area .format-status .entry-content {
    6043     font-size: 1.5rem;
    6044 }
    6045 
     4312    border-bottom: 3px solid var(--global--color-border);
     4313    padding-bottom: calc(2 * var(--global--spacing-vertical));
     4314}
     4315
     4316.archive .content-area .format-aside .entry-content,
     4317.archive .content-area .format-status .entry-content,
     4318.archive .content-area .format-link .entry-content,
     4319.search .content-area .format-aside .entry-content,
     4320.search .content-area .format-status .entry-content,
     4321.search .content-area .format-link .entry-content,
     4322.blog .content-area .format-aside .entry-content,
     4323.blog .content-area .format-status .entry-content,
    60464324.blog .content-area .format-link .entry-content {
    6047     font-size: 1.5rem;
    6048 }
    6049 
    6050 .archive .format-image .entry-content {
    6051     margin-top: 60px;
    6052 }
    6053 
    6054 .archive .format-gallery .entry-content {
    6055     margin-top: 60px;
    6056 }
    6057 
    6058 .archive .format-video .entry-content {
    6059     margin-top: 60px;
    6060 }
    6061 
    6062 .search .format-image .entry-content {
    6063     margin-top: 60px;
    6064 }
    6065 
    6066 .search .format-gallery .entry-content {
    6067     margin-top: 60px;
    6068 }
    6069 
    6070 .search .format-video .entry-content {
    6071     margin-top: 60px;
    6072 }
    6073 
    6074 .blog .format-image .entry-content {
    6075     margin-top: 60px;
    6076 }
    6077 
    6078 .blog .format-gallery .entry-content {
    6079     margin-top: 60px;
    6080 }
    6081 
     4325    font-size: var(--global--font-size-lg);
     4326}
     4327
     4328.archive .format-image .entry-content,
     4329.archive .format-gallery .entry-content,
     4330.archive .format-video .entry-content,
     4331.search .format-image .entry-content,
     4332.search .format-gallery .entry-content,
     4333.search .format-video .entry-content,
     4334.blog .format-image .entry-content,
     4335.blog .format-gallery .entry-content,
    60824336.blog .format-video .entry-content {
    6083     margin-top: 60px;
     4337    margin-top: calc(2 * var(--global--spacing-vertical));
    60844338}
    60854339
    … …  
    60934347}
    60944348
    6095 .archive.logged-in .entry-footer .posted-on {
    6096     margin-right: 10px;
    6097 }
    6098 
    6099 .search.logged-in .entry-footer .posted-on {
    6100     margin-right: 10px;
    6101 }
    6102 
     4349.archive.logged-in .entry-footer .posted-on,
     4350.search.logged-in .entry-footer .posted-on,
    61034351.blog.logged-in .entry-footer .posted-on {
    6104     margin-right: 10px;
     4352    margin-right: calc(0.5 * var(--global--spacing-unit));
    61054353}
    61064354
    61074355.archive-description {
    6108     margin-top: 30px;
    6109     font-size: 2.25rem;
    6110     line-height: 1.3;
    6111 }
    6112 
    6113 @media only screen and (min-width: 652px) {
    6114 
    6115     .archive-description {
    6116         font-size: 2.5rem;
    6117     }
     4356    margin-top: var(--global--spacing-vertical);
     4357    font-size: var(--global--font-size-xl);
     4358    line-height: var(--global--line-height-heading);
    61184359}
    61194360
    61204361.error404 main p {
    6121     font-size: 1.5rem;
    6122     margin-bottom: 50px;
     4362    font-size: var(--global--font-size-lg);
     4363    margin-bottom: calc(var(--global--spacing-vertical) * 1.6666666667);
    61234364}
    61244365
    61254366.search-no-results .page-content {
    6126     margin-top: 90px;
     4367    margin-top: calc(3 * var(--global--spacing-vertical));
    61274368}
    61284369
    … …  
    61314372 */
    61324373.comments-area > * {
    6133     margin-top: 30px;
    6134     margin-bottom: 30px;
     4374    margin-top: var(--global--spacing-vertical);
     4375    margin-bottom: var(--global--spacing-vertical);
    61354376}
    61364377
    … …  
    61614402 * Comment Title
    61624403 */
    6163 .comments-title {
    6164     font-size: 2.25rem;
    6165     letter-spacing: normal;
    6166 }
    6167 @media only screen and (min-width: 652px) {
    6168 
    6169     .comments-title {
    6170         font-size: 3rem;
    6171     }
    6172 }
    6173 @media only screen and (min-width: 652px) {
    6174 
    6175     .comments-title {
    6176         font-size: 3rem;
    6177     }
    6178 }
    6179 
     4404.comments-title,
    61804405.comment-reply-title {
    6181     font-size: 2.25rem;
    6182     letter-spacing: normal;
    6183 }
    6184 @media only screen and (min-width: 652px) {
    6185 
    6186     .comment-reply-title {
    6187         font-size: 3rem;
    6188     }
    6189 }
    6190 @media only screen and (min-width: 652px) {
    6191 
    6192     .comment-reply-title {
    6193         font-size: 3rem;
    6194     }
     4406    font-size: var(--heading--font-size-h2);
     4407    letter-spacing: var(--heading--letter-spacing-h2);
    61954408}
    61964409
    … …  
    62014414
    62024415.comment-reply-title small a {
    6203     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    6204     font-size: 1rem;
     4416    font-family: var(--global--font-secondary);
     4417    font-size: var(--global--font-size-xs);
    62054418    font-style: normal;
    62064419    font-weight: normal;
    … …  
    62104423/* Nested comment reply title*/
    62114424.comment .comment-respond .comment-reply-title {
    6212     font-size: 1.5rem;
     4425    font-size: var(--global--font-size-lg);
    62134426}
    62144427
    … …  
    62224435
    62234436.comment-list > li {
    6224     margin-top: 30px;
    6225     margin-bottom: 30px;
     4437    margin-top: var(--global--spacing-vertical);
     4438    margin-bottom: var(--global--spacing-vertical);
    62264439}
    62274440
    … …  
    62324445
    62334446.comment-list .children > li {
    6234     margin-top: 30px;
    6235     margin-bottom: 30px;
     4447    margin-top: var(--global--spacing-vertical);
     4448    margin-bottom: var(--global--spacing-vertical);
    62364449}
    62374450
    62384451@media only screen and (min-width: 482px) {
    62394452
    6240     .comment-list .depth-2 {
    6241         padding-left: 100px;
    6242     }
    6243 
     4453    .comment-list .depth-2,
    62444454    .comment-list .depth-3 {
    6245         padding-left: 100px;
     4455        padding-left: calc(4 * var(--global--spacing-horizontal));
    62464456    }
    62474457}
    … …  
    62514461 */
    62524462.comment-meta .comment-author {
    6253     line-height: 1.3;
    6254     margin-bottom: 5px;
     4463    line-height: var(--global--line-height-heading);
     4464    margin-bottom: calc(0.25 * var(--global--spacing-unit));
    62554465}
    62564466@media only screen and (min-width: 482px) {
    … …  
    62634473
    62644474.comment-meta .comment-author .fn {
    6265     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     4475    font-family: var(--global--font-secondary);
    62664476    font-weight: normal;
    6267     font-size: 1.5rem;
     4477    font-size: var(--global--font-size-lg);
    62684478    hyphens: auto;
    62694479    word-wrap: break-word;
    … …  
    62724482
    62734483.comment-meta .comment-metadata {
    6274     color: #28303d;
    6275     font-size: 1rem;
     4484    color: var(--global--color-primary);
     4485    font-size: var(--global--font-size-xs);
    62764486    padding: 8px 0 9px 0;
    62774487}
    62784488
    62794489.comment-meta .comment-metadata .edit-link {
    6280     margin-left: 25px;
     4490    margin-left: var(--global--spacing-horizontal);
    62814491}
    62824492@media only screen and (min-width: 482px) {
    … …  
    62924502
    62934503.reply {
    6294     font-size: 1.125rem;
    6295     line-height: 1.3;
     4504    font-size: var(--global--font-size-sm);
     4505    line-height: var(--global--line-height-heading);
    62964506}
    62974507
    … …  
    63044514}
    63054515
    6306 .pingback .url {
    6307     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    6308 }
    6309 
     4516.pingback .url,
    63104517.trackback .url {
    6311     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     4518    font-family: var(--global--font-primary);
    63124519}
    63134520
    63144521.comment-body {
    63154522    position: relative;
    6316     margin-bottom: 51px;
     4523    margin-bottom: calc(1.7 * var(--global--spacing-vertical));
    63174524}
    63184525
    63194526.comment-body > * {
    6320     margin-top: 30px;
    6321     margin-bottom: 30px;
     4527    margin-top: var(--global--spacing-vertical);
     4528    margin-bottom: var(--global--spacing-vertical);
    63224529}
    63234530
    … …  
    63304537}
    63314538
    6332 .pingback .comment-body {
    6333     margin-top: 30px;
    6334     margin-bottom: 30px;
    6335 }
    6336 
     4539.pingback .comment-body,
    63374540.trackback .comment-body {
    6338     margin-top: 30px;
    6339     margin-bottom: 30px;
     4541    margin-top: var(--global--spacing-vertical);
     4542    margin-bottom: var(--global--spacing-vertical);
    63404543}
    63414544
    63424545.comment-respond {
    6343     margin-top: 30px;
     4546    margin-top: var(--global--spacing-vertical);
    63444547}
    63454548
    63464549.comment-respond > * {
    6347     margin-top: 20px;
    6348     margin-bottom: 20px;
     4550    margin-top: var(--global--spacing-unit);
     4551    margin-bottom: var(--global--spacing-unit);
    63494552}
    63504553
    … …  
    63584561
    63594562.comment-respond > *:last-child.comment-form {
    6360     margin-bottom: 30px;
     4563    margin-bottom: var(--global--spacing-vertical);
    63614564}
    63624565
    … …  
    63794582
    63804583.comment-form .comment-notes {
    6381     font-size: 1.125rem;
     4584    font-size: var(--global--font-size-sm);
    63824585}
    63834586
    … …  
    64004603}
    64014604
    6402 .comment-form .comment-form-cookies-consent > label {
    6403     font-size: 1rem;
     4605.comment-form .comment-form-cookies-consent > label,
     4606.comment-form .comment-notes {
     4607    font-size: var(--global--font-size-xs);
    64044608    font-weight: normal;
    64054609}
    64064610
    6407 .comment-form .comment-notes {
    6408     font-size: 1rem;
    6409     font-weight: normal;
    6410 }
    6411 
    64124611.comment-form > p {
    6413     margin-bottom: 20px;
     4612    margin-bottom: var(--global--spacing-unit);
    64144613}
    64154614
    … …  
    64224621}
    64234622
    6424 .comment-form > p label {
    6425     display: block;
    6426     font-size: 1.125rem;
    6427     margin-bottom: 10px;
    6428     width: 100%;
    6429     font-weight: 500;
    6430 }
    6431 
    6432 .comment-form > p input[type=email] {
    6433     display: block;
    6434     font-size: 1.125rem;
    6435     margin-bottom: 10px;
    6436     width: 100%;
    6437     font-weight: 500;
    6438 }
    6439 
    6440 .comment-form > p input[type=text] {
    6441     display: block;
    6442     font-size: 1.125rem;
    6443     margin-bottom: 10px;
    6444     width: 100%;
    6445     font-weight: 500;
    6446 }
    6447 
    6448 .comment-form > p input[type=url] {
    6449     display: block;
    6450     font-size: 1.125rem;
    6451     margin-bottom: 10px;
    6452     width: 100%;
    6453     font-weight: 500;
    6454 }
    6455 
     4623.comment-form > p label,
     4624.comment-form > p input[type=email],
     4625.comment-form > p input[type=text],
     4626.comment-form > p input[type=url],
    64564627.comment-form > p textarea {
    64574628    display: block;
    6458     font-size: 1.125rem;
    6459     margin-bottom: 10px;
     4629    font-size: var(--global--font-size-sm);
     4630    margin-bottom: calc(.5 * var(--global--spacing-unit));
    64604631    width: 100%;
    6461     font-weight: 500;
     4632    font-weight: var(--form--label-weight);
    64624633}
    64634634
    … …  
    64684639
    64694640    .comment-form > p.comment-form-author {
    6470         margin-right: 38px;
     4641        margin-right: calc(1.5 * var(--global--spacing-horizontal));
    64714642    }
    64724643
    … …  
    64824653    position: absolute;
    64834654    right: 0;
    6484     padding-top: 15px;
    6485     padding-bottom: 8px;
     4655    padding-top: calc(0.5 * var(--global--spacing-vertical));
     4656    padding-bottom: calc(0.25 * var(--global--spacing-vertical));
    64864657}
    64874658
    64884659.menu-button-container #primary-mobile-menu {
    64894660    margin-left: auto;
    6490     padding: 10px 15px;
     4661    padding: calc(var(--button--padding-vertical) - (0.25 * var(--global--spacing-unit))) calc(0.5 * var(--button--padding-horizontal));
    64914662}
    64924663@media only screen and (max-width: 481px) {
    … …  
    64994670.menu-button-container .button.button {
    65004671    display: flex;
    6501     font-size: 1rem;
    6502     font-weight: 500;
     4672    font-size: var(--primary-nav--font-size-button);
     4673    font-weight: var(--primary-nav--font-weight-button);
    65034674    background-color: transparent;
    65044675    border: none;
    6505     color: #28303d;
     4676    color: var(--primary-nav--color-link);
    65064677}
    65074678
    … …  
    65124683
    65134684.menu-button-container .button.button .dropdown-icon .svg-icon {
    6514     margin-left: 5px;
     4685    margin-left: calc(0.25 * var(--global--spacing-unit));
    65154686}
    65164687
    … …  
    65404711    width: 100%;
    65414712    z-index: 500;
    6542     background-color: #d1e4dd;
     4713    background-color: var(--global--color-background);
    65434714}
    65444715
    … …  
    65494720.primary-navigation {
    65504721    position: absolute;
    6551     top: 0;
     4722    top: var(--global--admin-bar--height);
    65524723    right: 0;
    6553     color: #28303d;
    6554     font-size: 1.25rem;
     4724    color: var(--primary-nav--color-text);
     4725    font-size: var(--primary-nav--font-size);
    65554726    line-height: 1.15;
    65564727    margin-top: 0;
    … …  
    65664737    bottom: 0;
    65674738    left: 0;
    6568     padding-top: calc(2rem + 47px);
    6569     padding-left: 20px;
    6570     padding-right: 20px;
    6571     padding-bottom: 25px;
    6572     background-color: #d1e4dd;
     4739    padding-top: calc(var(--button--line-height) * var(--primary-nav--font-size-button) + 42px + 5px);
     4740    padding-left: var(--global--spacing-unit);
     4741    padding-right: var(--global--spacing-unit);
     4742    padding-bottom: var(--global--spacing-horizontal);
     4743    background-color: var(--global--color-background);
    65734744    transition: all 0.15s ease-in-out;
    6574     transform: translateY(30px);
     4745    transform: translateY(var(--global--spacing-vertical));
    65754746}
    65764747@media only screen and (max-width: 481px) {
    … …  
    65904761
    65914762    .admin-bar .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container {
    6592         top: 32px;
    6593     }
    6594     @media only screen and (max-width: 782px) {
    6595 
    6596         .admin-bar .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container {
    6597             top: 46px;
    6598         }
     4763        top: var(--global--admin-bar--height);
    65994764    }
    66004765
    66014766    .admin-bar .primary-navigation > .primary-menu-container {
    6602         height: calc(100vh - 32px);
    6603     }
    6604     @media only screen and (max-width: 782px) {
    6605 
    6606         .admin-bar .primary-navigation > .primary-menu-container {
    6607             height: calc(100vh - 46px);
    6608         }
     4767        height: calc(100vh - var(--global--admin-bar--height));
    66094768    }
    66104769
    66114770    .primary-navigation > .primary-menu-container:focus {
    6612         border: 2px solid #28303d;
     4771        border: 2px solid var(--global--color-primary);
    66134772    }
    66144773}
    … …  
    67084867.primary-navigation > div > .menu-wrapper .sub-menu-toggle {
    67094868    display: flex;
    6710     height: calc(27px + 1em);
     4869    height: calc(2 * var(--primary-nav--padding) + 1.15em + 1px);
    67114870    width: 44px;
    67124871    padding: 0;
    … …  
    67194878
    67204879.primary-navigation > div > .menu-wrapper .sub-menu-toggle:focus {
    6721     outline: 2px solid #28303d;
     4880    outline: 2px solid var(--wp--style--color--link, var(--global--color-primary));
    67224881}
    67234882@media only screen and (max-width: 481px) {
    … …  
    67684927    }
    67694928
    6770     .primary-navigation > div > .menu-wrapper > li > .sub-menu:before {
    6771         content: "";
    6772         display: block;
    6773         position: absolute;
    6774         width: 0;
    6775         top: -10px;
    6776         left: 25px;
    6777         border-style: solid;
    6778         border-color: #28303d transparent;
    6779         border-width: 0 7px 10px 7px;
    6780     }
    6781 
     4929    .primary-navigation > div > .menu-wrapper > li > .sub-menu:before,
    67824930    .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
    67834931        content: "";
    … …  
    67864934        width: 0;
    67874935        top: -10px;
    6788         left: 25px;
     4936        left: var(--global--spacing-horizontal);
    67894937        border-style: solid;
    6790         border-color: #28303d transparent;
     4938        border-color: var(--primary-nav--border-color) transparent;
    67914939        border-width: 0 7px 10px 7px;
    67924940    }
    … …  
    67944942    .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
    67954943        top: -9px;
    6796         border-color: #d1e4dd transparent;
     4944        border-color: var(--global--color-background) transparent;
    67974945    }
    67984946
    67994947    .primary-navigation > div > .menu-wrapper > li > .sub-menu li {
    6800         background: #d1e4dd;
     4948        background: var(--global--color-background);
    68014949    }
    68024950
    … …  
    68104958    }
    68114959
    6812     .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:before {
     4960    .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:before,
     4961    .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:after {
    68134962
    68144963        /* rtl:ignore */
    6815         left: 25px;
     4964        left: var(--global--spacing-horizontal);
    68164965
    68174966        /* rtl:ignore */
    … …  
    68194968    }
    68204969
    6821     .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:after {
    6822 
    6823         /* rtl:ignore */
    6824         left: 25px;
    6825 
    6826         /* rtl:ignore */
    6827         right: auto;
    6828     }
    6829 
    68304970    .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right {
    68314971
    … …  
    68374977    }
    68384978
    6839     .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:before {
     4979    .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:before,
     4980    .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:after {
    68404981
    68414982        /* rtl:ignore */
    … …  
    68434984
    68444985        /* rtl:ignore */
    6845         right: 25px;
    6846     }
    6847 
    6848     .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:after {
    6849 
    6850         /* rtl:ignore */
    6851         left: auto;
    6852 
    6853         /* rtl:ignore */
    6854         right: 25px;
     4986        right: var(--global--spacing-horizontal);
    68554987    }
    68564988}
    68574989
    68584990.primary-navigation .primary-menu > .menu-item:hover > a {
    6859     color: #28303d;
     4991    color: var(--primary-nav--color-link-hover);
    68604992}
    68614993@media only screen and (min-width: 482px) {
    68624994
    68634995    .primary-navigation .primary-menu-container {
    6864         margin-right: -13px;
    6865         margin-left: -13px;
     4996        margin-right: calc(0px - var(--primary-nav--padding));
     4997        margin-left: calc(0px - var(--primary-nav--padding));
    68664998    }
    68674999
    … …  
    68715003
    68725004    .primary-navigation .primary-menu-container > ul > .menu-item > a {
    6873         padding-left: 13px;
    6874         padding-right: 13px;
     5005        padding-left: var(--primary-nav--padding);
     5006        padding-right: var(--primary-nav--padding);
    68755007    }
    68765008
    68775009    .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle {
    6878         margin-left: -13px;
     5010        margin-left: calc(5px - var(--primary-nav--padding));
    68795011    }
    68805012}
    … …  
    68825014.primary-navigation a {
    68835015    display: block;
    6884     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    6885     font-size: 1.125rem;
    6886     font-weight: normal;
    6887     padding: 13px 0;
     5016    font-family: var(--primary-nav--font-family-mobile);
     5017    font-size: var(--primary-nav--font-size-mobile);
     5018    font-weight: var(--primary-nav--font-weight);
     5019    padding: var(--primary-nav--padding) 0;
    68885020    text-decoration: none;
    68895021}
    … …  
    68925024    .primary-navigation a {
    68935025        display: block;
    6894         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    6895         font-size: 1.25rem;
    6896         font-weight: normal;
     5026        font-family: var(--primary-nav--font-family);
     5027        font-size: var(--primary-nav--font-size);
     5028        font-weight: var(--primary-nav--font-weight);
    68975029    }
    68985030}
    68995031
    69005032.primary-navigation a + svg {
    6901     fill: #28303d;
    6902 }
    6903 
    6904 .primary-navigation a:hover {
    6905     color: #28303d;
    6906 }
    6907 
    6908 .primary-navigation a:link {
    6909     color: #28303d;
    6910 }
    6911 
     5033    fill: var(--primary-nav--color-text);
     5034}
     5035
     5036.primary-navigation a:hover,
     5037.primary-navigation a:link,
    69125038.primary-navigation a:visited {
    6913     color: #28303d;
     5039    color: var(--primary-nav--color-link-hover);
    69145040}
    69155041
    … …  
    69235049    z-index: 99999;
    69245050    outline-offset: 0;
     5051    text-decoration-thickness: 2px;
    69255052}
    69265053
    … …  
    69415068    padding: 0;
    69425069    list-style: none;
    6943     margin-left: 13px;
    6944     border: 1px solid #28303d;
     5070    margin-left: var(--primary-nav--padding);
     5071    border: 1px solid var(--primary-nav--border-color);
    69455072}
    69465073
    … …  
    69625089
    69635090.primary-navigation .sub-menu .menu-item > a {
    6964     padding: 17px 13px;
     5091    padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding);
    69655092    display: block;
    6966     font-size: 1.125rem;
    6967     font-style: normal;
     5093    font-size: var(--primary-nav--font-size-sub-menu-mobile);
     5094    font-style: var(--primary-nav--font-style-sub-menu-mobile);
    69685095}
    69695096@media only screen and (min-width: 482px) {
    69705097
    69715098    .primary-navigation .sub-menu .menu-item > a {
    6972         font-size: 1rem;
    6973         font-style: normal;
     5099        font-size: var(--primary-nav--font-size-sub-menu);
     5100        font-style: var(--primary-nav--font-style);
    69745101    }
    69755102}
    … …  
    69935120    display: block;
    69945121    clear: both;
    6995     font-size: 1rem;
     5122    font-size: var(--global--font-size-xs);
    69965123    text-transform: none;
    69975124    line-height: 1.7;
    … …  
    70225149
    70235150.footer-navigation {
    7024     margin-top: 60px;
    7025     margin-bottom: 30px;
    7026     color: #28303d;
    7027     font-size: 1rem;
    7028     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     5151    margin-top: calc(2 * var(--global--spacing-vertical));
     5152    margin-bottom: var(--global--spacing-vertical);
     5153    color: var(--footer--color-text);
     5154    font-size: var(--global--font-size-xs);
     5155    font-family: var(--footer--font-family);
    70295156}
    70305157
    … …  
    70435170
    70445171.footer-navigation-wrapper li a {
    7045     padding: 17px 13px;
     5172    padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding);
    70465173    transition: transform 0.1s ease;
    7047     color: #28303d;
    7048 }
    7049 
    7050 .footer-navigation-wrapper li a:link {
    7051     color: #28303d;
    7052 }
    7053 
    7054 .footer-navigation-wrapper li a:visited {
    7055     color: #28303d;
    7056 }
    7057 
     5174    color: var(--footer--color-link);
     5175}
     5176
     5177.footer-navigation-wrapper li a:link,
     5178.footer-navigation-wrapper li a:visited,
    70585179.footer-navigation-wrapper li a:active {
    7059     color: #28303d;
     5180    color: var(--footer--color-link);
    70605181}
    70615182
    … …  
    70645185    text-decoration-style: dotted;
    70655186    text-decoration-skip-ink: none;
    7066     color: #28303d;
     5187    color: var(--footer--color-link-hover);
    70675188}
    70685189
    70695190.is-dark-theme .footer-navigation-wrapper li a:focus .svg-icon {
    7070     fill: #d1e4dd;
     5191    fill: var(--wp--style--color--link, var(--global--color-background));
     5192}
     5193
     5194.has-background-white .footer-navigation-wrapper li a:focus .svg-icon {
     5195    fill: var(--wp--style--color--link, var(--global--color-white));
    70715196}
    70725197
    70735198.footer-navigation-wrapper li .svg-icon {
    70745199    vertical-align: middle;
    7075     fill: #28303d;
     5200    fill: var(--footer--color-link);
    70765201}
    70775202
    … …  
    70875212/* Next/Previous navigation */
    70885213.navigation {
    7089     color: #28303d;
     5214    color: var(--global--color-primary);
    70905215}
    70915216
    70925217.navigation a {
    7093     color: #28303d;
     5218    color: var(--global--color-primary);
    70945219    text-decoration: none;
    70955220}
    70965221
    70975222.navigation a:hover {
    7098     color: #28303d;
     5223    color: var(--global--color-primary-hover);
    70995224    text-decoration: underline;
     5225    text-decoration-style: dotted;
    71005226}
    71015227
    71025228.navigation a:focus {
    7103     color: #39414d;
     5229    color: var(--global--color-secondary);
    71045230}
    71055231
    71065232.navigation a:active {
    7107     color: #28303d;
     5233    color: var(--global--color-primary);
    71085234}
    71095235
    … …  
    71305256    }
    71315257
    7132     .navigation .nav-links .nav-next {
    7133         flex: 0 1 auto;
    7134         margin-bottom: inherit;
    7135         margin-top: inherit;
    7136         max-width: calc(50% - 10px);
    7137     }
    7138 
     5258    .navigation .nav-links .nav-next,
    71395259    .navigation .nav-links .nav-previous {
    71405260        flex: 0 1 auto;
    71415261        margin-bottom: inherit;
    71425262        margin-top: inherit;
    7143         max-width: calc(50% - 10px);
     5263        max-width: calc(50% - (0.5 * var(--global--spacing-unit)));
    71445264    }
    71455265
    … …  
    71565276}
    71575277
    7158 .navigation .nav-previous .svg-icon {
    7159     top: -2px;
    7160     margin-right: 5px;
    7161 }
    7162 
     5278.navigation .nav-previous .svg-icon,
    71635279.navigation .prev .svg-icon {
    71645280    top: -2px;
    7165     margin-right: 5px;
    7166 }
    7167 
    7168 .navigation .nav-next .svg-icon {
    7169     top: -1px;
    7170     margin-left: 5px;
    7171 }
    7172 
     5281    margin-right: calc(0.25 * var(--global--spacing-unit));
     5282}
     5283
     5284.navigation .nav-next .svg-icon,
    71735285.navigation .next .svg-icon {
    71745286    top: -1px;
    7175     margin-left: 5px;
     5287    margin-left: calc(0.25 * var(--global--spacing-unit));
    71765288}
    71775289
    71785290.post-navigation {
    7179     margin: 30px auto;
     5291    margin: var(--global--spacing-vertical) auto;
    71805292}
    71815293@media only screen and (min-width: 822px) {
    71825294
    71835295    .post-navigation {
    7184         margin: 30px auto;
     5296        margin: var(--global--spacing-vertical) auto;
    71855297    }
    71865298}
    71875299
    71885300.post-navigation .meta-nav {
    7189     line-height: 1.7;
    7190     color: #28303d;
     5301    line-height: var(--global--line-height-body);
     5302    color: var(--global--color-primary);
    71915303}
    71925304
    71935305.post-navigation .post-title {
    71945306    display: inline-block;
    7195     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    7196     font-size: 1.5rem;
    7197     font-weight: 600;
    7198     line-height: 1.3;
     5307    font-family: var(--global--font-primary);
     5308    font-size: var(--global--font-size-lg);
     5309    font-weight: var(--pagination--font-weight-strong);
     5310    line-height: var(--global--line-height-heading);
    71995311}
    72005312@media only screen and (min-width: 822px) {
    72015313
    72025314    .post-navigation .post-title {
    7203         margin: 5px 29px 0;
     5315        margin: 5px calc(24px + (0.25 * var(--global--spacing-unit))) 0;
    72045316    }
    72055317}
    … …  
    72115323}
    72125324
    7213 .post-navigation .nav-next {
    7214     margin-top: 30px;
    7215     margin-bottom: 30px;
    7216 }
    7217 
     5325.post-navigation .nav-next,
    72185326.post-navigation .nav-previous {
    7219     margin-top: 30px;
    7220     margin-bottom: 30px;
     5327    margin-top: var(--global--spacing-vertical);
     5328    margin-bottom: var(--global--spacing-vertical);
    72215329}
    72225330
    … …  
    72315339}
    72325340
    7233 .post-navigation .nav-next:hover .post-title,
    7234 .post-navigation .nav-previous:hover .post-title {
     5341.pagination,
     5342.comments-pagination {
     5343    border-top: 3px solid var(--global--color-border);
     5344    padding-top: var(--global--spacing-vertical);
     5345    margin: var(--global--spacing-vertical) auto;
     5346}
     5347@media only screen and (min-width: 822px) {
     5348
     5349    .pagination,
     5350    .comments-pagination {
     5351        margin: var(--global--spacing-vertical) auto;
     5352    }
     5353}
     5354
     5355.pagination .nav-links,
     5356.comments-pagination .nav-links {
     5357    margin-top: calc(-1 * var(--global--spacing-vertical));
     5358}
     5359
     5360.pagination .nav-links a:hover,
     5361.comments-pagination .nav-links a:hover {
     5362    color: var(--pagination--color-link-hover);
     5363}
     5364
     5365.is-dark-theme .pagination .nav-links a:active,
     5366.is-dark-theme .pagination .nav-links a:hover:active,
     5367.is-dark-theme .pagination .nav-links a:hover:focus,
     5368.is-dark-theme .comments-pagination .nav-links a:active,
     5369.is-dark-theme .comments-pagination .nav-links a:hover:active,
     5370.is-dark-theme .comments-pagination .nav-links a:hover:focus {
     5371    color: var(--global--color-background);
     5372}
     5373
     5374.has-background-white .pagination .nav-links a:active,
     5375.has-background-white .pagination .nav-links a:hover:active,
     5376.has-background-white .pagination .nav-links a:hover:focus,
     5377.has-background-white .comments-pagination .nav-links a:active,
     5378.has-background-white .comments-pagination .nav-links a:hover:active,
     5379.has-background-white .comments-pagination .nav-links a:hover:focus {
     5380    color: var(--global--color-white);
     5381}
     5382
     5383.pagination .nav-links > *,
     5384.comments-pagination .nav-links > * {
     5385    color: var(--pagination--color-text);
     5386    font-family: var(--pagination--font-family);
     5387    font-size: var(--pagination--font-size);
     5388    font-weight: var(--pagination--font-weight);
     5389    margin-top: var(--global--spacing-vertical);
     5390    margin-left: calc(0.66 * var(--global--spacing-unit));
     5391    margin-right: calc(0.66 * var(--global--spacing-unit));
     5392}
     5393
     5394.pagination .nav-links > *.current,
     5395.comments-pagination .nav-links > *.current {
    72355396    text-decoration: underline;
    7236     text-decoration-thickness: 1px;
    7237 }
    7238 
    7239 .pagination {
    7240     border-top: 3px solid #28303d;
    7241     padding-top: 30px;
    7242     margin: 30px auto;
    7243 }
    7244 
    7245 .comments-pagination {
    7246     border-top: 3px solid #28303d;
    7247     padding-top: 30px;
    7248     margin: 30px auto;
    7249 }
    7250 @media only screen and (min-width: 822px) {
    7251 
    7252     .pagination {
    7253         margin: 30px auto;
    7254     }
    7255 
    7256     .comments-pagination {
    7257         margin: 30px auto;
    7258     }
    7259 }
    7260 
    7261 .pagination .nav-links {
    7262     margin-top: -30px;
    7263 }
    7264 
    7265 .comments-pagination .nav-links {
    7266     margin-top: -30px;
    7267 }
    7268 
    7269 .pagination .nav-links a:hover {
    7270     color: #28303d;
    7271 }
    7272 
    7273 .comments-pagination .nav-links a:hover {
    7274     color: #28303d;
    7275 }
    7276 
    7277 .pagination .nav-links > * {
    7278     color: #28303d;
    7279     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    7280     font-size: 1.5rem;
    7281     font-weight: normal;
    7282     margin-top: 30px;
    7283     margin-left: 13px;
    7284     margin-right: 13px;
    7285 }
    7286 
    7287 .comments-pagination .nav-links > * {
    7288     color: #28303d;
    7289     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    7290     font-size: 1.5rem;
    7291     font-weight: normal;
    7292     margin-top: 30px;
    7293     margin-left: 13px;
    7294     margin-right: 13px;
    7295 }
    7296 
    7297 .pagination .nav-links > *.current {
    7298     border-bottom: 1px solid #28303d;
    7299 }
    7300 
    7301 .comments-pagination .nav-links > *.current {
    7302     border-bottom: 1px solid #28303d;
     5397}
     5398
     5399.pagination .nav-links > *:not(.dots):not(.current):hover,
     5400.comments-pagination .nav-links > *:not(.dots):not(.current):hover {
     5401    text-decoration-style: dotted;
    73035402}
    73045403
    … …  
    73525451
    73535452.comments-pagination {
    7354     padding-top: 20px;
    7355     margin: 90px auto;
     5453    padding-top: calc(0.66 * var(--global--spacing-vertical));
     5454    margin: calc(3 * var(--global--spacing-vertical)) auto;
    73565455}
    73575456@media only screen and (min-width: 822px) {
    73585457
    73595458    .comments-pagination {
    7360         margin: 90px auto 120px auto;
     5459        margin: calc(3 * var(--global--spacing-vertical)) auto calc(4 * var(--global--spacing-vertical)) auto;
    73615460    }
    73625461}
    73635462
    73645463.comments-pagination .nav-links > * {
    7365     font-size: 1.25rem;
     5464    font-size: var(--global--font-size-md);
    73665465}
    73675466
    73685467.widget-area {
    7369     margin-top: 180px;
    7370     padding-bottom: 10px;
    7371     color: #28303d;
    7372     font-size: 1.125rem;
    7373     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     5468    margin-top: calc(6 * var(--global--spacing-vertical));
     5469    padding-bottom: calc(var(--global--spacing-vertical) / 3);
     5470    color: var(--footer--color-text);
     5471    font-size: var(--footer--font-size);
     5472    font-family: var(--footer--font-family);
    73745473}
    73755474@media only screen and (min-width: 652px) {
    … …  
    73785477        display: grid;
    73795478        grid-template-columns: repeat(2, 1fr);
    7380         column-gap: 50px;
     5479        column-gap: calc(2 * var(--global--spacing-horizontal));
    73815480    }
    73825481}
    … …  
    73855484    .widget-area {
    73865485        grid-template-columns: repeat(3, 1fr);
     5486    }
     5487}
     5488@media only screen and (max-width: 481px) {
     5489
     5490    .widget-area {
     5491        margin-top: calc(3 * var(--global--spacing-vertical));
    73875492    }
    73885493}
    … …  
    73945499
    73955500.widget-area ul li {
    7396     line-height: 1.9;
    7397 }
    7398 
    7399 .widget-area ul.sub-menu {
    7400     margin-left: 13px;
    7401 }
    7402 
     5501    line-height: var(--widget--line-height-list);
     5502}
     5503
     5504.widget-area ul.sub-menu,
    74035505.widget-area ul.children {
    7404     margin-left: 13px;
     5506    margin-left: var(--widget--spacing-menu);
    74055507}
    74065508
    … …  
    74105512
    74115513.widget-area a {
    7412     color: #28303d;
     5514    color: var(--footer--color-link);
    74135515    text-decoration: underline;
    74145516    text-decoration-style: solid;
    … …  
    74165518}
    74175519
    7418 .widget-area a:link {
    7419     color: #28303d;
    7420 }
    7421 
    7422 .widget-area a:visited {
    7423     color: #28303d;
    7424 }
    7425 
     5520.widget-area a:link,
     5521.widget-area a:visited,
    74265522.widget-area a:active {
    7427     color: #28303d;
     5523    color: var(--footer--color-link);
    74285524}
    74295525
    74305526.widget-area a:hover {
    7431     color: #28303d;
     5527    color: var(--footer--color-link-hover);
    74325528    text-decoration-style: dotted;
    74335529}
    74345530
    74355531.widget-area .wp-block-social-links.alignright {
    7436     margin-top: 30px;
     5532    margin-top: var(--global--spacing-vertical);
    74375533    justify-content: flex-end;
    74385534}
    74395535
    74405536.widget-area .wp-block-social-links.alignleft {
    7441     margin-top: 30px;
     5537    margin-top: var(--global--spacing-vertical);
    74425538}
    74435539
    … …  
    74495545
    74505546.widget-title {
    7451     font-size: 1.125rem;
    7452     font-weight: 700;
    7453     line-height: 1.4;
     5547    font-size: var(--global--font-size-sm);
     5548    font-weight: var(--widget--font-weight-title);
     5549    line-height: var(--widget--line-height-title);
    74545550}
    74555551
    … …  
    74585554    flex-wrap: wrap;
    74595555    margin: auto;
    7460     max-width: calc(100vw - 30px);
    7461 }
    7462 
    7463 @media only screen and (min-width: 482px) {
    7464 
    7465     .search-form {
    7466         max-width: min(calc(100vw - 100px), 610px);
    7467     }
    7468 }
    7469 
    7470 @media only screen and (min-width: 822px) {
    7471 
    7472     .search-form {
    7473         max-width: min(calc(100vw - 200px), 610px);
    7474     }
     5556    max-width: var(--responsive--aligndefault-width);
    74755557}
    74765558
    … …  
    74785560    width: 100%;
    74795561    margin-bottom: 0;
    7480     font-weight: 500;
     5562    font-weight: var(--form--label-weight);
    74815563}
    74825564
    … …  
    74845566    flex-grow: 1;
    74855567    max-width: inherit;
    7486     margin-top: 10px;
    7487     margin-right: 17px;
     5568    margin-top: calc(var(--global--spacing-vertical) / 3);
     5569    margin-right: calc(0.66 * var(--global--spacing-horizontal));
    74885570}
    74895571
    74905572.search-form .search-submit {
    7491     margin-top: 10px;
     5573    margin-top: calc(var(--global--spacing-vertical) / 3);
    74925574    margin-left: 10px;
    74935575}
    74945576
    74955577.widget_search > .search-form .search-field {
    7496     margin-right: -3px;
     5578    margin-right: calc(-1 * var(--button--border-width));
    74975579    -webkit-appearance: none;
    7498     margin-bottom: 15px;
     5580    margin-bottom: calc(0.5 * var(--global--spacing-vertical));
    74995581}
    75005582
    … …  
    75025584    margin-left: 0;
    75035585    background-color: transparent;
    7504     color: #39414d;
    7505     margin-bottom: 15px;
     5586    color: var(--button--color-text-hover);
     5587    margin-bottom: calc(0.5 * var(--global--spacing-vertical));
    75065588}
    75075589
    75085590.widget_search > .search-form .search-submit:hover {
    7509     background-color: #39414d;
    7510     color: #d1e4dd;
     5591    background-color: var(--button--color-background);
     5592    color: var(--button--color-text);
    75115593}
    75125594
    … …  
    75665648
    75675649.has-black-color[class] {
    7568     color: #000;
     5650    color: var(--global--color-black);
    75695651}
    75705652
    75715653.has-gray-color[class] {
    7572     color: #39414d;
     5654    color: var(--global--color-gray);
    75735655}
    75745656
    75755657.has-dark-gray-color[class] {
    7576     color: #28303d;
     5658    color: var(--global--color-dark-gray);
    75775659}
    75785660
    75795661.has-green-color[class] {
    7580     color: #d1e4dd;
     5662    color: var(--global--color-green);
    75815663}
    75825664
    75835665.has-blue-color[class] {
    7584     color: #d1dfe4;
     5666    color: var(--global--color-blue);
    75855667}
    75865668
    75875669.has-purple-color[class] {
    7588     color: #d1d1e4;
     5670    color: var(--global--color-purple);
    75895671}
    75905672
    75915673.has-red-color[class] {
    7592     color: #e4d1d1;
     5674    color: var(--global--color-red);
    75935675}
    75945676
    75955677.has-orange-color[class] {
    7596     color: #e4dad1;
     5678    color: var(--global--color-orange);
    75975679}
    75985680
    75995681.has-yellow-color[class] {
    7600     color: #eeeadd;
     5682    color: var(--global--color-yellow);
    76015683}
    76025684
    76035685.has-white-color[class] {
    7604     color: #fff;
    7605 }
    7606 
    7607 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     5686    color: var(--global--color-white);
     5687}
     5688
     5689.has-background a,
    76085690.has-background p,
    76095691.has-background h1,
    … …  
    76175699
    76185700.has-black-background-color[class] {
    7619     background-color: #000;
     5701    background-color: var(--global--color-black);
    76205702}
    76215703
    76225704.has-gray-background-color[class] {
    7623     background-color: #39414d;
     5705    background-color: var(--global--color-gray);
    76245706}
    76255707
    76265708.has-dark-gray-background-color[class] {
    7627     background-color: #28303d;
     5709    background-color: var(--global--color-dark-gray);
    76285710}
    76295711
    76305712.has-green-background-color[class] {
    7631     background-color: #d1e4dd;
     5713    background-color: var(--global--color-green);
    76325714}
    76335715
    76345716.has-blue-background-color[class] {
    7635     background-color: #d1dfe4;
     5717    background-color: var(--global--color-blue);
    76365718}
    76375719
    76385720.has-purple-background-color[class] {
    7639     background-color: #d1d1e4;
     5721    background-color: var(--global--color-purple);
    76405722}
    76415723
    76425724.has-red-background-color[class] {
    7643     background-color: #e4d1d1;
     5725    background-color: var(--global--color-red);
    76445726}
    76455727
    76465728.has-orange-background-color[class] {
    7647     background-color: #e4dad1;
     5729    background-color: var(--global--color-orange);
    76485730}
    76495731
    76505732.has-yellow-background-color[class] {
    7651     background-color: #eeeadd;
     5733    background-color: var(--global--color-yellow);
    76525734}
    76535735
    76545736.has-white-background-color[class] {
    7655     background-color: #fff;
    7656 }
    7657 
    7658 :not(.has-text-color).has-black-background-color[class] {
    7659     color: #fff;
    7660 }
    7661 
    7662 :not(.has-text-color).has-gray-background-color[class] {
    7663     color: #fff;
    7664 }
    7665 
     5737    background-color: var(--global--color-white);
     5738}
     5739
     5740:not(.has-text-color).has-black-background-color[class],
     5741:not(.has-text-color).has-gray-background-color[class],
    76665742:not(.has-text-color).has-dark-gray-background-color[class] {
    7667     color: #fff;
    7668 }
    7669 
    7670 :not(.has-text-color).has-green-background-color[class] {
    7671     color: #28303d;
    7672 }
    7673 
    7674 :not(.has-text-color).has-blue-background-color[class] {
    7675     color: #28303d;
    7676 }
    7677 
    7678 :not(.has-text-color).has-purple-background-color[class] {
    7679     color: #28303d;
    7680 }
    7681 
    7682 :not(.has-text-color).has-red-background-color[class] {
    7683     color: #28303d;
    7684 }
    7685 
    7686 :not(.has-text-color).has-orange-background-color[class] {
    7687     color: #28303d;
    7688 }
    7689 
    7690 :not(.has-text-color).has-yellow-background-color[class] {
    7691     color: #28303d;
    7692 }
    7693 
     5743    color: var(--global--color-white);
     5744}
     5745
     5746:not(.has-text-color).has-green-background-color[class],
     5747:not(.has-text-color).has-blue-background-color[class],
     5748:not(.has-text-color).has-purple-background-color[class],
     5749:not(.has-text-color).has-red-background-color[class],
     5750:not(.has-text-color).has-orange-background-color[class],
     5751:not(.has-text-color).has-yellow-background-color[class],
    76945752:not(.has-text-color).has-white-background-color[class] {
    7695     color: #28303d;
     5753    color: var(--global--color-dark-gray);
    76965754}
    76975755
    76985756.has-purple-to-yellow-gradient-background {
    7699     background: linear-gradient(160deg, #d1d1e4, #eeeadd);
     5757    background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow));
    77005758}
    77015759
    77025760.has-yellow-to-purple-gradient-background {
    7703     background: linear-gradient(160deg, #eeeadd, #d1d1e4);
     5761    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple));
    77045762}
    77055763
    77065764.has-green-to-yellow-gradient-background {
    7707     background: linear-gradient(160deg, #d1e4dd, #eeeadd);
     5765    background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow));
    77085766}
    77095767
    77105768.has-yellow-to-green-gradient-background {
    7711     background: linear-gradient(160deg, #eeeadd, #d1e4dd);
     5769    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green));
    77125770}
    77135771
    77145772.has-red-to-yellow-gradient-background {
    7715     background: linear-gradient(160deg, #e4d1d1, #eeeadd);
     5773    background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow));
    77165774}
    77175775
    77185776.has-yellow-to-red-gradient-background {
    7719     background: linear-gradient(160deg, #eeeadd, #e4d1d1);
     5777    background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red));
    77205778}
    77215779
    77225780.has-purple-to-red-gradient-background {
    7723     background: linear-gradient(160deg, #d1d1e4, #e4d1d1);
     5781    background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red));
    77245782}
    77255783
    77265784.has-red-to-purple-gradient-background {
    7727     background: linear-gradient(160deg, #e4d1d1, #d1d1e4);
    7728 }
    7729 
    7730 header * {
    7731     max-width: unset;
    7732 }
    7733 
    7734 main * {
    7735     max-width: unset;
    7736 }
    7737 
     5785    background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple));
     5786}
     5787
     5788header *,
     5789main *,
    77385790footer * {
    7739     max-width: unset;
     5791    max-width: var(--global--spacing-measure);
    77405792}
    77415793

  • trunk/src/wp-content/themes/twentytwentyone/assets/css/style-dark-mode-rtl.css

    r49633 r49726  
    1414    }
    1515
    16     .is-dark-theme.is-dark-theme .site a:focus,
    17     .is-dark-theme.is-dark-theme .site a:focus .meta-nav {
     16    .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     17    .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    1818        background: #000;
    1919        color: #fff;

  • trunk/src/wp-content/themes/twentytwentyone/assets/css/style-dark-mode.css

    r49633 r49726  
    1414    }
    1515
    16     .is-dark-theme.is-dark-theme .site a:focus,
    17     .is-dark-theme.is-dark-theme .site a:focus .meta-nav {
     16    .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     17    .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    1818        background: #000;
    1919        color: #fff;

  • trunk/src/wp-content/themes/twentytwentyone/assets/css/style-editor.css

    r49574 r49726  
    375375    font-size: var(--quote--font-size);
    376376    line-height: var(--quote--line-height);
     377    position: absolute;
     378    left: calc(-0.5 * var(--global--spacing-horizontal));
    377379}
    378380
    … …  
    417419figcaption,
    418420.wp-caption,
    419 .wp-caption-text {
     421.wp-caption-text,
     422.wp-block-embed figcaption {
    420423    color: currentColor;
    421424    font-size: var(--global--font-size-xs);
    … …  
    431434.alignright .wp-caption,
    432435.alignleft .wp-caption-text,
    433 .alignright .wp-caption-text {
     436.alignright .wp-caption-text,
     437.alignleft .wp-block-embed figcaption,
     438.alignright .wp-block-embed figcaption {
    434439    margin-bottom: 0;
    435440}
    … …  
    475480}
    476481
    477 .site a:focus {
     482.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    478483
    479484    /* Only visible in Windows High Contrast mode */
    480485    outline: 2px solid transparent;
     486    text-decoration: underline 1px dotted currentColor;
     487    text-decoration-skip-ink: none;
    481488    background: rgba(255, 255, 255, 0.9);
    482489}
    483490
    484 .is-dark-theme .site a:focus,
    485 .is-dark-theme .site a:focus .meta-nav {
     491.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     492.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    486493    color: var(--wp--style--color--link, var(--global--color-background));
    487494}
    488495
    489 .has-background-white .site a:focus {
     496.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    490497    background: rgba(0, 0, 0, 0.9);
    491498    color: var(--wp--style--color--link, var(--global--color-white));
    492499}
    493500
    494 .has-background-white .site a:focus .meta-nav {
     501.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    495502    color: var(--wp--style--color--link, var(--global--color-white));
    496503}
    497504
    498 .site a:focus.skip-link {
     505.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
    499506
    500507    /* Only visible in Windows High Contrast mode */
    … …  
    503510}
    504511
    505 .site a:focus.skip-link:focus {
     512.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
    506513    color: #21759b;
    507514    background-color: #f1f1f1;
    508515}
    509516
    510 .site a:focus img {
     517.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
    511518    outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
    512519}
    513520
    514 .has-background:not(.has-background-background-color) .has-link-color a,
    515 .has-background:not(.has-background-background-color).has-link-color a {
     521.has-background .has-link-color a,
     522.has-background.has-link-color a {
    516523    color: var(--wp--style--color--link, var(--global--color-primary));
    517524}
    … …  
    531538}
    532539
    533 .wp-block-button__link:before,
    534 .wp-block-button__link:after {
    535     content: "";
    536     display: block;
    537     height: 0;
    538     width: 0;
    539 }
    540 
    541 .wp-block-button__link:before {
    542     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    543 }
    544 
    545 .wp-block-button__link:after {
    546     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    547 }
    548 
    549540.wp-block-button__link:focus {
    550541    background: transparent;
    … …  
    688679[data-align=full] .wp-block-cover-image {
    689680    margin-top: 0;
     681    margin-bottom: 0;
     682}
     683
     684.wp-block-cover > .wp-block-cover__inner-container > *:first-child,
     685.wp-block-cover-image > .wp-block-cover__inner-container > *:first-child {
     686    margin-top: 0;
     687}
     688
     689.wp-block-cover > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender),
     690.wp-block-cover-image > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender) {
     691    margin-bottom: 0;
     692}
     693
     694.wp-block-cover.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     695.wp-block-cover.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     696.wp-block-cover-image.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
     697.wp-block-cover-image.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2) {
    690698    margin-bottom: 0;
    691699}
    … …  
    772780.wp-block-columns .wp-block-column {
    773781    max-width: inherit;
     782}
     783
     784.wp-block-columns > .wp-block-column > *:first-child {
     785    margin-top: 0;
     786}
     787
     788.wp-block-columns > .wp-block-column > *:last-child:not(.block-list-appender) {
     789    margin-bottom: 0;
     790}
     791
     792.wp-block-columns.has-child-selected > .wp-block-column > *:nth-last-child(2),
     793.wp-block-columns.is-selected > .wp-block-column > *:nth-last-child(2) {
     794    margin-bottom: 0;
    774795}
    775796@media only screen and (min-width: 652px) {
    … …  
    805826}
    806827
    807 .wp-block[data-align=full] .wp-block-columns p:not(.has-background),
    808 .wp-block[data-align=full] .wp-block-columns h1:not(.has-background),
    809 .wp-block[data-align=full] .wp-block-columns h2:not(.has-background),
    810 .wp-block[data-align=full] .wp-block-columns h3:not(.has-background),
    811 .wp-block[data-align=full] .wp-block-columns h4:not(.has-background),
    812 .wp-block[data-align=full] .wp-block-columns h5:not(.has-background),
    813 .wp-block[data-align=full] .wp-block-columns h6:not(.has-background) {
     828.wp-block[data-align=full] > .wp-block-columns p:not(.has-background),
     829.wp-block[data-align=full] > .wp-block-columns h1:not(.has-background),
     830.wp-block[data-align=full] > .wp-block-columns h2:not(.has-background),
     831.wp-block[data-align=full] > .wp-block-columns h3:not(.has-background),
     832.wp-block[data-align=full] > .wp-block-columns h4:not(.has-background),
     833.wp-block[data-align=full] > .wp-block-columns h5:not(.has-background),
     834.wp-block[data-align=full] > .wp-block-columns h6:not(.has-background) {
    814835    padding-left: var(--global--spacing-unit);
    815836    padding-right: var(--global--spacing-unit);
    … …  
    842863}
    843864
    844 .wp-block-file .wp-block-file__button:before,
    845 .wp-block-file .wp-block-file__button:after {
    846     content: "";
    847     display: block;
    848     height: 0;
    849     width: 0;
    850 }
    851 
    852 .wp-block-file .wp-block-file__button:before {
    853     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    854 }
    855 
    856 .wp-block-file .wp-block-file__button:after {
    857     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    858 }
    859 
    860865.wp-block-file .wp-block-file__button:focus {
    861866    background: transparent;
    … …  
    924929}
    925930
    926 .wp-block-group .wp-block-group__inner-container > *:last-child {
     931.wp-block-group > .wp-block-group__inner-container > *:first-child {
     932    margin-top: 0;
     933}
     934
     935.wp-block-group > .wp-block-group__inner-container > *:last-child:not(.block-list-appender) {
     936    margin-bottom: 0;
     937}
     938
     939.wp-block-group.has-child-selected > .wp-block-group__inner-container > *:nth-last-child(2),
     940.wp-block-group.is-selected > .wp-block-group__inner-container > *:nth-last-child(2) {
    927941    margin-bottom: 0;
    928942}
    … …  
    13051319}
    13061320
     1321.wp-block-media-text > .wp-block-media-text__content > *:first-child {
     1322    margin-top: 0;
     1323}
     1324
     1325.wp-block-media-text > .wp-block-media-text__content > *:last-child:not(.block-list-appender) {
     1326    margin-bottom: 0;
     1327}
     1328
     1329.wp-block-media-text.has-child-selected > .wp-block-media-text__content > *:nth-last-child(2),
     1330.wp-block-media-text.is-selected > .wp-block-media-text__content > *:nth-last-child(2) {
     1331    margin-bottom: 0;
     1332}
     1333
    13071334.wp-block-media-text .wp-block-media-text__content {
    13081335    padding: var(--global--spacing-horizontal);
    1309 }
    1310 
    1311 .wp-block-media-text .wp-block-media-text__content [data-block]:first-child {
    1312     margin-top: 0;
    1313 }
    1314 
    1315 .wp-block-media-text .wp-block-media-text__content [data-block]:last-child {
    1316     margin-bottom: 0;
    13171336}
    13181337
    … …  
    13781397    content: "“";
    13791398    display: block;
     1399    position: relative;
     1400    left: 0;
    13801401    font-size: 3rem;
    13811402    font-weight: 500;
    … …  
    14541475}
    14551476
     1477.wp-block[data-align=left] .wp-block-pullquote.is-style-solid-color,
     1478.wp-block[data-align=right] .wp-block-pullquote.is-style-solid-color {
     1479    padding: var(--global--spacing-unit);
     1480}
     1481
    14561482.wp-block-quote {
    14571483    position: relative;
    … …  
    14761502    font-size: var(--quote--font-size);
    14771503    line-height: var(--quote--line-height);
    1478     position: absolute;
    14791504    left: calc(-0.5 * var(--global--spacing-horizontal));
    14801505}
    … …  
    14861511}
    14871512
    1488 .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    1489 [class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    1490 [style*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
     1513.has-background .wp-block-quote .wp-block-quote__citation,
     1514[class*=background-color] .wp-block-quote .wp-block-quote__citation,
     1515[style*=background-color] .wp-block-quote .wp-block-quote__citation,
    14911516.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation {
    14921517    color: currentColor;
    … …  
    15001525
    15011526.wp-block-quote.has-text-align-right:before {
     1527    display: none;
     1528}
     1529
     1530.wp-block-quote.has-text-align-right p:before {
    15021531    content: "”";
    1503     left: initial;
    1504     right: calc(-0.5 * var(--global--spacing-horizontal));
     1532    font-size: var(--quote--font-size);
     1533    font-weight: normal;
     1534    line-height: var(--quote--line-height);
     1535    margin-right: 5px;
    15051536}
    15061537
    … …  
    15381569.wp-block-quote.is-large.has-text-align-right:before,
    15391570.wp-block-quote.is-style-large.has-text-align-right:before {
    1540     left: initial;
    1541     right: calc(-1 * var(--global--spacing-horizontal));
     1571    display: none;
     1572}
     1573
     1574.wp-block-quote.is-large.has-text-align-right p:before,
     1575.wp-block-quote.is-style-large.has-text-align-right p:before {
     1576    content: "”";
     1577    font-size: var(--quote--font-size-large);
     1578    font-weight: normal;
     1579    line-height: var(--quote--line-height-large);
     1580    margin-right: 10px;
    15421581}
    15431582@media only screen and (max-width: 481px) {
    … …  
    17581797}
    17591798
    1760 .wp-block-search .wp-block-search__button:before,
    1761 .wp-block-search .wp-block-search__button:after {
    1762     content: "";
    1763     display: block;
    1764     height: 0;
    1765     width: 0;
    1766 }
    1767 
    1768 .wp-block-search .wp-block-search__button:before {
    1769     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    1770 }
    1771 
    1772 .wp-block-search .wp-block-search__button:after {
    1773     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    1774 }
    1775 
    17761799.wp-block-search .wp-block-search__button:focus {
    17771800    background: transparent;
    … …  
    19842007}
    19852008
    1986 .has-background:not(.has-background-background-color) .wp-block-separator,
    1987 [class*=background-color]:not(.has-background-background-color) .wp-block-separator,
    1988 [style*=background-color]:not(.has-background-background-color) .wp-block-separator,
     2009.has-background .wp-block-separator,
     2010[class*=background-color] .wp-block-separator,
     2011[style*=background-color] .wp-block-separator,
    19892012.wp-block-cover[style*=background-image] .wp-block-separator,
    1990 .has-background:not(.has-background-background-color) hr,
    1991 [class*=background-color]:not(.has-background-background-color) hr,
    1992 [style*=background-color]:not(.has-background-background-color) hr,
     2013.has-background hr,
     2014[class*=background-color] hr,
     2015[style*=background-color] hr,
    19932016.wp-block-cover[style*=background-image] hr {
    19942017    border-color: currentColor;
    … …  
    21792202}
    21802203
    2181 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     2204.has-background a,
    21822205.has-background p,
    21832206.has-background h1,
    … …  
    22102233}
    22112234
    2212 /**
    2213  * Spacing Overrides
    2214  */
    22152235[data-block] {
    22162236    margin-top: var(--global--spacing-vertical);
    … …  
    22182238}
    22192239
    2220 [data-block] [data-block]:first-child {
    2221     margin-top: 0;
    2222 }
    2223 
    2224 [data-block] [data-block]:nth-last-child(2) {
    2225     margin-bottom: 0;
    2226 }
    2227 
    2228 /* Block Alignments */
    22292240.wp-block {
    22302241    max-width: var(--responsive--aligndefault-width);
    … …  
    22752286}
    22762287
     2288.wp-block-freeform.block-library-rich-text__tinymce blockquote {
     2289    border: none;
     2290}
     2291
     2292.wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
     2293    left: 5px;
     2294}
     2295
    22772296html {
    22782297    font-family: var(--global--font-secondary);
    … …  
    23042323}
    23052324
    2306 .has-background:not(.has-background-background-color) .has-link-color a,
    2307 .has-background:not(.has-background-background-color).has-link-color a {
     2325.has-background .has-link-color a,
     2326.has-background.has-link-color a {
    23082327    color: var(--wp--style--color--link, var(--global--color-primary));
    23092328}
    … …  
    23542373}
    23552374
    2356 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     2375.has-background a,
    23572376.has-background p,
    23582377.has-background h1,

  • trunk/src/wp-content/themes/twentytwentyone/assets/js/customize-preview.js

    r49574 r49726  
    1616                document.body.classList.add( 'is-dark-theme' );
    1717                document.documentElement.classList.add( 'is-dark-theme' );
     18                document.body.classList.remove( 'is-light-theme' );
     19                document.documentElement.classList.remove( 'is-light-theme' );
    1820                document.documentElement.classList.remove( 'respect-color-scheme-preference' );
    1921            } else {
    2022                document.body.classList.remove( 'is-dark-theme' );
    2123                document.documentElement.classList.remove( 'is-dark-theme' );
     24                document.body.classList.add( 'is-light-theme' );
     25                document.documentElement.classList.add( 'is-light-theme' );
    2226                if ( wp.customize( 'respect_user_color_preference' ).get() ) {
    2327                    document.documentElement.classList.add( 'respect-color-scheme-preference' );
    … …  
    2630
    2731            // Toggle the white background class.
    28             if ( '#ffffff' === to.toLowerCase() ) {
     32            if ( 225 <= lum ) {
    2933                document.body.classList.add( 'has-background-white' );
    3034            } else {

  • trunk/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js

    r49633 r49726  
    4242function twentytwentyoneSubmenuPosition( li ) {
    4343    var subMenu = li.querySelector( 'ul.sub-menu' ),
    44         rect = subMenu.getBoundingClientRect(),
    45         right = Math.round( rect.right ),
    46         left = Math.round( rect.left ),
    47         windowWidth = Math.round( window.innerWidth );
     44        rect,
     45        right,
     46        left,
     47        windowWidth;
     48
     49    if ( ! subMenu ) {
     50        return;
     51    }
     52
     53    rect = subMenu.getBoundingClientRect();
     54    right = Math.round( rect.right );
     55    left = Math.round( rect.left );
     56    windowWidth = Math.round( window.innerWidth );
    4857
    4958    if ( right > windowWidth ) {

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/02-tools/mixins.scss

    r49574 r49726  
    1818}
    1919
    20 // Crop Text Boundry
    21 // - Sets a fixed-width on content within alignwide and alignfull blocks
    22 @mixin crop-text($inset-line-height: 1) {
    23 
    24     line-height: $inset-line-height;
    25     $offset-top: calc(.5em * #{$inset-line-height} + -.38);
    26     $offset-bottom: calc(.5em * #{$inset-line-height} + -.39);
    27 
    28     &:before,
    29     &:after {
    30         content: "";
    31         display: block;
    32         height: 0;
    33         width: 0;
    34     }
    35 
    36     &:before {
    37         margin-bottom: -($offset-top);
    38     }
    39 
    40     &:after {
    41         margin-top: -($offset-bottom);
    42     }
    43 }
    44 
    4520// Button style
    4621// - Applies button styles to blocks and elements that share them.
    4722@mixin button-style() {
    48     @include crop-text(var(--button--line-height));
     23    line-height: var(--button--line-height);
    4924    color: var(--button--color-text);
    5025    cursor: pointer;
    … …  
    7853    }
    7954}
     55
     56@mixin innerblock-margin-clear($container) {
     57
     58    // Clear the top margin for the first-child.
     59    > #{$container} > *:first-child {
     60        margin-top: 0;
     61    }
     62
     63    // Last child that is not the appender.
     64    > #{$container} > *:last-child:not(.block-list-appender) {
     65        margin-bottom: 0;
     66    }
     67
     68    // When selected, the last item becomes the second last because of the appender.
     69    &.has-child-selected > #{$container} > *:nth-last-child(2),
     70    &.is-selected > #{$container} > *:nth-last-child(2) {
     71        margin-bottom: 0;
     72    }
     73}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/04-elements/blockquote.scss

    r49574 r49726  
    6060        font-size: var(--quote--font-size);
    6161        line-height: var(--quote--line-height);
     62        position: absolute;
     63        left: calc(-0.5 * var(--global--spacing-horizontal));
    6264    }
    6365

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/04-elements/forms.scss

    r49574 r49726  
    3535        background: var(--global--color-white-90);
    3636    }
    37 
    3837}
    3938
    … …  
    217216        -webkit-appearance: none;
    218217        border: 3px solid var(--form--color-ranged);
    219         height: 25px;
    220         width: 25px;
     218        height: 44px;
     219        width: 44px;
    221220        border-radius: 50%;
    222221        background: var(--global--color-background);
    … …  
    226225    input[type="range"]::-moz-range-thumb {
    227226        border: 3px solid var(--form--color-ranged);
    228         height: 25px;
    229         width: 25px;
     227        height: 44px;
     228        width: 44px;
    230229        border-radius: 50%;
    231230        background: var(--global--color-background);
    232231        cursor: pointer;
     232        box-sizing: border-box;
    233233    }
    234234}
    … …  
    257257input[type="range"]::-ms-thumb {
    258258    border: 3px solid var(--form--color-ranged);
    259     height: 25px;
    260     width: 25px;
     259    height: 44px;
     260    width: 44px;
    261261    border-radius: 50%;
    262262    background: var(--global--color-background);

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/04-elements/links.scss

    r49574 r49726  
    1616}
    1717
    18 .site a:focus {
     18.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    1919
    2020    /* Only visible in Windows High Contrast mode */
    2121    outline: 2px solid transparent;
    2222
     23    text-decoration: underline 1px dotted currentColor;
     24    text-decoration-skip-ink: none;
    2325    background: rgba(255, 255, 255, .9);
    2426
    … …  
    5860// Enforce the custom link color even if a custom background color has been set.
    5961// The extra specificity here is required to override the background color styles.
    60 .has-background:not(.has-background-background-color) {
     62.has-background {
    6163    // Target both current level and nested block.
    6264    .has-link-color a,

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/04-elements/media.scss

    r49574 r49726  
    1818}
    1919
    20 
    2120/* Media captions */
    2221figcaption,
    2322.wp-caption,
    24 .wp-caption-text {
     23.wp-caption-text,
     24.wp-block-embed figcaption {
    2525    color: currentColor;
    2626    font-size: var(--global--font-size-xs);

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/columns/_editor.scss

    r49574 r49726  
    1010        max-width: inherit;
    1111    }
     12
     13    @include innerblock-margin-clear(".wp-block-column");
    1214
    1315    &.is-style-twentytwentyone-columns-overlap {
    … …  
    5153    }
    5254
    53     .wp-block[data-align="full"] & {
     55    .wp-block[data-align="full"] > & {
    5456
    5557        p:not(.has-background),

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/cover/_editor.scss

    r49574 r49726  
    1515        margin-bottom: 0;
    1616    }
     17
     18    @include innerblock-margin-clear(".wp-block-cover__inner-container");
    1719
    1820    .wp-block-cover__inner-container,

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/cover/_style.scss

    r49574 r49726  
    1919    .wp-block-cover-image-text,
    2020    .wp-block-cover-text {
    21         color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss
     21        color: currentColor; // Uses text color specified with background-color options in 07-utilities\color-palette.scss
    2222        margin-top: var(--global--spacing-vertical);
    2323        margin-bottom: var(--global--spacing-vertical);
    2424
    25         a {
     25        a:not(.wp-block-button__link):not(.wp-block-file__button) {
    2626            color: currentColor;
    2727        }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/group/_editor.scss

    r49574 r49726  
    3737    }
    3838
    39     .wp-block-group__inner-container > *:last-child {
    40         margin-bottom: 0;
    41     }
     39    @include innerblock-margin-clear(".wp-block-group__inner-container");
    4240}
    4341

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/media-text/_editor.scss

    r49574 r49726  
    66    }
    77
     8    @include innerblock-margin-clear(".wp-block-media-text__content");
     9
    810    .wp-block-media-text__content {
    911        padding: var(--global--spacing-horizontal);
    10 
    11         [data-block]:first-child {
    12             margin-top: 0;
    13         }
    14 
    15         [data-block]:last-child {
    16             margin-bottom: 0;
    17         }
    1812    }
    1913

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/pullquote/_editor.scss

    r49574 r49726  
    1313        content: "\201C";
    1414        display: block;
     15        position: relative; // Override the absolute position.
     16        left: 0;
    1517        font-size: 3rem;
    1618        font-weight: 500;
    … …  
    9597    }
    9698}
     99
     100.wp-block[data-align="left"],
     101.wp-block[data-align="right"] {
     102
     103    .wp-block-pullquote.is-style-solid-color {
     104        padding: var(--global--spacing-unit);
     105    }
     106}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/pullquote/_style.scss

    r49574 r49726  
    55    border-bottom-style: solid;
    66    border-top-style: solid;
     7    color: currentColor;
     8    border-color: currentColor;
    79    position: relative;
    810
    … …  
    1113        content: "\201C";
    1214        display: block;
     15        position: relative; // Override the absolute position.
     16        left: 0;
    1317        font-size: 3rem;
    1418        font-weight: 500;
    … …  
    4751    }
    4852
    49     &.alignleft {
     53    &.alignleft:not(.is-style-solid-color) {
    5054
    5155        blockquote:before,
    … …  
    5862    &.alignwide blockquote {
    5963        max-width: var(--responsive--alignwide-width);
    60 
    6164    }
    6265
    … …  
    7376        border-color: var(--pullquote--border-color);
    7477
    75         @media ( min-width: 600px ) {
     78        @media (min-width: 600px) {
    7679            padding: calc(5 * var(--global--spacing-unit));
    7780        }
    … …  
    8285
    8386        blockquote {
     87            margin: 0;
    8488            max-width: inherit;
    8589
    … …  
    9498            color: currentColor;
    9599        }
     100
     101        &.alignleft,
     102        &.alignright {
     103            padding: var(--global--spacing-unit);
     104
     105            blockquote {
     106                max-width: initial;
     107            }
     108        }
    96109    }
    97110}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_editor.scss

    r49574 r49726  
    2020        font-size: var(--quote--font-size);
    2121        line-height: var(--quote--line-height);
    22         position: absolute;
    2322        left: calc(-0.5 * var(--global--spacing-horizontal));
    2423    }
    … …  
    2928        font-style: var(--quote--font-style-cite);
    3029
    31         .has-background:not(.has-background-background-color) &,
    32         [class*="background-color"]:not(.has-background-background-color) &,
    33         [style*="background-color"]:not(.has-background-background-color) &,
     30        .has-background &,
     31        [class*="background-color"] &,
     32        [style*="background-color"] &,
    3433        .wp-block-cover[style*="background-image"] & {
    3534            color: currentColor;
    … …  
    4241        border-right: none;
    4342
     43        // Hide the left aligned quote.
    4444        &:before {
     45            display: none;
     46        }
     47
     48        // Align the quote left of the text.
     49        p:before {
    4550            content: "\201D";
    46             left: initial;
    47             right: calc(-0.5 * var(--global--spacing-horizontal));
     51            font-size: var(--quote--font-size);
     52            font-weight: normal;
     53            line-height: var(--quote--line-height);
     54            margin-right: 5px;
    4855        }
    4956    }
    … …  
    7986        &.has-text-align-right {
    8087
     88            // Hide the left aligned quote.
    8189            &:before {
    82                 left: initial;
    83                 right: calc(-1 * var(--global--spacing-horizontal));
     90                display: none;
     91            }
     92
     93            // Align the quote left of the text.
     94            p:before {
     95                content: "\201D";
     96                font-size: var(--quote--font-size-large);
     97                font-weight: normal;
     98                line-height: var(--quote--line-height-large);
     99                margin-right: 10px;
    84100            }
    85101        }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_style.scss

    r49574 r49726  
    11.wp-block-quote {
     2    border-left: none;
     3
     4    &:before {
     5        content: "\201C";
     6        font-size: var(--quote--font-size);
     7        line-height: var(--quote--line-height);
     8        left: 8px;
     9    }
    210
    311    .wp-block-quote__citation,
    … …  
    513    footer {
    614
    7         .has-background:not(.has-background-background-color) &,
    8         [class*="background-color"]:not(.has-background-background-color) &,
     15        .has-background &,
     16        [class*="background-color"] &,
    917        [style*="background-color"] &,
    1018        .wp-block-cover[style*="background-image"] & {
    … …  
    2129        border-right: none;
    2230
     31        // Hide the left aligned quote.
    2332        &:before {
     33            display: none;
     34        }
     35
     36        // Align the quote left of the text.
     37        p:before {
    2438            content: "\201D";
    25             left: initial;
    26             right: calc(-0.5 * var(--global--spacing-horizontal));
     39            font-size: var(--quote--font-size);
     40            font-weight: normal;
     41            line-height: var(--quote--line-height);
     42            margin-right: 5px;
    2743        }
    2844    }
    … …  
    5975        &.has-text-align-right {
    6076
     77            // Hide the left aligned quote.
    6178            &:before {
    62                 left: initial;
    63                 right: calc(-1 * var(--global--spacing-horizontal));
     79                display: none;
     80            }
     81
     82            // Align the quote left of the text.
     83            p:before {
     84                content: "\201D";
     85                font-size: var(--quote--font-size-large);
     86                font-weight: normal;
     87                line-height: var(--quote--line-height-large);
     88                margin-right: 10px;
    6489            }
    6590        }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/search/_style.scss

    r49574 r49726  
    11.wp-block-search {
    22    max-width: var(--responsive--aligndefault-width);
    3 
    4     &__button-inside {
    5 
    6         .wp-block-search__inside-wrapper {
    7             background-color: var(--global--color-white);
    8         }
    9     }
    103
    114    &__button-only.aligncenter {
    … …  
    3629        }
    3730
    38         .has-background:not(.has-background-background-color) &,
    39         [class*="background-color"]:not(.has-background-background-color) &,
     31        .has-background &,
     32        [class*="background-color"] &,
    4033        [style*="background-color"] &,
    4134        .wp-block-cover[style*="background-image"] & {
    … …  
    114107    &.wp-block-search__button-inside {
    115108
     109        .wp-block-search__inside-wrapper {
     110            background-color: var(--global--color-white);
     111            border: var(--form--border-width) solid var(--form--border-color);
     112            border-radius: var(--form--border-radius);
     113
     114            .wp-block-search__input {
     115                margin-right: 0;
     116
     117                &:focus {
     118                    outline: 2px dotted var(--form--border-color);
     119                    outline-offset: -5px;
     120
     121                    .is-dark-theme & {
     122                        outline-color: currentColor;
     123                    }
     124                }
     125            }
     126        }
     127
    116128        &.wp-block-search__text-button {
    117129

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/separator/_editor.scss

    r49574 r49726  
    4040    }
    4141
    42     .has-background:not(.has-background-background-color) &,
    43     [class*="background-color"]:not(.has-background-background-color) &,
    44     [style*="background-color"]:not(.has-background-background-color) &,
     42    .has-background &,
     43    [class*="background-color"] &,
     44    [style*="background-color"] &,
    4545    .wp-block-cover[style*="background-image"] & {
    4646        border-color: currentColor;

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/separator/_style.scss

    r49574 r49726  
    88    &.wp-block-separator {
    99        border-bottom: var(--separator--height) solid var(--separator--border-color);
     10        opacity: 1;
    1011
    1112        &:not(.is-style-dots):not(.alignwide) {
    1213            max-width: var(--responsive--aligndefault-width);
     14        }
     15
     16        &:not(.is-style-dots) {
     17
     18            &.alignwide {
     19                max-width: var(--responsive--alignwide-width);
     20            }
    1321
    1422            &.alignfull {
    … …  
    4351        }
    4452
    45         .has-background:not(.has-background-background-color) &,
    46         [class*="background-color"]:not(.has-background-background-color) &,
     53        .has-background &,
     54        [class*="background-color"] &,
    4755        [style*="background-color"] &,
    4856        .wp-block-cover[style*="background-image"] & {

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/social-icons/_style.scss

    r49574 r49726  
    1 .wp-block-social-links.is-style-twentytwentyone-social-icons-color {
     1.wp-block-social-links {
    22
    3     a {
     3    a:focus {
    44        color: var(--global--color-primary);
    55    }
    66
    7     .wp-social-link {
    8         background: none;
     7    &.is-style-twentytwentyone-social-icons-color {
     8
     9        a {
     10            color: var(--global--color-primary);
     11        }
     12
     13        .wp-social-link {
     14            background: none;
     15        }
     16
    917    }
    10 
    1118}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/utilities/_editor.scss

    r49574 r49726  
    2727
    2828// Gutenberg text color options
    29 
    3029.has-primary-color[class] {
    3130    color: var(--global--color-primary);
    … …  
    3938.has-background {
    4039
    41     &:not(.has-background-background-color) a:not(.wp-block-button__link),
     40    a,
    4241    p,
    4342    h1,
    … …  
    7170}
    7271
    73 /**
    74  * Spacing Overrides
    75  */
    76 
     72// Spacing Overrides
    7773[data-block] {
    7874    margin-top: var(--global--spacing-vertical);
    7975    margin-bottom: var(--global--spacing-vertical);
    80 
    81     [data-block]:first-child {
    82         margin-top: 0;
    83     }
    84 
    85     // Needs to be the second-last child to avoid applying this to the appender.
    86     [data-block]:nth-last-child(2) {
    87         margin-bottom: 0;
    88     }
    8976}
    9077
    91 /* Block Alignments */
     78// Block Alignments
    9279.wp-block {
    9380
    … …  
    142129    }
    143130}
     131
     132// Remove the border of blockquotes inside the classic block.
     133.wp-block-freeform.block-library-rich-text__tinymce blockquote {
     134    border: none;
     135}
     136
     137// Adjust the position of the quote symbol for blockquotes inside the classic block.
     138.wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
     139    left: 5px;
     140}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/editor.scss

    r49574 r49726  
    3131// Enforce the custom link color even if a custom background color has been set.
    3232// The extra specificity here is required to override the background color styles.
    33 .has-background:not(.has-background-background-color) {
     33.has-background {
    3434    // Target both current level and nested block.
    3535    .has-link-color a,

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/footer-navigation.scss

    r49574 r49726  
    4646                    }
    4747                }
     48
     49                // Change colors when the body background is white.
     50                .has-background-white & {
     51
     52                    .svg-icon {
     53                        fill: var(--wp--style--color--link, var(--global--color-white));
     54                    }
     55                }
    4856            }
    4957        }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/footer.scss

    r49574 r49726  
    88    .no-widgets & {
    99        margin-top: calc(6 * var(--global--spacing-vertical));
     10    }
     11
     12    @include media(mobile-only) {
     13
     14        .no-widgets & {
     15            margin-top: calc(3 * var(--global--spacing-vertical));
     16        }
    1017    }
    1118}
    … …  
    5865                color: var(--wp--style--color--link, var(--global--color-background));
    5966            }
     67
     68            // Change colors when the body background is white.
     69            .has-background-white & {
     70                color: var(--wp--style--color--link, var(--global--color-white));
     71            }
    6072        }
    6173    }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/header.scss

    r49574 r49726  
    8080a.custom-logo-link {
    8181    text-decoration: none;
     82
     83    &:focus {
     84        // Change colors when the body background is white.
     85        .has-background-white &,
     86        .is-dark-theme & {
     87            background: none;
     88        }
     89    }
    8290}
    8391
    … …  
    8795
    8896// Site logo
    89 
    9097.site-logo {
    9198

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/navigation.scss

    r49574 r49726  
    375375
    376376                    + .sub-menu-toggle {
    377                         margin-left: calc(0px - var(--primary-nav--padding));
     377                        margin-left: calc(5px - var(--primary-nav--padding));
    378378                    }
    379379                }
    … …  
    417417            z-index: 99999; // Ensure focus styles appear above absolute positioned elements
    418418            outline-offset: 0;
     419            text-decoration-thickness: 2px;
    419420        }
    420421    }

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/pagination.scss

    r49574 r49726  
    1212            color: var(--global--color-primary-hover);
    1313            text-decoration: underline;
     14            text-decoration-style: dotted;
    1415        }
    1516
    … …  
    124125            margin-bottom: 0;
    125126        }
    126 
    127         &:hover {
    128 
    129             .post-title {
    130                 text-decoration: underline;
    131                 text-decoration-thickness: 1px;
    132             }
    133         }
    134     }
    135 
     127    }
    136128}
    137129
    … …  
    158150        }
    159151
     152        .is-dark-theme & {
     153
     154            a:active,
     155            a:hover:active,
     156            a:hover:focus {
     157                color: var(--global--color-background);
     158            }
     159        }
     160
     161        .has-background-white & {
     162
     163            a:active,
     164            a:hover:active,
     165            a:hover:focus {
     166                color: var(--global--color-white);
     167            }
     168        }
    160169    }
    161170
    … …  
    170179
    171180        &.current {
    172             border-bottom: 1px solid var(--pagination--color-text);
     181            text-decoration: underline;
     182        }
     183
     184        &:not(.dots):not(.current):hover {
     185            text-decoration-style: dotted;
    173186        }
    174187
    … …  
    228241        font-size: var(--global--font-size-md);
    229242    }
    230 
    231 }
     243}

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/06-components/widgets.scss

    r49574 r49726  
    1515    @include media(wide) {
    1616        grid-template-columns: repeat(3, 1fr);
     17    }
     18
     19    @include media(mobile-only) {
     20        margin-top: calc(3 * var(--global--spacing-vertical));
    1721    }
    1822

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/07-utilities/color-palette.scss

    r49574 r49726  
    4444.has-background {
    4545
    46     &:not(.has-background-background-color) a:not(.wp-block-button__link),
     46    a,
    4747    p,
    4848    h1,

  • trunk/src/wp-content/themes/twentytwentyone/assets/sass/style-dark-mode.scss

    r49633 r49726  
    1313        --global--color-border: #9ea1a7;
    1414
    15         .site a:focus,
    16         .site a:focus .meta-nav {
     15        .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     16        .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    1717            background: #000;
    1818            color: #fff;

  • trunk/src/wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-custom-colors.php

    r49574 r49726  
    169169    public function body_class( $classes ) {
    170170        $background_color = get_theme_mod( 'background_color', 'D1E4DD' );
    171         if ( 127 > self::get_relative_luminance_from_hex( $background_color ) ) {
     171        $luminance        = self::get_relative_luminance_from_hex( $background_color );
     172
     173        if ( 127 > $luminance ) {
    172174            $classes[] = 'is-dark-theme';
    173175        } else {
    … …  
    175177        }
    176178
    177         if ( 'ffffff' === strtolower( $background_color ) ) {
     179        if ( 225 <= $luminance ) {
    178180            $classes[] = 'has-background-white';
    179181        }

  • trunk/src/wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-dark-mode.php

    r49633 r49726  
    6666            wp_add_inline_style(
    6767                'twenty-twenty-one-custom-color-overrides',
    68                 '.is-dark-theme.is-dark-theme .editor-styles-wrapper { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); }'
     68                '.is-dark-theme.is-dark-theme .editor-styles-wrapper { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; }'
    6969            );
    7070        }
    … …  
    183183        );
    184184
    185         $description  = '<p>' . __( 'Dark Mode is a device setting. If a visitor to your site requests it, your site will be shown with a dark background and light text. <a href="https://wordpress.org/support/article/twenty-twenty-one/">Learn more about Dark Mode.</a>', 'twentytwentyone' ) . '</p>';
     185        $description  = '<p>';
     186        $description .= sprintf(
     187            // translators: %s is the wordpress.org Twenty Twenty-One support article URL.
     188            __( 'Dark Mode is a device setting. If a visitor to your site requests it, your site will be shown with a dark background and light text. <a href="%s">Learn more about Dark Mode.</a>', 'twentytwentyone' ),
     189            __( 'https://wordpress.org/support/article/twenty-twenty-one/', 'twentytwentyone' )
     190        );
     191        $description .= '</p>';
    186192        $description .= '<p>' . __( 'Dark Mode can also be turned on and off with a button that you can find in the bottom right corner of the page.', 'twentytwentyone' ) . '</p>';
    187193

  • trunk/src/wp-content/themes/twentytwentyone/functions.php

    r49578 r49726  
    273273                array(
    274274                    'name'     => esc_html__( 'Purple to yellow', 'twentytwentyone' ),
    275                     'gradient' => 'linear-gradient(160deg, ' . $purple . ', ' . $yellow . ')',
     275                    'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $yellow . ' 100%)',
    276276                    'slug'     => 'purple-to-yellow',
    277277                ),
    278278                array(
    279279                    'name'     => esc_html__( 'Yellow to purple', 'twentytwentyone' ),
    280                     'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $purple . ')',
     280                    'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $purple . ' 100%)',
    281281                    'slug'     => 'yellow-to-purple',
    282282                ),
    283283                array(
    284284                    'name'     => esc_html__( 'Green to yellow', 'twentytwentyone' ),
    285                     'gradient' => 'linear-gradient(160deg, ' . $green . ', ' . $yellow . ')',
     285                    'gradient' => 'linear-gradient(160deg, ' . $green . ' 0%, ' . $yellow . ' 100%)',
    286286                    'slug'     => 'green-to-yellow',
    287287                ),
    288288                array(
    289289                    'name'     => esc_html__( 'Yellow to green', 'twentytwentyone' ),
    290                     'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $green . ')',
     290                    'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $green . ' 100%)',
    291291                    'slug'     => 'yellow-to-green',
    292292                ),
    293293                array(
    294294                    'name'     => esc_html__( 'Red to yellow', 'twentytwentyone' ),
    295                     'gradient' => 'linear-gradient(160deg, ' . $red . ', ' . $yellow . ')',
     295                    'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $yellow . ' 100%)',
    296296                    'slug'     => 'red-to-yellow',
    297297                ),
    298298                array(
    299299                    'name'     => esc_html__( 'Yellow to red', 'twentytwentyone' ),
    300                     'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $red . ')',
     300                    'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $red . ' 100%)',
    301301                    'slug'     => 'yellow-to-red',
    302302                ),
    303303                array(
    304304                    'name'     => esc_html__( 'Purple to red', 'twentytwentyone' ),
    305                     'gradient' => 'linear-gradient(160deg, ' . $purple . ', ' . $red . ')',
     305                    'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $red . ' 100%)',
    306306                    'slug'     => 'purple-to-red',
    307307                ),
    308308                array(
    309309                    'name'     => esc_html__( 'Red to purple', 'twentytwentyone' ),
    310                     'gradient' => 'linear-gradient(160deg, ' . $red . ', ' . $purple . ')',
     310                    'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $purple . ' 100%)',
    311311                    'slug'     => 'red-to-purple',
    312312                ),
    … …  
    334334
    335335        // Add support for experimental cover block spacing.
    336         add_theme_support( 'experimental-custom-spacing' );
     336        add_theme_support( 'custom-spacing' );
    337337
    338338        // Add support for custom units.

  • trunk/src/wp-content/themes/twentytwentyone/inc/block-patterns.php

    r49633 r49726  
    115115            'categories'  => array( 'twentytwentyone' ),
    116116            'description' => esc_html_x( 'A block with 3 columns that display contact information and social media links.', 'Block pattern description', 'twentytwentyone' ),
    117             'content'     => '<!-- wp:columns {"align":"wide"} --><div class="wp-block-columns alignwide"><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph --><p><a href="mailto:#">' . esc_html_x( 'example@example.com', 'Block pattern sample content', 'twentytwentyone' ) . '<br></a>' . esc_html_x( '123-456-7890', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph {"align":"center"} --><p class="has-text-align-center">' . esc_html_x( '123 Main Street', 'Block pattern sample content', 'twentytwentyone' ) . '<br>' . esc_html_x( 'Cambridge, MA, 02139', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column {"verticalAlignment":"center"} --><div class="wp-block-column is-vertically-aligned-center"><!-- wp:social-links {"align":"right","className":"is-style-twentytwentyone-social-icons-color"} --><ul class="wp-block-social-links alignright is-style-twentytwentyone-social-icons-color"><!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /--><!-- wp:social-link {"url":"https://www.facebook.com/WordPress/","service":"facebook"} /--><!-- wp:social-link {"url":"https://twitter.com/WordPress","service":"twitter"} /--><!-- wp:social-link {"service":"instagram"} /--><!-- wp:social-link {"service":"linkedin"} /--><!-- wp:social-link {"service":"youtube"} /--><!-- wp:social-link {"url":"https://www.youtube.com/wordpress","service":"youtube"} /--></ul><!-- /wp:social-links --></div><!-- /wp:column --></div><!-- /wp:columns --><!-- wp:paragraph --><p></p><!-- /wp:paragraph -->',
     117            'content'     => '<!-- wp:columns {"align":"wide"} --><div class="wp-block-columns alignwide"><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph --><p><a href="mailto:#">' . esc_html_x( 'example@example.com', 'Block pattern sample content', 'twentytwentyone' ) . '<br></a>' . esc_html_x( '123-456-7890', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph {"align":"center"} --><p class="has-text-align-center">' . esc_html_x( '123 Main Street', 'Block pattern sample content', 'twentytwentyone' ) . '<br>' . esc_html_x( 'Cambridge, MA, 02139', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column {"verticalAlignment":"center"} --><div class="wp-block-column is-vertically-aligned-center"><!-- wp:social-links {"align":"right","className":"is-style-twentytwentyone-social-icons-color"} --><ul class="wp-block-social-links alignright is-style-twentytwentyone-social-icons-color"><!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /--><!-- wp:social-link {"url":"https://www.facebook.com/WordPress/","service":"facebook"} /--><!-- wp:social-link {"url":"https://twitter.com/WordPress","service":"twitter"} /--><!-- wp:social-link {"url":"https://www.youtube.com/wordpress","service":"youtube"} /--></ul><!-- /wp:social-links --></div><!-- /wp:column --></div><!-- /wp:columns -->',
    118118        )
    119119    );

  • trunk/src/wp-content/themes/twentytwentyone/inc/template-tags.php

    r49574 r49726  
    194194                the_post_thumbnail( 'post-thumbnail', array( 'loading' => 'eager' ) );
    195195                ?>
     196                <?php if ( wp_get_attachment_caption( get_post_thumbnail_id() ) ) : ?>
     197                    <figcaption class="wp-caption-text"><?php echo wp_kses_post( wp_get_attachment_caption( get_post_thumbnail_id() ) ); ?></figcaption>
     198                <?php endif; ?>
    196199            </figure><!-- .post-thumbnail -->
    197200
    … …  
    202205                    <?php the_post_thumbnail( 'post-thumbnail' ); ?>
    203206                </a>
     207                <?php if ( wp_get_attachment_caption( get_post_thumbnail_id() ) ) : ?>
     208                    <figcaption class="wp-caption-text"><?php echo wp_kses_post( wp_get_attachment_caption( get_post_thumbnail_id() ) ); ?></figcaption>
     209                <?php endif; ?>
    204210            </figure>
    205211

  • trunk/src/wp-content/themes/twentytwentyone/package-lock.json

    r49633 r49726  
    1515        },
    1616        "@babel/core": {
    17             "version": "7.12.3",
    18             "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.3.tgz",
    19             "integrity": "sha512-0qXcZYKZp3/6N2jKYVxZv0aNCsxTSVCiK72DTiTYZAu7sjg73W0/aynWjMbiGd87EQL4WyA8reiJVh92AVla9g==",
     17            "version": "7.12.9",
     18            "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.9.tgz",
     19            "integrity": "sha512-gTXYh3M5wb7FRXQy+FErKFAv90BnlOuNn1QkCK2lREoPAjrQCO49+HVSrFoe5uakFAF5eenS75KbO2vQiLrTMQ==",
    2020            "dev": true,
    2121            "requires": {
    2222                "@babel/code-frame": "^7.10.4",
    23                 "@babel/generator": "^7.12.1",
     23                "@babel/generator": "^7.12.5",
    2424                "@babel/helper-module-transforms": "^7.12.1",
    25                 "@babel/helpers": "^7.12.1",
    26                 "@babel/parser": "^7.12.3",
    27                 "@babel/template": "^7.10.4",
    28                 "@babel/traverse": "^7.12.1",
    29                 "@babel/types": "^7.12.1",
     25                "@babel/helpers": "^7.12.5",
     26                "@babel/parser": "^7.12.7",
     27                "@babel/template": "^7.12.7",
     28                "@babel/traverse": "^7.12.9",
     29                "@babel/types": "^7.12.7",
    3030                "convert-source-map": "^1.7.0",
    3131                "debug": "^4.1.0",
    … …  
    7878        },
    7979        "@babel/helper-member-expression-to-functions": {
    80             "version": "7.12.1",
    81             "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.12.1.tgz",
    82             "integrity": "sha512-k0CIe3tXUKTRSoEx1LQEPFU9vRQfqHtl+kf8eNnDqb4AUJEy5pz6aIiog+YWtVm2jpggjS1laH68bPsR+KWWPQ==",
    83             "dev": true,
    84             "requires": {
    85                 "@babel/types": "^7.12.1"
     80            "version": "7.12.7",
     81            "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.12.7.tgz",
     82            "integrity": "sha512-DCsuPyeWxeHgh1Dus7APn7iza42i/qXqiFPWyBDdOFtvS581JQePsc1F/nD+fHrcswhLlRc2UpYS1NwERxZhHw==",
     83            "dev": true,
     84            "requires": {
     85                "@babel/types": "^7.12.7"
    8686            }
    8787        },
    … …  
    113113        },
    114114        "@babel/helper-optimise-call-expression": {
    115             "version": "7.10.4",
    116             "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.10.4.tgz",
    117             "integrity": "sha512-n3UGKY4VXwXThEiKrgRAoVPBMqeoPgHVqiHZOanAJCG9nQUL2pLRQirUzl0ioKclHGpGqRgIOkgcIJaIWLpygg==",
    118             "dev": true,
    119             "requires": {
    120                 "@babel/types": "^7.10.4"
     115            "version": "7.12.7",
     116            "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.7.tgz",
     117            "integrity": "sha512-I5xc9oSJ2h59OwyUqjv95HRyzxj53DAubUERgQMrpcCEYQyToeHA+NEcUEsVWB4j53RDeskeBJ0SgRAYHDBckw==",
     118            "dev": true,
     119            "requires": {
     120                "@babel/types": "^7.12.7"
    121121            }
    122122        },
    … …  
    180180        },
    181181        "@babel/parser": {
    182             "version": "7.12.5",
    183             "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.5.tgz",
    184             "integrity": "sha512-FVM6RZQ0mn2KCf1VUED7KepYeUWoVShczewOCfm3nzoBybaih51h+sYVVGthW9M6lPByEPTQf+xm27PBdlpwmQ==",
     182            "version": "7.12.7",
     183            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.7.tgz",
     184            "integrity": "sha512-oWR02Ubp4xTLCAqPRiNIuMVgNO5Aif/xpXtabhzW2HWUD47XJsAB4Zd/Rg30+XeQA3juXigV7hlquOTmwqLiwg==",
    185185            "dev": true
    186186        },
    … …  
    205205        },
    206206        "@babel/template": {
    207             "version": "7.10.4",
    208             "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.10.4.tgz",
    209             "integrity": "sha512-ZCjD27cGJFUB6nmCB1Enki3r+L5kJveX9pq1SvAUKoICy6CZ9yD8xO086YXdYhvNjBdnekm4ZnaP5yC8Cs/1tA==",
     207            "version": "7.12.7",
     208            "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.12.7.tgz",
     209            "integrity": "sha512-GkDzmHS6GV7ZeXfJZ0tLRBhZcMcY0/Lnb+eEbXDBfCAcZCjrZKe6p3J4we/D24O9Y8enxWAg1cWwof59yLh2ow==",
    210210            "dev": true,
    211211            "requires": {
    212212                "@babel/code-frame": "^7.10.4",
    213                 "@babel/parser": "^7.10.4",
    214                 "@babel/types": "^7.10.4"
     213                "@babel/parser": "^7.12.7",
     214                "@babel/types": "^7.12.7"
    215215            }
    216216        },
    217217        "@babel/traverse": {
    218             "version": "7.12.5",
    219             "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.5.tgz",
    220             "integrity": "sha512-xa15FbQnias7z9a62LwYAA5SZZPkHIXpd42C6uW68o8uTuua96FHZy1y61Va5P/i83FAAcMpW8+A/QayntzuqA==",
     218            "version": "7.12.9",
     219            "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.9.tgz",
     220            "integrity": "sha512-iX9ajqnLdoU1s1nHt36JDI9KG4k+vmI8WgjK5d+aDTwQbL2fUnzedNedssA645Ede3PM2ma1n8Q4h2ohwXgMXw==",
    221221            "dev": true,
    222222            "requires": {
    … …  
    225225                "@babel/helper-function-name": "^7.10.4",
    226226                "@babel/helper-split-export-declaration": "^7.11.0",
    227                 "@babel/parser": "^7.12.5",
    228                 "@babel/types": "^7.12.5",
     227                "@babel/parser": "^7.12.7",
     228                "@babel/types": "^7.12.7",
    229229                "debug": "^4.1.0",
    230230                "globals": "^11.1.0",
    … …  
    241241        },
    242242        "@babel/types": {
    243             "version": "7.12.6",
    244             "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.6.tgz",
    245             "integrity": "sha512-hwyjw6GvjBLiyy3W0YQf0Z5Zf4NpYejUnKFcfcUhZCSffoBBp30w6wP2Wn6pk31jMYZvcOrB/1b7cGXvEoKogA==",
     243            "version": "7.12.7",
     244            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.7.tgz",
     245            "integrity": "sha512-MNyI92qZq6jrQkXvtIiykvl4WtoRrVV9MPn+ZfsoEENjiWcBQ3ZSHrkxnJWgWtLX3XXqX5hrSQ+X69wkmesXuQ==",
    246246            "dev": true,
    247247            "requires": {
    … …  
    314314        },
    315315        "@stylelint/postcss-markdown": {
    316             "version": "0.36.1",
    317             "resolved": "https://registry.npmjs.org/@stylelint/postcss-markdown/-/postcss-markdown-0.36.1.tgz",
    318             "integrity": "sha512-iDxMBWk9nB2BPi1VFQ+Dc5+XpvODBHw2n3tYpaBZuEAFQlbtF9If0Qh5LTTwSi/XwdbJ2jt+0dis3i8omyggpw==",
    319             "dev": true,
    320             "requires": {
    321                 "remark": "^12.0.0",
    322                 "unist-util-find-all-after": "^3.0.1"
     316            "version": "0.36.2",
     317            "resolved": "https://registry.npmjs.org/@stylelint/postcss-markdown/-/postcss-markdown-0.36.2.tgz",
     318            "integrity": "sha512-2kGbqUVJUGE8dM+bMzXG/PYUWKkjLIkRLWNh39OaADkiabDRdw8ATFCgbMz5xdIcvwspPAluSL7uY+ZiTWdWmQ==",
     319            "dev": true,
     320            "requires": {
     321                "remark": "^13.0.0",
     322                "unist-util-find-all-after": "^3.0.2"
    323323            }
    324324        },
    … …  
    328328            "integrity": "sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==",
    329329            "dev": true
     330        },
     331        "@types/mdast": {
     332            "version": "3.0.3",
     333            "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-3.0.3.tgz",
     334            "integrity": "sha512-SXPBMnFVQg1s00dlMCc/jCdvPqdE4mXaMMCeRlxLDmTAEoegHT53xKtkDnzDTOcmMHUfcjyf36/YYZ6SxRdnsw==",
     335            "dev": true,
     336            "requires": {
     337                "@types/unist": "*"
     338            }
    330339        },
    331340        "@types/minimist": {
    … …  
    405414                "prettier": "npm:wp-prettier@2.0.5",
    406415                "requireindex": "^1.2.0"
    407             },
    408             "dependencies": {
    409                 "prettier": {
    410                     "version": "npm:wp-prettier@2.0.5",
    411                     "resolved": "https://registry.npmjs.org/wp-prettier/-/wp-prettier-2.0.5.tgz",
    412                     "integrity": "sha512-5GCgdeevIXwR3cW4Qj5XWC5MO1iSCz8+IPn0mMw6awAt/PBiey8yyO7MhePRsaMqghJAhg6Q3QLYWSnUHWkG6A==",
    413                     "dev": true
    414                 }
    415416            }
    416417        },
    … …  
    496497        },
    497498        "array-includes": {
    498             "version": "3.1.1",
    499             "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.1.tgz",
    500             "integrity": "sha512-c2VXaCHl7zPsvpkFsw4nxvFie4fh1ur9bpcgsVkIjqn0H/Xwdg+7fv3n2r/isyS8EBj5b06M9kHyZuIr4El6WQ==",
    501             "dev": true,
    502             "requires": {
     499            "version": "3.1.2",
     500            "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.2.tgz",
     501            "integrity": "sha512-w2GspexNQpx+PutG3QpT437/BenZBj0M/MZGn5mzv/MofYqo0xmRHzn4lFsoDlWJ+THYsGJmFlW68WlDFx7VRw==",
     502            "dev": true,
     503            "requires": {
     504                "call-bind": "^1.0.0",
    503505                "define-properties": "^1.1.3",
    504                 "es-abstract": "^1.17.0",
     506                "es-abstract": "^1.18.0-next.1",
     507                "get-intrinsic": "^1.0.1",
    505508                "is-string": "^1.0.5"
    506509            }
    … …  
    513516        },
    514517        "array.prototype.flatmap": {
    515             "version": "1.2.3",
    516             "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.2.3.tgz",
    517             "integrity": "sha512-OOEk+lkePcg+ODXIpvuU9PAryCikCJyo7GlDG1upleEpQRx6mzL9puEBkozQ5iAx20KV0l3DbyQwqciJtqe5Pg==",
    518             "dev": true,
    519             "requires": {
     518            "version": "1.2.4",
     519            "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.2.4.tgz",
     520            "integrity": "sha512-r9Z0zYoxqHz60vvQbWEdXIEtCwHF0yxaWfno9qzXeNHvfyl3BZqygmGzb84dsubyaXLH4husF+NFgMSdpZhk2Q==",
     521            "dev": true,
     522            "requires": {
     523                "call-bind": "^1.0.0",
    520524                "define-properties": "^1.1.3",
    521                 "es-abstract": "^1.17.0-next.1",
     525                "es-abstract": "^1.18.0-next.1",
    522526                "function-bind": "^1.1.1"
    523527            }
    … …  
    563567        },
    564568        "axe-core": {
    565             "version": "4.0.2",
    566             "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.0.2.tgz",
    567             "integrity": "sha512-arU1h31OGFu+LPrOLGZ7nB45v940NMDMEJeNmbutu57P+UFDVnkZg3e+J1I2HJRZ9hT7gO8J91dn/PMrAiKakA==",
     569            "version": "4.1.1",
     570            "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.1.1.tgz",
     571            "integrity": "sha512-5Kgy8Cz6LPC9DJcNb3yjAXTu3XihQgEdnIg50c//zOC/MyLP0Clg+Y8Sh9ZjjnvBrDZU4DgXS9C3T9r4/scGZQ==",
    568572            "dev": true
    569573        },
    … …  
    698702        },
    699703        "caniuse-lite": {
    700             "version": "1.0.30001157",
    701             "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001157.tgz",
    702             "integrity": "sha512-gOerH9Wz2IRZ2ZPdMfBvyOi3cjaz4O4dgNwPGzx8EhqAs4+2IL/O+fJsbt+znSigujoZG8bVcIAUM/I/E5K3MA==",
    703             "dev": true
    704         },
    705         "ccount": {
    706             "version": "1.1.0",
    707             "resolved": "https://registry.npmjs.org/ccount/-/ccount-1.1.0.tgz",
    708             "integrity": "sha512-vlNK021QdI7PNeiUh/lKkC/mNHHfV0m/Ad5JoI0TYtlBnJAslM/JIkm/tGC88bkLIwO6OQ5uV6ztS6kVAtCDlg==",
     704            "version": "1.0.30001164",
     705            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001164.tgz",
     706            "integrity": "sha512-G+A/tkf4bu0dSp9+duNiXc7bGds35DioCyC6vgK2m/rjA4Krpy5WeZgZyfH2f0wj2kI6yAWWucyap6oOwmY1mg==",
    709707            "dev": true
    710708        },
    … …  
    724722            "resolved": "https://registry.npmjs.org/character-entities/-/character-entities-1.2.4.tgz",
    725723            "integrity": "sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==",
    726             "dev": true
    727         },
    728         "character-entities-html4": {
    729             "version": "1.1.4",
    730             "resolved": "https://registry.npmjs.org/character-entities-html4/-/character-entities-html4-1.1.4.tgz",
    731             "integrity": "sha512-HRcDxZuZqMx3/a+qrzxdBKBPUpxWEq9xw2OPZ3a/174ihfrQKVsFhqtthBInFy1zZ9GgZyFXOatNujm8M+El3g==",
    732724            "dev": true
    733725        },
    … …  
    792784            }
    793785        },
    794         "collapse-white-space": {
    795             "version": "1.0.6",
    796             "resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-1.0.6.tgz",
    797             "integrity": "sha512-jEovNnrhMuqyCcjfEJA56v0Xq8SkIoPKDyaHahwo3POf4qcSXqMYuwNcOTzp74vTsR9Tn08z4MxWqAhcekogkQ==",
    798             "dev": true
    799         },
    800786        "color-convert": {
    801787            "version": "1.9.3",
    … …  
    847833        },
    848834        "core-js-pure": {
    849             "version": "3.7.0",
    850             "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.7.0.tgz",
    851             "integrity": "sha512-EZD2ckZysv8MMt4J6HSvS9K2GdtlZtdBncKAmF9lr2n0c9dJUaUN88PSTjvgwCgQPWKTkERXITgS6JJRAnljtg==",
     835            "version": "3.8.0",
     836            "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.8.0.tgz",
     837            "integrity": "sha512-fRjhg3NeouotRoIV0L1FdchA6CK7ZD+lyINyMoz19SyV+ROpC4noS1xItWHFtwZdlqfMfVPJEyEGdfri2bD1pA==",
    852838            "dev": true
    853839        },
    … …  
    889875        },
    890876        "debug": {
    891             "version": "4.2.0",
    892             "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz",
    893             "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==",
     877            "version": "4.3.1",
     878            "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
     879            "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
    894880            "dev": true,
    895881            "requires": {
    … …  
    1010996        },
    1011997        "electron-to-chromium": {
    1012             "version": "1.3.593",
    1013             "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.593.tgz",
    1014             "integrity": "sha512-GvO7G1ZxvffnMvPCr4A7+iQPVuvpyqMrx2VWSERAjG+pHK6tmO9XqYdBfMIq9corRyi4bNImSDEiDvIoDb8HrA==",
     998            "version": "1.3.612",
     999            "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.612.tgz",
     1000            "integrity": "sha512-CdrdX1B6mQqxfw+51MPWB5qA6TKWjza9f5voBtUlRfEZEwZiFaxJLrhFI8zHE9SBAuGt4h84rQU6Ho9Bauo1LA==",
    10151001            "dev": true
    10161002        },
    … …  
    10461032        },
    10471033        "es-abstract": {
    1048             "version": "1.17.7",
    1049             "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.7.tgz",
    1050             "integrity": "sha512-VBl/gnfcJ7OercKA9MVaegWsBHFjV492syMudcnQZvt/Dw8ezpcOHYZXa/J96O8vx+g4x65YKhxOwDUh63aS5g==",
     1034            "version": "1.18.0-next.1",
     1035            "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.18.0-next.1.tgz",
     1036            "integrity": "sha512-I4UGspA0wpZXWENrdA0uHbnhte683t3qT/1VFH9aX2dA5PPSf6QW5HHXf5HImaqPmjXaVeVk4RGWnaylmV7uAA==",
    10511037            "dev": true,
    10521038            "requires": {
    … …  
    10561042                "has-symbols": "^1.0.1",
    10571043                "is-callable": "^1.2.2",
     1044                "is-negative-zero": "^2.0.0",
    10581045                "is-regex": "^1.1.1",
    10591046                "object-inspect": "^1.8.0",
    … …  
    10881075        },
    10891076        "eslint": {
    1090             "version": "7.13.0",
    1091             "resolved": "https://registry.npmjs.org/eslint/-/eslint-7.13.0.tgz",
    1092             "integrity": "sha512-uCORMuOO8tUzJmsdRtrvcGq5qposf7Rw0LwkTJkoDbOycVQtQjmnhZSuLQnozLE4TmAzlMVV45eCHmQ1OpDKUQ==",
     1077            "version": "7.14.0",
     1078            "resolved": "https://registry.npmjs.org/eslint/-/eslint-7.14.0.tgz",
     1079            "integrity": "sha512-5YubdnPXrlrYAFCKybPuHIAH++PINe1pmKNc5wQRB9HSbqIK1ywAnntE3Wwua4giKu0bjligf1gLF6qxMGOYRA==",
    10931080            "dev": true,
    10941081            "requires": {
    … …  
    12321219        },
    12331220        "eslint-plugin-jsdoc": {
    1234             "version": "30.7.7",
    1235             "resolved": "https://registry.npmjs.org/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-30.7.7.tgz",
    1236             "integrity": "sha512-DmVMJC2AbpYX7X1KhnVT1a9ex1AUvG+q9G8i6hzjp3cpjW8vmKQTUmZnRS0//W+7HvMqeb+eXPANdCOzGVVZBQ==",
     1221            "version": "30.7.8",
     1222            "resolved": "https://registry.npmjs.org/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-30.7.8.tgz",
     1223            "integrity": "sha512-OWm2AYvXjCl7nRbpcw5xisfSVkpVAyp4lGqL9T+DeK4kaPm6ecnmTc/G5s1PtcRrwbaI8bIWGzwScqv5CdGyxA==",
    12371224            "dev": true,
    12381225            "requires": {
    … …  
    18211808                "has": "^1.0.3",
    18221809                "side-channel": "^1.0.2"
     1810            },
     1811            "dependencies": {
     1812                "es-abstract": {
     1813                    "version": "1.17.7",
     1814                    "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.7.tgz",
     1815                    "integrity": "sha512-VBl/gnfcJ7OercKA9MVaegWsBHFjV492syMudcnQZvt/Dw8ezpcOHYZXa/J96O8vx+g4x65YKhxOwDUh63aS5g==",
     1816                    "dev": true,
     1817                    "requires": {
     1818                        "es-to-primitive": "^1.2.1",
     1819                        "function-bind": "^1.1.1",
     1820                        "has": "^1.0.3",
     1821                        "has-symbols": "^1.0.1",
     1822                        "is-callable": "^1.2.2",
     1823                        "is-regex": "^1.1.1",
     1824                        "object-inspect": "^1.8.0",
     1825                        "object-keys": "^1.1.1",
     1826                        "object.assign": "^4.1.1",
     1827                        "string.prototype.trimend": "^1.0.1",
     1828                        "string.prototype.trimstart": "^1.0.1"
     1829                    }
     1830                }
    18231831            }
    18241832        },
    … …  
    18291837            "dev": true
    18301838        },
    1831         "is-alphanumeric": {
    1832             "version": "1.0.0",
    1833             "resolved": "https://registry.npmjs.org/is-alphanumeric/-/is-alphanumeric-1.0.0.tgz",
    1834             "integrity": "sha1-Spzvcdr0wAHB2B1j0UDPU/1oifQ=",
    1835             "dev": true
    1836         },
    18371839        "is-alphanumerical": {
    18381840            "version": "1.0.4",
    … …  
    18731875        },
    18741876        "is-core-module": {
    1875             "version": "2.1.0",
    1876             "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.1.0.tgz",
    1877             "integrity": "sha512-YcV7BgVMRFRua2FqQzKtTDMz8iCuLEyGKjr70q8Zm1yy2qKcurbFEd79PAdHV77oL3NrAaOVQIbMmiHQCHB7ZA==",
     1877            "version": "2.2.0",
     1878            "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.2.0.tgz",
     1879            "integrity": "sha512-XRAfAdyyY5F5cOXn7hYQDqh2Xmii+DEfIcQGxK/uNwMHhIkPWO0g8msXcbzLe+MpGoR951MlqM/2iIlU4vKDdQ==",
    18781880            "dev": true,
    18791881            "requires": {
    … …  
    19781980            "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
    19791981            "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
    1980             "dev": true
    1981         },
    1982         "is-whitespace-character": {
    1983             "version": "1.0.4",
    1984             "resolved": "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.4.tgz",
    1985             "integrity": "sha512-SDweEzfIZM0SJV0EUga669UTKlmL0Pq8Lno0QDQsPnvECB3IM2aP0gdx5TrU0A01MAPfViaZiI2V1QMZLaKK5w==",
    1986             "dev": true
    1987         },
    1988         "is-word-character": {
    1989             "version": "1.0.4",
    1990             "resolved": "https://registry.npmjs.org/is-word-character/-/is-word-character-1.0.4.tgz",
    1991             "integrity": "sha512-5SMO8RVennx3nZrqtKwCGyyetPE9VDba5ugvKLaD4KopPG5kR4mQ7tNt/r7feL5yt5h3lpuBbIUmCOG2eSzXHA==",
    19921982            "dev": true
    19931983        },
    … …  
    20942084        },
    20952085        "known-css-properties": {
    2096             "version": "0.19.0",
    2097             "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.19.0.tgz",
    2098             "integrity": "sha512-eYboRV94Vco725nKMlpkn3nV2+96p9c3gKXRsYqAJSswSENvBhN7n5L+uDhY58xQa0UukWsDMTGELzmD8Q+wTA==",
     2086            "version": "0.20.0",
     2087            "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.20.0.tgz",
     2088            "integrity": "sha512-URvsjaA9ypfreqJ2/ylDr5MUERhJZ+DhguoWRr2xgS5C7aGCalXo+ewL+GixgKBfhT2vuL02nbIgNGqVWgTOYw==",
    20992089            "dev": true
    21002090        },
    … …  
    22062196            }
    22072197        },
     2198        "lru-cache": {
     2199            "version": "6.0.0",
     2200            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
     2201            "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
     2202            "dev": true,
     2203            "requires": {
     2204                "yallist": "^4.0.0"
     2205            }
     2206        },
    22082207        "map-obj": {
    22092208            "version": "4.1.0",
    … …  
    22122211            "dev": true
    22132212        },
    2214         "markdown-escapes": {
    2215             "version": "1.0.4",
    2216             "resolved": "https://registry.npmjs.org/markdown-escapes/-/markdown-escapes-1.0.4.tgz",
    2217             "integrity": "sha512-8z4efJYk43E0upd0NbVXwgSTQs6cT3T06etieCMEg7dRbzCbxUCK/GHlX8mhHRDcp+OLlHkPKsvqQTCvsRl2cg==",
    2218             "dev": true
    2219         },
    2220         "markdown-table": {
    2221             "version": "2.0.0",
    2222             "resolved": "https://registry.npmjs.org/markdown-table/-/markdown-table-2.0.0.tgz",
    2223             "integrity": "sha512-Ezda85ToJUBhM6WGaG6veasyym+Tbs3cMAw/ZhOPqXiYsr0jgocBV3j3nx+4lk47plLlIqjwuTm/ywVI+zjJ/A==",
    2224             "dev": true,
    2225             "requires": {
    2226                 "repeat-string": "^1.0.0"
    2227             }
    2228         },
    22292213        "mathml-tag-names": {
    22302214            "version": "2.1.3",
    … …  
    22332217            "dev": true
    22342218        },
    2235         "mdast-util-compact": {
    2236             "version": "2.0.1",
    2237             "resolved": "https://registry.npmjs.org/mdast-util-compact/-/mdast-util-compact-2.0.1.tgz",
    2238             "integrity": "sha512-7GlnT24gEwDrdAwEHrU4Vv5lLWrEer4KOkAiKT9nYstsTad7Oc1TwqT2zIMKRdZF7cTuaf+GA1E4Kv7jJh8mPA==",
    2239             "dev": true,
    2240             "requires": {
    2241                 "unist-util-visit": "^2.0.0"
    2242             }
     2219        "mdast-util-from-markdown": {
     2220            "version": "0.8.1",
     2221            "resolved": "https://registry.npmjs.org/mdast-util-from-markdown/-/mdast-util-from-markdown-0.8.1.tgz",
     2222            "integrity": "sha512-qJXNcFcuCSPqUF0Tb0uYcFDIq67qwB3sxo9RPdf9vG8T90ViKnksFqdB/Coq2a7sTnxL/Ify2y7aIQXDkQFH0w==",
     2223            "dev": true,
     2224            "requires": {
     2225                "@types/mdast": "^3.0.0",
     2226                "mdast-util-to-string": "^1.0.0",
     2227                "micromark": "~2.10.0",
     2228                "parse-entities": "^2.0.0"
     2229            }
     2230        },
     2231        "mdast-util-to-markdown": {
     2232            "version": "0.5.4",
     2233            "resolved": "https://registry.npmjs.org/mdast-util-to-markdown/-/mdast-util-to-markdown-0.5.4.tgz",
     2234            "integrity": "sha512-0jQTkbWYx0HdEA/h++7faebJWr5JyBoBeiRf0u3F4F3QtnyyGaWIsOwo749kRb1ttKrLLr+wRtOkfou9yB0p6A==",
     2235            "dev": true,
     2236            "requires": {
     2237                "@types/unist": "^2.0.0",
     2238                "longest-streak": "^2.0.0",
     2239                "mdast-util-to-string": "^2.0.0",
     2240                "parse-entities": "^2.0.0",
     2241                "repeat-string": "^1.0.0",
     2242                "zwitch": "^1.0.0"
     2243            },
     2244            "dependencies": {
     2245                "mdast-util-to-string": {
     2246                    "version": "2.0.0",
     2247                    "resolved": "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-2.0.0.tgz",
     2248                    "integrity": "sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==",
     2249                    "dev": true
     2250                }
     2251            }
     2252        },
     2253        "mdast-util-to-string": {
     2254            "version": "1.1.0",
     2255            "resolved": "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-1.1.0.tgz",
     2256            "integrity": "sha512-jVU0Nr2B9X3MU4tSK7JP1CMkSvOj7X5l/GboG1tKRw52lLF1x2Ju92Ms9tNetCcbfX3hzlM73zYo2NKkWSfF/A==",
     2257            "dev": true
    22432258        },
    22442259        "memorystream": {
    … …  
    22492264        },
    22502265        "meow": {
    2251             "version": "7.1.1",
    2252             "resolved": "https://registry.npmjs.org/meow/-/meow-7.1.1.tgz",
    2253             "integrity": "sha512-GWHvA5QOcS412WCo8vwKDlTelGLsCGBVevQB5Kva961rmNfun0PCbv5+xta2kUMFJyR8/oWnn7ddeKdosbAPbA==",
     2266            "version": "8.0.0",
     2267            "resolved": "https://registry.npmjs.org/meow/-/meow-8.0.0.tgz",
     2268            "integrity": "sha512-nbsTRz2fwniJBFgUkcdISq8y/q9n9VbiHYbfwklFh5V4V2uAcxtKQkDc0yCLPM/kP0d+inZBewn3zJqewHE7kg==",
    22542269            "dev": true,
    22552270            "requires": {
    … …  
    22592274                "hard-rejection": "^2.1.0",
    22602275                "minimist-options": "4.1.0",
    2261                 "normalize-package-data": "^2.5.0",
     2276                "normalize-package-data": "^3.0.0",
    22622277                "read-pkg-up": "^7.0.1",
    22632278                "redent": "^3.0.0",
    22642279                "trim-newlines": "^3.0.0",
    2265                 "type-fest": "^0.13.1",
    2266                 "yargs-parser": "^18.1.3"
     2280                "type-fest": "^0.18.0",
     2281                "yargs-parser": "^20.2.3"
    22672282            },
    22682283            "dependencies": {
     2284                "hosted-git-info": {
     2285                    "version": "3.0.7",
     2286                    "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.7.tgz",
     2287                    "integrity": "sha512-fWqc0IcuXs+BmE9orLDyVykAG9GJtGLGuZAAqgcckPgv5xad4AcXGIv8galtQvlwutxSlaMcdw7BUtq2EIvqCQ==",
     2288                    "dev": true,
     2289                    "requires": {
     2290                        "lru-cache": "^6.0.0"
     2291                    }
     2292                },
     2293                "normalize-package-data": {
     2294                    "version": "3.0.0",
     2295                    "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-3.0.0.tgz",
     2296                    "integrity": "sha512-6lUjEI0d3v6kFrtgA/lOx4zHCWULXsFNIjHolnZCKCTLA6m/G625cdn3O7eNmT0iD3jfo6HZ9cdImGZwf21prw==",
     2297                    "dev": true,
     2298                    "requires": {
     2299                        "hosted-git-info": "^3.0.6",
     2300                        "resolve": "^1.17.0",
     2301                        "semver": "^7.3.2",
     2302                        "validate-npm-package-license": "^3.0.1"
     2303                    }
     2304                },
    22692305                "type-fest": {
    2270                     "version": "0.13.1",
    2271                     "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.13.1.tgz",
    2272                     "integrity": "sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==",
     2306                    "version": "0.18.1",
     2307                    "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.18.1.tgz",
     2308                    "integrity": "sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==",
    22732309                    "dev": true
    22742310                },
    22752311                "yargs-parser": {
    2276                     "version": "18.1.3",
    2277                     "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
    2278                     "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
    2279                     "dev": true,
    2280                     "requires": {
    2281                         "camelcase": "^5.0.0",
    2282                         "decamelize": "^1.2.0"
    2283                     }
     2312                    "version": "20.2.4",
     2313                    "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.4.tgz",
     2314                    "integrity": "sha512-WOkpgNhPTlE73h4VFAFsOnomJVaovO8VqLDzy5saChRBFQFBoMYirowyW+Q9HB4HFF4Z7VZTiG3iSzJJA29yRA==",
     2315                    "dev": true
    22842316                }
    22852317            }
    … …  
    22902322            "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
    22912323            "dev": true
     2324        },
     2325        "micromark": {
     2326            "version": "2.10.1",
     2327            "resolved": "https://registry.npmjs.org/micromark/-/micromark-2.10.1.tgz",
     2328            "integrity": "sha512-fUuVF8sC1X7wsCS29SYQ2ZfIZYbTymp0EYr6sab3idFjigFFjGa5UwoniPlV9tAgntjuapW1t9U+S0yDYeGKHQ==",
     2329            "dev": true,
     2330            "requires": {
     2331                "debug": "^4.0.0",
     2332                "parse-entities": "^2.0.0"
     2333            }
    22922334        },
    22932335        "micromatch": {
    … …  
    23692411        },
    23702412        "node-releases": {
    2371             "version": "1.1.66",
    2372             "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.66.tgz",
    2373             "integrity": "sha512-JHEQ1iWPGK+38VLB2H9ef2otU4l8s3yAMt9Xf934r6+ojCYDMHPMqvCc9TnzfeFSP1QEOeU6YZEd3+De0LTCgg==",
     2413            "version": "1.1.67",
     2414            "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.67.tgz",
     2415            "integrity": "sha512-V5QF9noGFl3EymEwUYzO+3NTDpGfQB4ve6Qfnzf3UNydMhjQRVPR1DZTuvWiLzaFJYw2fmDwAfnRNEVb64hSIg==",
    23742416            "dev": true
    23752417        },
    … …  
    24932535        },
    24942536        "object-inspect": {
    2495             "version": "1.8.0",
    2496             "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.8.0.tgz",
    2497             "integrity": "sha512-jLdtEOB112fORuypAyl/50VRVIBIdVQOSUUGQHzJ4xBSbit81zRarz7GThkEFZy1RceYrWYcPcBFPQwHyAc1gA==",
     2537            "version": "1.9.0",
     2538            "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.9.0.tgz",
     2539            "integrity": "sha512-i3Bp9iTqwhaLZBxGkRfo5ZbE07BQRT7MGu8+nNgwW9ItGp1TzCTw2DLEoWwjClxBjOFI/hWljTAmYGCEwmtnOw==",
    24982540            "dev": true
    24992541        },
    … …  
    25172559        },
    25182560        "object.entries": {
     2561            "version": "1.1.3",
     2562            "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.3.tgz",
     2563            "integrity": "sha512-ym7h7OZebNS96hn5IJeyUmaWhaSM4SVtAPPfNLQEI2MYWCO2egsITb9nab2+i/Pwibx+R0mtn+ltKJXRSeTMGg==",
     2564            "dev": true,
     2565            "requires": {
     2566                "call-bind": "^1.0.0",
     2567                "define-properties": "^1.1.3",
     2568                "es-abstract": "^1.18.0-next.1",
     2569                "has": "^1.0.3"
     2570            }
     2571        },
     2572        "object.fromentries": {
     2573            "version": "2.0.3",
     2574            "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.3.tgz",
     2575            "integrity": "sha512-IDUSMXs6LOSJBWE++L0lzIbSqHl9KDCfff2x/JSEIDtEUavUnyMYC2ZGay/04Zq4UT8lvd4xNhU4/YHKibAOlw==",
     2576            "dev": true,
     2577            "requires": {
     2578                "call-bind": "^1.0.0",
     2579                "define-properties": "^1.1.3",
     2580                "es-abstract": "^1.18.0-next.1",
     2581                "has": "^1.0.3"
     2582            }
     2583        },
     2584        "object.values": {
    25192585            "version": "1.1.2",
    2520             "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.2.tgz",
    2521             "integrity": "sha512-BQdB9qKmb/HyNdMNWVr7O3+z5MUIx3aiegEIJqjMBbBf0YT9RRxTJSim4mzFqtyr7PDAHigq0N9dO0m0tRakQA==",
    2522             "dev": true,
    2523             "requires": {
     2586            "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.1.2.tgz",
     2587            "integrity": "sha512-MYC0jvJopr8EK6dPBiO8Nb9mvjdypOachO5REGk6MXzujbBrAisKo3HmdEI6kZDL6fC31Mwee/5YbtMebixeag==",
     2588            "dev": true,
     2589            "requires": {
     2590                "call-bind": "^1.0.0",
    25242591                "define-properties": "^1.1.3",
    2525                 "es-abstract": "^1.17.5",
    2526                 "has": "^1.0.3"
    2527             }
    2528         },
    2529         "object.fromentries": {
    2530             "version": "2.0.2",
    2531             "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.2.tgz",
    2532             "integrity": "sha512-r3ZiBH7MQppDJVLx6fhD618GKNG40CZYH9wgwdhKxBDDbQgjeWGGd4AtkZad84d291YxvWe7bJGuE65Anh0dxQ==",
    2533             "dev": true,
    2534             "requires": {
    2535                 "define-properties": "^1.1.3",
    2536                 "es-abstract": "^1.17.0-next.1",
    2537                 "function-bind": "^1.1.1",
    2538                 "has": "^1.0.3"
    2539             }
    2540         },
    2541         "object.values": {
    2542             "version": "1.1.1",
    2543             "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.1.1.tgz",
    2544             "integrity": "sha512-WTa54g2K8iu0kmS/us18jEmdv1a4Wi//BZ/DTVYEcH0XhLM5NYdpDHja3gt57VrZLcNAO2WGA+KpWsDBaHt6eA==",
    2545             "dev": true,
    2546             "requires": {
    2547                 "define-properties": "^1.1.3",
    2548                 "es-abstract": "^1.17.0-next.1",
    2549                 "function-bind": "^1.1.1",
     2592                "es-abstract": "^1.18.0-next.1",
    25502593                "has": "^1.0.3"
    25512594            }
    … …  
    31293172            "dev": true
    31303173        },
     3174        "prettier": {
     3175            "version": "npm:wp-prettier@2.0.5",
     3176            "resolved": "https://registry.npmjs.org/wp-prettier/-/wp-prettier-2.0.5.tgz",
     3177            "integrity": "sha512-5GCgdeevIXwR3cW4Qj5XWC5MO1iSCz8+IPn0mMw6awAt/PBiey8yyO7MhePRsaMqghJAhg6Q3QLYWSnUHWkG6A==",
     3178            "dev": true
     3179        },
    31313180        "prettier-linter-helpers": {
    31323181            "version": "1.0.0",
    … …  
    33293378                "define-properties": "^1.1.3",
    33303379                "es-abstract": "^1.17.0-next.1"
     3380            },
     3381            "dependencies": {
     3382                "es-abstract": {
     3383                    "version": "1.17.7",
     3384                    "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.7.tgz",
     3385                    "integrity": "sha512-VBl/gnfcJ7OercKA9MVaegWsBHFjV492syMudcnQZvt/Dw8ezpcOHYZXa/J96O8vx+g4x65YKhxOwDUh63aS5g==",
     3386                    "dev": true,
     3387                    "requires": {
     3388                        "es-to-primitive": "^1.2.1",
     3389                        "function-bind": "^1.1.1",
     3390                        "has": "^1.0.3",
     3391                        "has-symbols": "^1.0.1",
     3392                        "is-callable": "^1.2.2",
     3393                        "is-regex": "^1.1.1",
     3394                        "object-inspect": "^1.8.0",
     3395                        "object-keys": "^1.1.1",
     3396                        "object.assign": "^4.1.1",
     3397                        "string.prototype.trimend": "^1.0.1",
     3398                        "string.prototype.trimstart": "^1.0.1"
     3399                    }
     3400                }
    33313401            }
    33323402        },
    … …  
    33443414        },
    33453415        "remark": {
    3346             "version": "12.0.1",
    3347             "resolved": "https://registry.npmjs.org/remark/-/remark-12.0.1.tgz",
    3348             "integrity": "sha512-gS7HDonkdIaHmmP/+shCPejCEEW+liMp/t/QwmF0Xt47Rpuhl32lLtDV1uKWvGoq+kxr5jSgg5oAIpGuyULjUw==",
    3349             "dev": true,
    3350             "requires": {
    3351                 "remark-parse": "^8.0.0",
    3352                 "remark-stringify": "^8.0.0",
    3353                 "unified": "^9.0.0"
     3416            "version": "13.0.0",
     3417            "resolved": "https://registry.npmjs.org/remark/-/remark-13.0.0.tgz",
     3418            "integrity": "sha512-HDz1+IKGtOyWN+QgBiAT0kn+2s6ovOxHyPAFGKVE81VSzJ+mq7RwHFledEvB5F1p4iJvOah/LOKdFuzvRnNLCA==",
     3419            "dev": true,
     3420            "requires": {
     3421                "remark-parse": "^9.0.0",
     3422                "remark-stringify": "^9.0.0",
     3423                "unified": "^9.1.0"
    33543424            }
    33553425        },
    33563426        "remark-parse": {
    3357             "version": "8.0.3",
    3358             "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-8.0.3.tgz",
    3359             "integrity": "sha512-E1K9+QLGgggHxCQtLt++uXltxEprmWzNfg+MxpfHsZlrddKzZ/hZyWHDbK3/Ap8HJQqYJRXP+jHczdL6q6i85Q==",
    3360             "dev": true,
    3361             "requires": {
    3362                 "ccount": "^1.0.0",
    3363                 "collapse-white-space": "^1.0.2",
    3364                 "is-alphabetical": "^1.0.0",
    3365                 "is-decimal": "^1.0.0",
    3366                 "is-whitespace-character": "^1.0.0",
    3367                 "is-word-character": "^1.0.0",
    3368                 "markdown-escapes": "^1.0.0",
    3369                 "parse-entities": "^2.0.0",
    3370                 "repeat-string": "^1.5.4",
    3371                 "state-toggle": "^1.0.0",
    3372                 "trim": "0.0.1",
    3373                 "trim-trailing-lines": "^1.0.0",
    3374                 "unherit": "^1.0.4",
    3375                 "unist-util-remove-position": "^2.0.0",
    3376                 "vfile-location": "^3.0.0",
    3377                 "xtend": "^4.0.1"
     3427            "version": "9.0.0",
     3428            "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-9.0.0.tgz",
     3429            "integrity": "sha512-geKatMwSzEXKHuzBNU1z676sGcDcFoChMK38TgdHJNAYfFtsfHDQG7MoJAjs6sgYMqyLduCYWDIWZIxiPeafEw==",
     3430            "dev": true,
     3431            "requires": {
     3432                "mdast-util-from-markdown": "^0.8.0"
    33783433            }
    33793434        },
    33803435        "remark-stringify": {
    3381             "version": "8.1.1",
    3382             "resolved": "https://registry.npmjs.org/remark-stringify/-/remark-stringify-8.1.1.tgz",
    3383             "integrity": "sha512-q4EyPZT3PcA3Eq7vPpT6bIdokXzFGp9i85igjmhRyXWmPs0Y6/d2FYwUNotKAWyLch7g0ASZJn/KHHcHZQ163A==",
    3384             "dev": true,
    3385             "requires": {
    3386                 "ccount": "^1.0.0",
    3387                 "is-alphanumeric": "^1.0.0",
    3388                 "is-decimal": "^1.0.0",
    3389                 "is-whitespace-character": "^1.0.0",
    3390                 "longest-streak": "^2.0.1",
    3391                 "markdown-escapes": "^1.0.0",
    3392                 "markdown-table": "^2.0.0",
    3393                 "mdast-util-compact": "^2.0.0",
    3394                 "parse-entities": "^2.0.0",
    3395                 "repeat-string": "^1.5.4",
    3396                 "state-toggle": "^1.0.0",
    3397                 "stringify-entities": "^3.0.0",
    3398                 "unherit": "^1.0.4",
    3399                 "xtend": "^4.0.1"
     3436            "version": "9.0.0",
     3437            "resolved": "https://registry.npmjs.org/remark-stringify/-/remark-stringify-9.0.0.tgz",
     3438            "integrity": "sha512-8x29DpTbVzEc6Dwb90qhxCtbZ6hmj3BxWWDpMhA+1WM4dOEGH5U5/GFe3Be5Hns5MvPSFAr1e2KSVtKZkK5nUw==",
     3439            "dev": true,
     3440            "requires": {
     3441                "mdast-util-to-markdown": "^0.5.0"
    34003442            }
    34013443        },
    … …  
    34623504        },
    34633505        "rtlcss": {
    3464             "version": "2.6.1",
    3465             "resolved": "https://registry.npmjs.org/rtlcss/-/rtlcss-2.6.1.tgz",
    3466             "integrity": "sha512-WoKAYLxT123Gh/9dAPeMY0YWBx6D7IjORJhTbmmq8UJI4zaSxsA0uqPWsXEqGgZT2HEGtxWkhkIZ6g1IvOQ+eg==",
     3506            "version": "2.6.2",
     3507            "resolved": "https://registry.npmjs.org/rtlcss/-/rtlcss-2.6.2.tgz",
     3508            "integrity": "sha512-06LFAr+GAPo+BvaynsXRfoYTJvSaWRyOhURCQ7aeI1MKph9meM222F+Zkt3bDamyHHJuGi3VPtiRkpyswmQbGA==",
    34673509            "dev": true,
    34683510            "requires": {
    … …  
    35613603                "es-abstract": "^1.18.0-next.0",
    35623604                "object-inspect": "^1.8.0"
    3563             },
    3564             "dependencies": {
    3565                 "es-abstract": {
    3566                     "version": "1.18.0-next.1",
    3567                     "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.18.0-next.1.tgz",
    3568                     "integrity": "sha512-I4UGspA0wpZXWENrdA0uHbnhte683t3qT/1VFH9aX2dA5PPSf6QW5HHXf5HImaqPmjXaVeVk4RGWnaylmV7uAA==",
    3569                     "dev": true,
    3570                     "requires": {
    3571                         "es-to-primitive": "^1.2.1",
    3572                         "function-bind": "^1.1.1",
    3573                         "has": "^1.0.3",
    3574                         "has-symbols": "^1.0.1",
    3575                         "is-callable": "^1.2.2",
    3576                         "is-negative-zero": "^2.0.0",
    3577                         "is-regex": "^1.1.1",
    3578                         "object-inspect": "^1.8.0",
    3579                         "object-keys": "^1.1.1",
    3580                         "object.assign": "^4.1.1",
    3581                         "string.prototype.trimend": "^1.0.1",
    3582                         "string.prototype.trimstart": "^1.0.1"
    3583                     }
    3584                 }
    35853605            }
    35863606        },
    … …  
    36413661        },
    36423662        "spdx-license-ids": {
    3643             "version": "3.0.6",
    3644             "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.6.tgz",
    3645             "integrity": "sha512-+orQK83kyMva3WyPf59k1+Y525csj5JejicWut55zeTWANuN17qSiSLUXWtzHeNWORSvT7GLDJ/E/XiIWoXBTw==",
     3663            "version": "3.0.7",
     3664            "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.7.tgz",
     3665            "integrity": "sha512-U+MTEOO0AiDzxwFvoa4JVnMV6mZlJKk2sBLt90s7G0Gd0Mlknc7kxEn3nuDPNZRta7O2uy8oLcZLVT+4sqNZHQ==",
    36463666            "dev": true
    36473667        },
    … …  
    36563676            "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
    36573677            "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
    3658             "dev": true
    3659         },
    3660         "state-toggle": {
    3661             "version": "1.0.3",
    3662             "resolved": "https://registry.npmjs.org/state-toggle/-/state-toggle-1.0.3.tgz",
    3663             "integrity": "sha512-d/5Z4/2iiCnHw6Xzghyhb+GcmF89bxwgXG60wjIiZaxnymbyOmI8Hk4VqHXiVVp6u2ysaskFfXg3ekCj4WNftQ==",
    36643678            "dev": true
    36653679        },
    … …  
    36843698        },
    36853699        "string.prototype.matchall": {
    3686             "version": "4.0.2",
    3687             "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.2.tgz",
    3688             "integrity": "sha512-N/jp6O5fMf9os0JU3E72Qhf590RSRZU/ungsL/qJUYVTNv7hTG0P/dbPjxINVN9jpscu3nzYwKESU3P3RY5tOg==",
    3689             "dev": true,
    3690             "requires": {
     3700            "version": "4.0.3",
     3701            "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.3.tgz",
     3702            "integrity": "sha512-OBxYDA2ifZQ2e13cP82dWFMaCV9CGF8GzmN4fljBVw5O5wep0lu4gacm1OL6MjROoUnB8VbkWRThqkV2YFLNxw==",
     3703            "dev": true,
     3704            "requires": {
     3705                "call-bind": "^1.0.0",
    36913706                "define-properties": "^1.1.3",
    3692                 "es-abstract": "^1.17.0",
     3707                "es-abstract": "^1.18.0-next.1",
    36933708                "has-symbols": "^1.0.1",
    36943709                "internal-slot": "^1.0.2",
    36953710                "regexp.prototype.flags": "^1.3.0",
    3696                 "side-channel": "^1.0.2"
     3711                "side-channel": "^1.0.3"
    36973712            }
    36983713        },
    36993714        "string.prototype.padend": {
    3700             "version": "3.1.0",
    3701             "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.0.tgz",
    3702             "integrity": "sha512-3aIv8Ffdp8EZj8iLwREGpQaUZiPyrWrpzMBHvkiSW/bK/EGve9np07Vwy7IJ5waydpGXzQZu/F8Oze2/IWkBaA==",
    3703             "dev": true,
    3704             "requires": {
    3705                 "define-properties": "^1.1.3",
    3706                 "es-abstract": "^1.17.0-next.1"
    3707             }
    3708         },
    3709         "string.prototype.trimend": {
    3710             "version": "1.0.2",
    3711             "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.2.tgz",
    3712             "integrity": "sha512-8oAG/hi14Z4nOVP0z6mdiVZ/wqjDtWSLygMigTzAb+7aPEDTleeFf+WrF+alzecxIRkckkJVn+dTlwzJXORATw==",
    3713             "dev": true,
    3714             "requires": {
     3715            "version": "3.1.1",
     3716            "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.1.tgz",
     3717            "integrity": "sha512-eCzTASPnoCr5Ht+Vn1YXgm8SB015hHKgEIMu9Nr9bQmLhRBxKRfmzSj/IQsxDFc8JInJDDFA0qXwK+xxI7wDkg==",
     3718            "dev": true,
     3719            "requires": {
     3720                "call-bind": "^1.0.0",
    37153721                "define-properties": "^1.1.3",
    37163722                "es-abstract": "^1.18.0-next.1"
    3717             },
    3718             "dependencies": {
    3719                 "es-abstract": {
    3720                     "version": "1.18.0-next.1",
    3721                     "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.18.0-next.1.tgz",
    3722                     "integrity": "sha512-I4UGspA0wpZXWENrdA0uHbnhte683t3qT/1VFH9aX2dA5PPSf6QW5HHXf5HImaqPmjXaVeVk4RGWnaylmV7uAA==",
    3723                     "dev": true,
    3724                     "requires": {
    3725                         "es-to-primitive": "^1.2.1",
    3726                         "function-bind": "^1.1.1",
    3727                         "has": "^1.0.3",
    3728                         "has-symbols": "^1.0.1",
    3729                         "is-callable": "^1.2.2",
    3730                         "is-negative-zero": "^2.0.0",
    3731                         "is-regex": "^1.1.1",
    3732                         "object-inspect": "^1.8.0",
    3733                         "object-keys": "^1.1.1",
    3734                         "object.assign": "^4.1.1",
    3735                         "string.prototype.trimend": "^1.0.1",
    3736                         "string.prototype.trimstart": "^1.0.1"
    3737                     }
    3738                 }
     3723            }
     3724        },
     3725        "string.prototype.trimend": {
     3726            "version": "1.0.3",
     3727            "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.3.tgz",
     3728            "integrity": "sha512-ayH0pB+uf0U28CtjlLvL7NaohvR1amUvVZk+y3DYb0Ey2PUV5zPkkKy9+U1ndVEIXO8hNg18eIv9Jntbii+dKw==",
     3729            "dev": true,
     3730            "requires": {
     3731                "call-bind": "^1.0.0",
     3732                "define-properties": "^1.1.3"
    37393733            }
    37403734        },
    37413735        "string.prototype.trimstart": {
    3742             "version": "1.0.2",
    3743             "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.2.tgz",
    3744             "integrity": "sha512-7F6CdBTl5zyu30BJFdzSTlSlLPwODC23Od+iLoVH8X6+3fvDPPuBVVj9iaB1GOsSTSIgVfsfm27R2FGrAPznWg==",
    3745             "dev": true,
    3746             "requires": {
    3747                 "define-properties": "^1.1.3",
    3748                 "es-abstract": "^1.18.0-next.1"
    3749             },
    3750             "dependencies": {
    3751                 "es-abstract": {
    3752                     "version": "1.18.0-next.1",
    3753                     "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.18.0-next.1.tgz",
    3754                     "integrity": "sha512-I4UGspA0wpZXWENrdA0uHbnhte683t3qT/1VFH9aX2dA5PPSf6QW5HHXf5HImaqPmjXaVeVk4RGWnaylmV7uAA==",
    3755                     "dev": true,
    3756                     "requires": {
    3757                         "es-to-primitive": "^1.2.1",
    3758                         "function-bind": "^1.1.1",
    3759                         "has": "^1.0.3",
    3760                         "has-symbols": "^1.0.1",
    3761                         "is-callable": "^1.2.2",
    3762                         "is-negative-zero": "^2.0.0",
    3763                         "is-regex": "^1.1.1",
    3764                         "object-inspect": "^1.8.0",
    3765                         "object-keys": "^1.1.1",
    3766                         "object.assign": "^4.1.1",
    3767                         "string.prototype.trimend": "^1.0.1",
    3768                         "string.prototype.trimstart": "^1.0.1"
    3769                     }
    3770                 }
     3736            "version": "1.0.3",
     3737            "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.3.tgz",
     3738            "integrity": "sha512-oBIBUy5lea5tt0ovtOFiEQaBkoBBkyJhZXzJYrSmDo5IUUqbOPvVezuRs/agBIdZ2p2Eo1FD6bD9USyBLfl3xg==",
     3739            "dev": true,
     3740            "requires": {
     3741                "call-bind": "^1.0.0",
     3742                "define-properties": "^1.1.3"
    37713743            }
    37723744        },
    … …  
    37883760            }
    37893761        },
    3790         "stringify-entities": {
    3791             "version": "3.1.0",
    3792             "resolved": "https://registry.npmjs.org/stringify-entities/-/stringify-entities-3.1.0.tgz",
    3793             "integrity": "sha512-3FP+jGMmMV/ffZs86MoghGqAoqXAdxLrJP4GUdrDN1aIScYih5tuIO3eF4To5AJZ79KDZ8Fpdy7QJnK8SsL1Vg==",
    3794             "dev": true,
    3795             "requires": {
    3796                 "character-entities-html4": "^1.0.0",
    3797                 "character-entities-legacy": "^1.0.0",
    3798                 "xtend": "^4.0.0"
    3799             }
    3800         },
    38013762        "strip-ansi": {
    38023763            "version": "5.2.0",
    … …  
    38363797        },
    38373798        "stylelint": {
    3838             "version": "13.7.2",
    3839             "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-13.7.2.tgz",
    3840             "integrity": "sha512-mmieorkfmO+ZA6CNDu1ic9qpt4tFvH2QUB7vqXgrMVHe5ENU69q7YDq0YUg/UHLuCsZOWhUAvcMcLzLDIERzSg==",
     3799            "version": "13.8.0",
     3800            "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-13.8.0.tgz",
     3801            "integrity": "sha512-iHH3dv3UI23SLDrH4zMQDjLT9/dDIz/IpoFeuNxZmEx86KtfpjDOscxLTFioQyv+2vQjPlRZnK0UoJtfxLICXQ==",
    38413802            "dev": true,
    38423803            "requires": {
    38433804                "@stylelint/postcss-css-in-js": "^0.37.2",
    3844                 "@stylelint/postcss-markdown": "^0.36.1",
     3805                "@stylelint/postcss-markdown": "^0.36.2",
    38453806                "autoprefixer": "^9.8.6",
    38463807                "balanced-match": "^1.0.0",
    38473808                "chalk": "^4.1.0",
    38483809                "cosmiconfig": "^7.0.0",
    3849                 "debug": "^4.1.1",
     3810                "debug": "^4.2.0",
    38503811                "execall": "^2.0.0",
    38513812                "fast-glob": "^3.2.4",
    38523813                "fastest-levenshtein": "^1.0.12",
    3853                 "file-entry-cache": "^5.0.1",
     3814                "file-entry-cache": "^6.0.0",
    38543815                "get-stdin": "^8.0.0",
    38553816                "global-modules": "^2.0.0",
    … …  
    38603821                "import-lazy": "^4.0.0",
    38613822                "imurmurhash": "^0.1.4",
    3862                 "known-css-properties": "^0.19.0",
     3823                "known-css-properties": "^0.20.0",
    38633824                "lodash": "^4.17.20",
    38643825                "log-symbols": "^4.0.0",
    38653826                "mathml-tag-names": "^2.1.3",
    3866                 "meow": "^7.1.1",
     3827                "meow": "^8.0.0",
    38673828                "micromatch": "^4.0.2",
    38683829                "normalize-selector": "^0.2.0",
    3869                 "postcss": "^7.0.32",
     3830                "postcss": "^7.0.35",
    38703831                "postcss-html": "^0.36.0",
    38713832                "postcss-less": "^3.1.4",
    … …  
    38753836                "postcss-sass": "^0.4.4",
    38763837                "postcss-scss": "^2.1.1",
    3877                 "postcss-selector-parser": "^6.0.2",
     3838                "postcss-selector-parser": "^6.0.4",
    38783839                "postcss-syntax": "^0.36.2",
    38793840                "postcss-value-parser": "^4.1.0",
    … …  
    38863847                "sugarss": "^2.0.0",
    38873848                "svg-tags": "^1.0.0",
    3888                 "table": "^6.0.1",
    3889                 "v8-compile-cache": "^2.1.1",
     3849                "table": "^6.0.3",
     3850                "v8-compile-cache": "^2.2.0",
    38903851                "write-file-atomic": "^3.0.3"
    38913852            },
    … …  
    39433904                    "dev": true
    39443905                },
     3906                "file-entry-cache": {
     3907                    "version": "6.0.0",
     3908                    "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.0.tgz",
     3909                    "integrity": "sha512-fqoO76jZ3ZnYrXLDRxBR1YvOvc0k844kcOg40bgsPrE25LAb/PDqTY+ho64Xh2c8ZXgIKldchCFHczG2UVRcWA==",
     3910                    "dev": true,
     3911                    "requires": {
     3912                        "flat-cache": "^3.0.4"
     3913                    }
     3914                },
     3915                "flat-cache": {
     3916                    "version": "3.0.4",
     3917                    "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
     3918                    "integrity": "sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==",
     3919                    "dev": true,
     3920                    "requires": {
     3921                        "flatted": "^3.1.0",
     3922                        "rimraf": "^3.0.2"
     3923                    }
     3924                },
     3925                "flatted": {
     3926                    "version": "3.1.0",
     3927                    "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.1.0.tgz",
     3928                    "integrity": "sha512-tW+UkmtNg/jv9CSofAKvgVcO7c2URjhTdW1ZTkcAritblu8tajiYy7YisnIflEwtKssCtOxpnBRoCB7iap0/TA==",
     3929                    "dev": true
     3930                },
    39453931                "get-stdin": {
    39463932                    "version": "8.0.0",
    … …  
    39823968                    "dev": true
    39833969                },
     3970                "rimraf": {
     3971                    "version": "3.0.2",
     3972                    "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
     3973                    "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
     3974                    "dev": true,
     3975                    "requires": {
     3976                        "glob": "^7.1.3"
     3977                    }
     3978                },
    39843979                "slice-ansi": {
    39853980                    "version": "4.0.0",
    … …  
    40234018                },
    40244019                "table": {
    4025                     "version": "6.0.3",
    4026                     "resolved": "https://registry.npmjs.org/table/-/table-6.0.3.tgz",
    4027                     "integrity": "sha512-8321ZMcf1B9HvVX/btKv8mMZahCjn2aYrDlpqHaBFCfnox64edeH9kEid0vTLTRR8gWR2A20aDgeuTTea4sVtw==",
     4020                    "version": "6.0.4",
     4021                    "resolved": "https://registry.npmjs.org/table/-/table-6.0.4.tgz",
     4022                    "integrity": "sha512-sBT4xRLdALd+NFBvwOz8bw4b15htyythha+q+DVZqy2RS08PPC8O2sZFgJYEY7bJvbCFKccs+WIZ/cd+xxTWCw==",
    40284023                    "dev": true,
    40294024                    "requires": {
    … …  
    41324127            }
    41334128        },
    4134         "trim": {
    4135             "version": "0.0.1",
    4136             "resolved": "https://registry.npmjs.org/trim/-/trim-0.0.1.tgz",
    4137             "integrity": "sha1-WFhUf2spB1fulczMZm+1AITEYN0=",
    4138             "dev": true
    4139         },
    41404129        "trim-newlines": {
    41414130            "version": "3.0.0",
    … …  
    41444133            "dev": true
    41454134        },
    4146         "trim-trailing-lines": {
    4147             "version": "1.1.4",
    4148             "resolved": "https://registry.npmjs.org/trim-trailing-lines/-/trim-trailing-lines-1.1.4.tgz",
    4149             "integrity": "sha512-rjUWSqnfTNrjbB9NQWfPMH/xRK1deHeGsHoVfpxJ++XeYXE0d6B1En37AHfw3jtfTU7dzMzZL2jjpe8Qb5gLIQ==",
    4150             "dev": true
    4151         },
    41524135        "trough": {
    41534136            "version": "1.0.5",
    … …  
    41934176            "requires": {
    41944177                "is-typedarray": "^1.0.0"
    4195             }
    4196         },
    4197         "unherit": {
    4198             "version": "1.1.3",
    4199             "resolved": "https://registry.npmjs.org/unherit/-/unherit-1.1.3.tgz",
    4200             "integrity": "sha512-Ft16BJcnapDKp0+J/rqFC3Rrk6Y/Ng4nzsC028k2jdDII/rdZ7Wd3pPT/6+vIIxRagwRc9K0IUX0Ra4fKvw+WQ==",
    4201             "dev": true,
    4202             "requires": {
    4203                 "inherits": "^2.0.0",
    4204                 "xtend": "^4.0.0"
    42054178            }
    42064179        },
    … …  
    42354208        },
    42364209        "unist-util-is": {
    4237             "version": "4.0.3",
    4238             "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-4.0.3.tgz",
    4239             "integrity": "sha512-bTofCFVx0iQM8Jqb1TBDVRIQW03YkD3p66JOd/aCWuqzlLyUtx1ZAGw/u+Zw+SttKvSVcvTiKYbfrtLoLefykw==",
    4240             "dev": true
    4241         },
    4242         "unist-util-remove-position": {
    4243             "version": "2.0.1",
    4244             "resolved": "https://registry.npmjs.org/unist-util-remove-position/-/unist-util-remove-position-2.0.1.tgz",
    4245             "integrity": "sha512-fDZsLYIe2uT+oGFnuZmy73K6ZxOPG/Qcm+w7jbEjaFcJgbQ6cqjs/eSPzXhsmGpAsWPkqZM9pYjww5QTn3LHMA==",
    4246             "dev": true,
    4247             "requires": {
    4248                 "unist-util-visit": "^2.0.0"
    4249             }
     4210            "version": "4.0.4",
     4211            "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-4.0.4.tgz",
     4212            "integrity": "sha512-3dF39j/u423v4BBQrk1AQ2Ve1FxY5W3JKwXxVFzBODQ6WEvccguhgp802qQLKSnxPODE6WuRZtV+ohlUg4meBA==",
     4213            "dev": true
    42504214        },
    42514215        "unist-util-stringify-position": {
    … …  
    42564220            "requires": {
    42574221                "@types/unist": "^2.0.2"
    4258             }
    4259         },
    4260         "unist-util-visit": {
    4261             "version": "2.0.3",
    4262             "resolved": "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-2.0.3.tgz",
    4263             "integrity": "sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==",
    4264             "dev": true,
    4265             "requires": {
    4266                 "@types/unist": "^2.0.0",
    4267                 "unist-util-is": "^4.0.0",
    4268                 "unist-util-visit-parents": "^3.0.0"
    4269             }
    4270         },
    4271         "unist-util-visit-parents": {
    4272             "version": "3.1.1",
    4273             "resolved": "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-3.1.1.tgz",
    4274             "integrity": "sha512-1KROIZWo6bcMrZEwiH2UrXDyalAa0uqzWCxCJj6lPOvTve2WkfgCytoDTPaMnodXh1WrXOq0haVYHj99ynJlsg==",
    4275             "dev": true,
    4276             "requires": {
    4277                 "@types/unist": "^2.0.0",
    4278                 "unist-util-is": "^4.0.0"
    42794222            }
    42804223        },
    … …  
    43294272            }
    43304273        },
    4331         "vfile-location": {
    4332             "version": "3.2.0",
    4333             "resolved": "https://registry.npmjs.org/vfile-location/-/vfile-location-3.2.0.tgz",
    4334             "integrity": "sha512-aLEIZKv/oxuCDZ8lkJGhuhztf/BW4M+iHdCwglA/eWc+vtuRFJj8EtgceYFX4LRjOhCAAiNHsKGssC6onJ+jbA==",
    4335             "dev": true
    4336         },
    43374274        "vfile-message": {
    43384275            "version": "2.0.4",
    … …  
    44044341            }
    44054342        },
    4406         "xtend": {
    4407             "version": "4.0.2",
    4408             "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
    4409             "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
    4410             "dev": true
    4411         },
    44124343        "y18n": {
     4344            "version": "4.0.1",
     4345            "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.1.tgz",
     4346            "integrity": "sha512-wNcy4NvjMYL8gogWWYAO7ZFWFfHcbdbE57tZO8e4cbpj8tfUcwrwqSl3ad8HxpYWCdXcJUCeKKZS62Av1affwQ==",
     4347            "dev": true
     4348        },
     4349        "yallist": {
    44134350            "version": "4.0.0",
    4414             "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
    4415             "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==",
     4351            "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
     4352            "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
    44164353            "dev": true
    44174354        },
    … …  
    44494386                "decamelize": "^1.2.0"
    44504387            }
     4388        },
     4389        "zwitch": {
     4390            "version": "1.0.5",
     4391            "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-1.0.5.tgz",
     4392            "integrity": "sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw==",
     4393            "dev": true
    44514394        }
    44524395    }

  • trunk/src/wp-content/themes/twentytwentyone/package.json

    r49574 r49726  
    1010    ],
    1111    "bugs": {
    12         "url": "https://github.com/wordpress/twentytwentyone"
     12        "url": "https://core.trac.wordpress.org/"
    1313    },
    14     "homepage": "https://github.com/wordpress/twentytwentyone",
     14    "homepage": "https://wordpress.org/themes/twentytwentyone/",
    1515    "devDependencies": {
    1616        "@wordpress/browserslist-config": "^2.2.2",

  • trunk/src/wp-content/themes/twentytwentyone/style-rtl.css

    r49574 r49726  
    11751175    font-size: var(--quote--font-size);
    11761176    line-height: var(--quote--line-height);
     1177    position: absolute;
     1178    right: calc(-0.5 * var(--global--spacing-horizontal));
    11771179}
    11781180
    … …  
    14491451        -webkit-appearance: none;
    14501452        border: 3px solid var(--form--color-ranged);
    1451         height: 25px;
    1452         width: 25px;
     1453        height: 44px;
     1454        width: 44px;
    14531455        border-radius: 50%;
    14541456        background: var(--global--color-background);
    … …  
    14581460    input[type=range]::-moz-range-thumb {
    14591461        border: 3px solid var(--form--color-ranged);
    1460         height: 25px;
    1461         width: 25px;
     1462        height: 44px;
     1463        width: 44px;
    14621464        border-radius: 50%;
    14631465        background: var(--global--color-background);
    14641466        cursor: pointer;
     1467        box-sizing: border-box;
    14651468    }
    14661469}
    … …  
    14891492input[type=range]::-ms-thumb {
    14901493    border: 3px solid var(--form--color-ranged);
    1491     height: 25px;
    1492     width: 25px;
     1494    height: 44px;
     1495    width: 44px;
    14931496    border-radius: 50%;
    14941497    background: var(--global--color-background);
    … …  
    15821585figcaption,
    15831586.wp-caption,
    1584 .wp-caption-text {
     1587.wp-caption-text,
     1588.wp-block-embed figcaption {
    15851589    color: currentColor;
    15861590    font-size: var(--global--font-size-xs);
    … …  
    15961600.alignright .wp-caption,
    15971601.alignleft .wp-caption-text,
    1598 .alignright .wp-caption-text {
     1602.alignright .wp-caption-text,
     1603.alignleft .wp-block-embed figcaption,
     1604.alignright .wp-block-embed figcaption {
    15991605    margin-bottom: 0;
    16001606}
    … …  
    16451651}
    16461652
    1647 .site a:focus {
     1653.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    16481654
    16491655    /* Only visible in Windows High Contrast mode */
    16501656    outline: 2px solid transparent;
     1657    text-decoration: underline 1px dotted currentColor;
     1658    text-decoration-skip-ink: none;
    16511659    background: rgba(255, 255, 255, 0.9);
    16521660}
    16531661
    1654 .is-dark-theme .site a:focus,
    1655 .is-dark-theme .site a:focus .meta-nav {
     1662.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     1663.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    16561664    color: var(--wp--style--color--link, var(--global--color-background));
    16571665}
    16581666
    1659 .has-background-white .site a:focus {
     1667.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    16601668    background: rgba(0, 0, 0, 0.9);
    16611669    color: var(--wp--style--color--link, var(--global--color-white));
    16621670}
    16631671
    1664 .has-background-white .site a:focus .meta-nav {
     1672.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    16651673    color: var(--wp--style--color--link, var(--global--color-white));
    16661674}
    16671675
    1668 .site a:focus.skip-link {
     1676.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
    16691677
    16701678    /* Only visible in Windows High Contrast mode */
    … …  
    16731681}
    16741682
    1675 .site a:focus.skip-link:focus {
     1683.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
    16761684    color: #21759b;
    16771685    background-color: #f1f1f1;
    16781686}
    16791687
    1680 .site a:focus img {
     1688.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
    16811689    outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
    16821690}
    16831691
    1684 .has-background:not(.has-background-background-color) .has-link-color a,
    1685 .has-background:not(.has-background-background-color).has-link-color a {
     1692.has-background .has-link-color a,
     1693.has-background.has-link-color a {
    16861694    color: var(--wp--style--color--link, var(--global--color-primary));
    16871695}
    … …  
    17141722}
    17151723
    1716 .site .button:before,
    1717 .site .button:after,
    1718 input[type=submit]:before,
    1719 input[type=submit]:after,
    1720 input[type=reset]:before,
    1721 input[type=reset]:after,
    1722 .wp-block-search__button:before,
    1723 .wp-block-search__button:after,
    1724 .wp-block-button .wp-block-button__link:before,
    1725 .wp-block-button .wp-block-button__link:after {
    1726     content: "";
    1727     display: block;
    1728     height: 0;
    1729     width: 0;
    1730 }
    1731 
    1732 .site .button:before,
    1733 input[type=submit]:before,
    1734 input[type=reset]:before,
    1735 .wp-block-search__button:before,
    1736 .wp-block-button .wp-block-button__link:before {
    1737     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    1738 }
    1739 
    1740 .site .button:after,
    1741 input[type=submit]:after,
    1742 input[type=reset]:after,
    1743 .wp-block-search__button:after,
    1744 .wp-block-button .wp-block-button__link:after {
    1745     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    1746 }
    1747 
    17481724.site .button:focus,
    17491725input[type=submit]:focus,
    … …  
    20272003}
    20282004
    2029 .wp-block-cover .wp-block-cover__inner-container a,
    2030 .wp-block-cover .wp-block-cover-image-text a,
    2031 .wp-block-cover .wp-block-cover-text a,
    2032 .wp-block-cover-image .wp-block-cover__inner-container a,
    2033 .wp-block-cover-image .wp-block-cover-image-text a,
    2034 .wp-block-cover-image .wp-block-cover-text a {
     2005.wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2006.wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2007.wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2008.wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2009.wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2010.wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) {
    20352011    color: currentColor;
    20362012}
    … …  
    21662142    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    21672143    display: inline-block;
    2168 }
    2169 
    2170 .wp-block-file .wp-block-file__button:before,
    2171 .wp-block-file .wp-block-file__button:after {
    2172     content: "";
    2173     display: block;
    2174     height: 0;
    2175     width: 0;
    2176 }
    2177 
    2178 .wp-block-file .wp-block-file__button:before {
    2179     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    2180 }
    2181 
    2182 .wp-block-file .wp-block-file__button:after {
    2183     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    21842144}
    21852145
    … …  
    29212881    border-bottom-style: solid;
    29222882    border-top-style: solid;
     2883    color: currentColor;
     2884    border-color: currentColor;
    29232885    position: relative;
    29242886
    … …  
    29322894    content: "“";
    29332895    display: block;
     2896    position: relative;
     2897    right: 0;
    29342898    font-size: 3rem;
    29352899    font-weight: 500;
    … …  
    29652929}
    29662930
    2967 .wp-block-pullquote.alignleft blockquote:before,
    2968 .wp-block-pullquote.alignleft cite {
     2931.wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before,
     2932.wp-block-pullquote.alignleft:not(.is-style-solid-color) cite {
    29692933    text-align: center;
    29702934}
    … …  
    29992963
    30002964.wp-block-pullquote.is-style-solid-color blockquote {
     2965    margin: 0;
    30012966    max-width: inherit;
    30022967}
    … …  
    30122977}
    30132978
     2979.wp-block-pullquote.is-style-solid-color.alignleft,
     2980.wp-block-pullquote.is-style-solid-color.alignright {
     2981    padding: var(--global--spacing-unit);
     2982}
     2983
     2984.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
     2985.wp-block-pullquote.is-style-solid-color.alignright blockquote {
     2986    max-width: initial;
     2987}
     2988
    30142989.wp-block-quote {
     2990    border-right: none;
    30152991
    30162992    /**
    … …  
    30192995}
    30202996
    3021 .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    3022 [class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
     2997.wp-block-quote:before {
     2998    content: "“";
     2999    font-size: var(--quote--font-size);
     3000    line-height: var(--quote--line-height);
     3001    right: 8px;
     3002}
     3003
     3004.has-background .wp-block-quote .wp-block-quote__citation,
     3005[class*=background-color] .wp-block-quote .wp-block-quote__citation,
    30233006[style*=background-color] .wp-block-quote .wp-block-quote__citation,
    30243007.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation,
    3025 .has-background:not(.has-background-background-color) .wp-block-quote cite,
    3026 [class*=background-color]:not(.has-background-background-color) .wp-block-quote cite,
     3008.has-background .wp-block-quote cite,
     3009[class*=background-color] .wp-block-quote cite,
    30273010[style*=background-color] .wp-block-quote cite,
    30283011.wp-block-cover[style*=background-image] .wp-block-quote cite,
    3029 .has-background:not(.has-background-background-color) .wp-block-quote footer,
    3030 [class*=background-color]:not(.has-background-background-color) .wp-block-quote footer,
     3012.has-background .wp-block-quote footer,
     3013[class*=background-color] .wp-block-quote footer,
    30313014[style*=background-color] .wp-block-quote footer,
    30323015.wp-block-cover[style*=background-image] .wp-block-quote footer {
    … …  
    30413024
    30423025.wp-block-quote.has-text-align-right:before {
     3026    display: none;
     3027}
     3028
     3029.wp-block-quote.has-text-align-right p:before {
    30433030    content: "”";
    3044     right: initial;
    3045     left: calc(-0.5 * var(--global--spacing-horizontal));
     3031    font-size: var(--quote--font-size);
     3032    font-weight: normal;
     3033    line-height: var(--quote--line-height);
     3034    margin-left: 5px;
    30463035}
    30473036
    … …  
    30803069.wp-block-quote.is-large.has-text-align-right:before,
    30813070.wp-block-quote.is-style-large.has-text-align-right:before {
    3082     right: initial;
    3083     left: calc(-1 * var(--global--spacing-horizontal));
     3071    display: none;
     3072}
     3073
     3074.wp-block-quote.is-large.has-text-align-right p:before,
     3075.wp-block-quote.is-style-large.has-text-align-right p:before {
     3076    content: "”";
     3077    font-size: var(--quote--font-size-large);
     3078    font-weight: normal;
     3079    line-height: var(--quote--line-height-large);
     3080    margin-left: 10px;
    30843081}
    30853082
    … …  
    32433240}
    32443241
    3245 .wp-block-search__button-inside .wp-block-search__inside-wrapper {
    3246     background-color: var(--global--color-white);
    3247 }
    3248 
    32493242.wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper {
    32503243    justify-content: center;
    … …  
    32723265}
    32733266
    3274 .has-background:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
    3275 [class*=background-color]:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
     3267.has-background .wp-block-search .wp-block-search__input,
     3268[class*=background-color] .wp-block-search .wp-block-search__input,
    32763269[style*=background-color] .wp-block-search .wp-block-search__input,
    32773270.wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input {
    … …  
    33633356}
    33643357
     3358.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
     3359    background-color: var(--global--color-white);
     3360    border: var(--form--border-width) solid var(--form--border-color);
     3361    border-radius: var(--form--border-radius);
     3362}
     3363
     3364.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
     3365    margin-left: 0;
     3366}
     3367
     3368.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3369    outline: 2px dotted var(--form--border-color);
     3370    outline-offset: -5px;
     3371}
     3372
     3373.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3374    outline-color: currentColor;
     3375}
     3376
    33653377.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button {
    33663378    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    … …  
    34183430hr.wp-block-separator {
    34193431    border-bottom: var(--separator--height) solid var(--separator--border-color);
     3432    opacity: 1;
    34203433
    34213434    /**
    … …  
    34283441}
    34293442
    3430 hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull {
     3443hr.wp-block-separator:not(.is-style-dots).alignwide {
     3444    max-width: var(--responsive--alignwide-width);
     3445}
     3446
     3447hr.wp-block-separator:not(.is-style-dots).alignfull {
    34313448    max-width: var(--responsive--alignfull-width);
    34323449}
    … …  
    34533470}
    34543471
    3455 .has-background:not(.has-background-background-color) hr.wp-block-separator,
    3456 [class*=background-color]:not(.has-background-background-color) hr.wp-block-separator,
     3472.has-background hr.wp-block-separator,
     3473[class*=background-color] hr.wp-block-separator,
    34573474[style*=background-color] hr.wp-block-separator,
    34583475.wp-block-cover[style*=background-image] hr.wp-block-separator {
    34593476    border-color: currentColor;
     3477}
     3478
     3479.wp-block-social-links a:focus {
     3480    color: var(--global--color-primary);
    34603481}
    34613482
    … …  
    38533874}
    38543875
     3876.has-background-white a.custom-logo-link:focus,
     3877.is-dark-theme a.custom-logo-link:focus {
     3878    background: none;
     3879}
     3880
    38553881.site-title > a {
    38563882    text-decoration-color: var(--global--color-secondary);
    … …  
    39593985    margin-top: calc(6 * var(--global--spacing-vertical));
    39603986}
     3987@media only screen and (max-width: 481px) {
     3988
     3989    .no-widgets .site-footer {
     3990        margin-top: calc(3 * var(--global--spacing-vertical));
     3991    }
     3992}
    39613993
    39623994.site-footer > .site-info {
    … …  
    40104042.is-dark-theme .site-footer > .site-info a:focus {
    40114043    color: var(--wp--style--color--link, var(--global--color-background));
     4044}
     4045
     4046.has-background-white .site-footer > .site-info a:focus {
     4047    color: var(--wp--style--color--link, var(--global--color-white));
    40124048}
    40134049
    … …  
    49364972
    49374973    .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle {
    4938         margin-right: calc(0px - var(--primary-nav--padding));
     4974        margin-right: calc(5px - var(--primary-nav--padding));
    49394975    }
    49404976}
    … …  
    49775013    z-index: 99999;
    49785014    outline-offset: 0;
     5015    text-decoration-thickness: 2px;
    49795016}
    49805017
    … …  
    51195156}
    51205157
     5158.has-background-white .footer-navigation-wrapper li a:focus .svg-icon {
     5159    fill: var(--wp--style--color--link, var(--global--color-white));
     5160}
     5161
    51215162.footer-navigation-wrapper li .svg-icon {
    51225163    vertical-align: middle;
    … …  
    51465187    color: var(--global--color-primary-hover);
    51475188    text-decoration: underline;
     5189    text-decoration-style: dotted;
    51485190}
    51495191
    … …  
    52615303}
    52625304
    5263 .post-navigation .nav-next:hover .post-title,
    5264 .post-navigation .nav-previous:hover .post-title {
    5265     text-decoration: underline;
    5266     text-decoration-thickness: 1px;
    5267 }
    5268 
    52695305.pagination,
    52705306.comments-pagination {
    … …  
    52895325.comments-pagination .nav-links a:hover {
    52905326    color: var(--pagination--color-link-hover);
     5327}
     5328
     5329.is-dark-theme .pagination .nav-links a:active,
     5330.is-dark-theme .pagination .nav-links a:hover:active,
     5331.is-dark-theme .pagination .nav-links a:hover:focus,
     5332.is-dark-theme .comments-pagination .nav-links a:active,
     5333.is-dark-theme .comments-pagination .nav-links a:hover:active,
     5334.is-dark-theme .comments-pagination .nav-links a:hover:focus {
     5335    color: var(--global--color-background);
     5336}
     5337
     5338.has-background-white .pagination .nav-links a:active,
     5339.has-background-white .pagination .nav-links a:hover:active,
     5340.has-background-white .pagination .nav-links a:hover:focus,
     5341.has-background-white .comments-pagination .nav-links a:active,
     5342.has-background-white .comments-pagination .nav-links a:hover:active,
     5343.has-background-white .comments-pagination .nav-links a:hover:focus {
     5344    color: var(--global--color-white);
    52915345}
    52925346
    … …  
    53045358.pagination .nav-links > *.current,
    53055359.comments-pagination .nav-links > *.current {
    5306     border-bottom: 1px solid var(--pagination--color-text);
     5360    text-decoration: underline;
     5361}
     5362
     5363.pagination .nav-links > *:not(.dots):not(.current):hover,
     5364.comments-pagination .nav-links > *:not(.dots):not(.current):hover {
     5365    text-decoration-style: dotted;
    53075366}
    53085367
    … …  
    53895448    .widget-area {
    53905449        grid-template-columns: repeat(3, 1fr);
     5450    }
     5451}
     5452@media only screen and (max-width: 481px) {
     5453
     5454    .widget-area {
     5455        margin-top: calc(3 * var(--global--spacing-vertical));
    53915456    }
    53925457}
    … …  
    55865651}
    55875652
    5588 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     5653.has-background a,
    55895654.has-background p,
    55905655.has-background h1,

  • trunk/src/wp-content/themes/twentytwentyone/style.css

    r49574 r49726  
    11831183    font-size: var(--quote--font-size);
    11841184    line-height: var(--quote--line-height);
     1185    position: absolute;
     1186    left: calc(-0.5 * var(--global--spacing-horizontal));
    11851187}
    11861188
    … …  
    14591461        -webkit-appearance: none;
    14601462        border: 3px solid var(--form--color-ranged);
    1461         height: 25px;
    1462         width: 25px;
     1463        height: 44px;
     1464        width: 44px;
    14631465        border-radius: 50%;
    14641466        background: var(--global--color-background);
    … …  
    14681470    input[type=range]::-moz-range-thumb {
    14691471        border: 3px solid var(--form--color-ranged);
    1470         height: 25px;
    1471         width: 25px;
     1472        height: 44px;
     1473        width: 44px;
    14721474        border-radius: 50%;
    14731475        background: var(--global--color-background);
    14741476        cursor: pointer;
     1477        box-sizing: border-box;
    14751478    }
    14761479}
    … …  
    14991502input[type=range]::-ms-thumb {
    15001503    border: 3px solid var(--form--color-ranged);
    1501     height: 25px;
    1502     width: 25px;
     1504    height: 44px;
     1505    width: 44px;
    15031506    border-radius: 50%;
    15041507    background: var(--global--color-background);
    … …  
    15921595figcaption,
    15931596.wp-caption,
    1594 .wp-caption-text {
     1597.wp-caption-text,
     1598.wp-block-embed figcaption {
    15951599    color: currentColor;
    15961600    font-size: var(--global--font-size-xs);
    … …  
    16061610.alignright .wp-caption,
    16071611.alignleft .wp-caption-text,
    1608 .alignright .wp-caption-text {
     1612.alignright .wp-caption-text,
     1613.alignleft .wp-block-embed figcaption,
     1614.alignright .wp-block-embed figcaption {
    16091615    margin-bottom: 0;
    16101616}
    … …  
    16551661}
    16561662
    1657 .site a:focus {
     1663.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    16581664
    16591665    /* Only visible in Windows High Contrast mode */
    16601666    outline: 2px solid transparent;
     1667    text-decoration: underline 1px dotted currentColor;
     1668    text-decoration-skip-ink: none;
    16611669    background: rgba(255, 255, 255, 0.9);
    16621670}
    16631671
    1664 .is-dark-theme .site a:focus,
    1665 .is-dark-theme .site a:focus .meta-nav {
     1672.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
     1673.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    16661674    color: var(--wp--style--color--link, var(--global--color-background));
    16671675}
    16681676
    1669 .has-background-white .site a:focus {
     1677.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    16701678    background: rgba(0, 0, 0, 0.9);
    16711679    color: var(--wp--style--color--link, var(--global--color-white));
    16721680}
    16731681
    1674 .has-background-white .site a:focus .meta-nav {
     1682.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
    16751683    color: var(--wp--style--color--link, var(--global--color-white));
    16761684}
    16771685
    1678 .site a:focus.skip-link {
     1686.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
    16791687
    16801688    /* Only visible in Windows High Contrast mode */
    … …  
    16831691}
    16841692
    1685 .site a:focus.skip-link:focus {
     1693.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
    16861694    color: #21759b;
    16871695    background-color: #f1f1f1;
    16881696}
    16891697
    1690 .site a:focus img {
     1698.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
    16911699    outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
    16921700}
    16931701
    1694 .has-background:not(.has-background-background-color) .has-link-color a,
    1695 .has-background:not(.has-background-background-color).has-link-color a {
     1702.has-background .has-link-color a,
     1703.has-background.has-link-color a {
    16961704    color: var(--wp--style--color--link, var(--global--color-primary));
    16971705}
    … …  
    17241732}
    17251733
    1726 .site .button:before,
    1727 .site .button:after,
    1728 input[type=submit]:before,
    1729 input[type=submit]:after,
    1730 input[type=reset]:before,
    1731 input[type=reset]:after,
    1732 .wp-block-search__button:before,
    1733 .wp-block-search__button:after,
    1734 .wp-block-button .wp-block-button__link:before,
    1735 .wp-block-button .wp-block-button__link:after {
    1736     content: "";
    1737     display: block;
    1738     height: 0;
    1739     width: 0;
    1740 }
    1741 
    1742 .site .button:before,
    1743 input[type=submit]:before,
    1744 input[type=reset]:before,
    1745 .wp-block-search__button:before,
    1746 .wp-block-button .wp-block-button__link:before {
    1747     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    1748 }
    1749 
    1750 .site .button:after,
    1751 input[type=submit]:after,
    1752 input[type=reset]:after,
    1753 .wp-block-search__button:after,
    1754 .wp-block-button .wp-block-button__link:after {
    1755     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    1756 }
    1757 
    17581734.site .button:focus,
    17591735input[type=submit]:focus,
    … …  
    20372013}
    20382014
    2039 .wp-block-cover .wp-block-cover__inner-container a,
    2040 .wp-block-cover .wp-block-cover-image-text a,
    2041 .wp-block-cover .wp-block-cover-text a,
    2042 .wp-block-cover-image .wp-block-cover__inner-container a,
    2043 .wp-block-cover-image .wp-block-cover-image-text a,
    2044 .wp-block-cover-image .wp-block-cover-text a {
     2015.wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2016.wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2017.wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2018.wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
     2019.wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
     2020.wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) {
    20452021    color: currentColor;
    20462022}
    … …  
    21762152    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    21772153    display: inline-block;
    2178 }
    2179 
    2180 .wp-block-file .wp-block-file__button:before,
    2181 .wp-block-file .wp-block-file__button:after {
    2182     content: "";
    2183     display: block;
    2184     height: 0;
    2185     width: 0;
    2186 }
    2187 
    2188 .wp-block-file .wp-block-file__button:before {
    2189     margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
    2190 }
    2191 
    2192 .wp-block-file .wp-block-file__button:after {
    2193     margin-top: -calc(.5em * var(--button--line-height) + -.39);
    21942154}
    21952155
    … …  
    29312891    border-bottom-style: solid;
    29322892    border-top-style: solid;
     2893    color: currentColor;
     2894    border-color: currentColor;
    29332895    position: relative;
    29342896
    … …  
    29422904    content: "“";
    29432905    display: block;
     2906    position: relative;
     2907    left: 0;
    29442908    font-size: 3rem;
    29452909    font-weight: 500;
    … …  
    29752939}
    29762940
    2977 .wp-block-pullquote.alignleft blockquote:before,
    2978 .wp-block-pullquote.alignleft cite {
     2941.wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before,
     2942.wp-block-pullquote.alignleft:not(.is-style-solid-color) cite {
    29792943    text-align: center;
    29802944}
    … …  
    30092973
    30102974.wp-block-pullquote.is-style-solid-color blockquote {
     2975    margin: 0;
    30112976    max-width: inherit;
    30122977}
    … …  
    30222987}
    30232988
     2989.wp-block-pullquote.is-style-solid-color.alignleft,
     2990.wp-block-pullquote.is-style-solid-color.alignright {
     2991    padding: var(--global--spacing-unit);
     2992}
     2993
     2994.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
     2995.wp-block-pullquote.is-style-solid-color.alignright blockquote {
     2996    max-width: initial;
     2997}
     2998
    30242999.wp-block-quote {
     3000    border-left: none;
    30253001
    30263002    /**
    … …  
    30293005}
    30303006
    3031 .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
    3032 [class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
     3007.wp-block-quote:before {
     3008    content: "“";
     3009    font-size: var(--quote--font-size);
     3010    line-height: var(--quote--line-height);
     3011    left: 8px;
     3012}
     3013
     3014.has-background .wp-block-quote .wp-block-quote__citation,
     3015[class*=background-color] .wp-block-quote .wp-block-quote__citation,
    30333016[style*=background-color] .wp-block-quote .wp-block-quote__citation,
    30343017.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation,
    3035 .has-background:not(.has-background-background-color) .wp-block-quote cite,
    3036 [class*=background-color]:not(.has-background-background-color) .wp-block-quote cite,
     3018.has-background .wp-block-quote cite,
     3019[class*=background-color] .wp-block-quote cite,
    30373020[style*=background-color] .wp-block-quote cite,
    30383021.wp-block-cover[style*=background-image] .wp-block-quote cite,
    3039 .has-background:not(.has-background-background-color) .wp-block-quote footer,
    3040 [class*=background-color]:not(.has-background-background-color) .wp-block-quote footer,
     3022.has-background .wp-block-quote footer,
     3023[class*=background-color] .wp-block-quote footer,
    30413024[style*=background-color] .wp-block-quote footer,
    30423025.wp-block-cover[style*=background-image] .wp-block-quote footer {
    … …  
    30513034
    30523035.wp-block-quote.has-text-align-right:before {
     3036    display: none;
     3037}
     3038
     3039.wp-block-quote.has-text-align-right p:before {
    30533040    content: "”";
    3054     left: initial;
    3055     right: calc(-0.5 * var(--global--spacing-horizontal));
     3041    font-size: var(--quote--font-size);
     3042    font-weight: normal;
     3043    line-height: var(--quote--line-height);
     3044    margin-right: 5px;
    30563045}
    30573046
    … …  
    30903079.wp-block-quote.is-large.has-text-align-right:before,
    30913080.wp-block-quote.is-style-large.has-text-align-right:before {
    3092     left: initial;
    3093     right: calc(-1 * var(--global--spacing-horizontal));
     3081    display: none;
     3082}
     3083
     3084.wp-block-quote.is-large.has-text-align-right p:before,
     3085.wp-block-quote.is-style-large.has-text-align-right p:before {
     3086    content: "”";
     3087    font-size: var(--quote--font-size-large);
     3088    font-weight: normal;
     3089    line-height: var(--quote--line-height-large);
     3090    margin-right: 10px;
    30943091}
    30953092
    … …  
    32533250}
    32543251
    3255 .wp-block-search__button-inside .wp-block-search__inside-wrapper {
    3256     background-color: var(--global--color-white);
    3257 }
    3258 
    32593252.wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper {
    32603253    justify-content: center;
    … …  
    32823275}
    32833276
    3284 .has-background:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
    3285 [class*=background-color]:not(.has-background-background-color) .wp-block-search .wp-block-search__input,
     3277.has-background .wp-block-search .wp-block-search__input,
     3278[class*=background-color] .wp-block-search .wp-block-search__input,
    32863279[style*=background-color] .wp-block-search .wp-block-search__input,
    32873280.wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input {
    … …  
    33733366}
    33743367
     3368.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
     3369    background-color: var(--global--color-white);
     3370    border: var(--form--border-width) solid var(--form--border-color);
     3371    border-radius: var(--form--border-radius);
     3372}
     3373
     3374.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
     3375    margin-right: 0;
     3376}
     3377
     3378.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3379    outline: 2px dotted var(--form--border-color);
     3380    outline-offset: -5px;
     3381}
     3382
     3383.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
     3384    outline-color: currentColor;
     3385}
     3386
    33753387.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button {
    33763388    padding: var(--button--padding-vertical) var(--button--padding-horizontal);
    … …  
    34283440hr.wp-block-separator {
    34293441    border-bottom: var(--separator--height) solid var(--separator--border-color);
     3442    opacity: 1;
    34303443
    34313444    /**
    … …  
    34383451}
    34393452
    3440 hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull {
     3453hr.wp-block-separator:not(.is-style-dots).alignwide {
     3454    max-width: var(--responsive--alignwide-width);
     3455}
     3456
     3457hr.wp-block-separator:not(.is-style-dots).alignfull {
    34413458    max-width: var(--responsive--alignfull-width);
    34423459}
    … …  
    34633480}
    34643481
    3465 .has-background:not(.has-background-background-color) hr.wp-block-separator,
    3466 [class*=background-color]:not(.has-background-background-color) hr.wp-block-separator,
     3482.has-background hr.wp-block-separator,
     3483[class*=background-color] hr.wp-block-separator,
    34673484[style*=background-color] hr.wp-block-separator,
    34683485.wp-block-cover[style*=background-image] hr.wp-block-separator {
    34693486    border-color: currentColor;
     3487}
     3488
     3489.wp-block-social-links a:focus {
     3490    color: var(--global--color-primary);
    34703491}
    34713492
    … …  
    38733894}
    38743895
     3896.has-background-white a.custom-logo-link:focus,
     3897.is-dark-theme a.custom-logo-link:focus {
     3898    background: none;
     3899}
     3900
    38753901.site-title > a {
    38763902    text-decoration-color: var(--global--color-secondary);
    … …  
    39794005    margin-top: calc(6 * var(--global--spacing-vertical));
    39804006}
     4007@media only screen and (max-width: 481px) {
     4008
     4009    .no-widgets .site-footer {
     4010        margin-top: calc(3 * var(--global--spacing-vertical));
     4011    }
     4012}
    39814013
    39824014.site-footer > .site-info {
    … …  
    40304062.is-dark-theme .site-footer > .site-info a:focus {
    40314063    color: var(--wp--style--color--link, var(--global--color-background));
     4064}
     4065
     4066.has-background-white .site-footer > .site-info a:focus {
     4067    color: var(--wp--style--color--link, var(--global--color-white));
    40324068}
    40334069
    … …  
    49725008
    49735009    .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle {
    4974         margin-left: calc(0px - var(--primary-nav--padding));
     5010        margin-left: calc(5px - var(--primary-nav--padding));
    49755011    }
    49765012}
    … …  
    50135049    z-index: 99999;
    50145050    outline-offset: 0;
     5051    text-decoration-thickness: 2px;
    50155052}
    50165053
    … …  
    51555192}
    51565193
     5194.has-background-white .footer-navigation-wrapper li a:focus .svg-icon {
     5195    fill: var(--wp--style--color--link, var(--global--color-white));
     5196}
     5197
    51575198.footer-navigation-wrapper li .svg-icon {
    51585199    vertical-align: middle;
    … …  
    51825223    color: var(--global--color-primary-hover);
    51835224    text-decoration: underline;
     5225    text-decoration-style: dotted;
    51845226}
    51855227
    … …  
    52975339}
    52985340
    5299 .post-navigation .nav-next:hover .post-title,
    5300 .post-navigation .nav-previous:hover .post-title {
    5301     text-decoration: underline;
    5302     text-decoration-thickness: 1px;
    5303 }
    5304 
    53055341.pagination,
    53065342.comments-pagination {
    … …  
    53255361.comments-pagination .nav-links a:hover {
    53265362    color: var(--pagination--color-link-hover);
     5363}
     5364
     5365.is-dark-theme .pagination .nav-links a:active,
     5366.is-dark-theme .pagination .nav-links a:hover:active,
     5367.is-dark-theme .pagination .nav-links a:hover:focus,
     5368.is-dark-theme .comments-pagination .nav-links a:active,
     5369.is-dark-theme .comments-pagination .nav-links a:hover:active,
     5370.is-dark-theme .comments-pagination .nav-links a:hover:focus {
     5371    color: var(--global--color-background);
     5372}
     5373
     5374.has-background-white .pagination .nav-links a:active,
     5375.has-background-white .pagination .nav-links a:hover:active,
     5376.has-background-white .pagination .nav-links a:hover:focus,
     5377.has-background-white .comments-pagination .nav-links a:active,
     5378.has-background-white .comments-pagination .nav-links a:hover:active,
     5379.has-background-white .comments-pagination .nav-links a:hover:focus {
     5380    color: var(--global--color-white);
    53275381}
    53285382
    … …  
    53405394.pagination .nav-links > *.current,
    53415395.comments-pagination .nav-links > *.current {
    5342     border-bottom: 1px solid var(--pagination--color-text);
     5396    text-decoration: underline;
     5397}
     5398
     5399.pagination .nav-links > *:not(.dots):not(.current):hover,
     5400.comments-pagination .nav-links > *:not(.dots):not(.current):hover {
     5401    text-decoration-style: dotted;
    53435402}
    53445403
    … …  
    54255484    .widget-area {
    54265485        grid-template-columns: repeat(3, 1fr);
     5486    }
     5487}
     5488@media only screen and (max-width: 481px) {
     5489
     5490    .widget-area {
     5491        margin-top: calc(3 * var(--global--spacing-vertical));
    54275492    }
    54285493}
    … …  
    56225687}
    56235688
    5624 .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
     5689.has-background a,
    56255690.has-background p,
    56265691.has-background h1,
Note: See TracChangeset for help on using the changeset viewer.