/*! n’ize.css v0.6.0 | MIT License | github.com/smnscp/n-ize.css */

/**
 * ## Document
 */

/**
 * Provide a slot for setting the root line height.
 */

:root {
  line-height: var(--line-root);
}

/**
 * Set Box sizing default to border-box.
 */

*,
::before,
::after {
  box-sizing: border-box;
  margin: 0;
}

/**
 * 1. Remove the margin in all browsers.
 * 2. Generic typography.
 */

body {
  font-family: var(--font-body);
  font-weight: var(--weight-body);
  font-size: var(--scale-0);
  line-height: var(--line-0);
}

/**
 * ## Sectioning
 */

/**
 * Generic typography for headings.
 */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
}
h1 {
  font-size: var(--scale-3);
  line-height: var(--line-3);
}
h2 {
  font-size: var(--scale-2);
  line-height: var(--line-2);
}
h3 {
  font-size: var(--scale-1);
  line-height: var(--line-1);
}
h4 {
  font-size: var(--scale-0);
  line-height: var(--line-0);
}
h5 {
  font-size: var(--scale--1);
  line-height: var(--line--1);
}
h6 {
  font-size: var(--scale--2);
  line-height: var(--line--2);
}

/**
 * ## Block-level spacing
 * Use common block margin to help establishing a baseline grid.
 * https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/
 */

* + :is(h1, h2, h3, h4, h5, h6) {
  margin-block-start: var(--spacing-heading);
}

* + :is(article, section) {
  margin-block-start: var(--spacing-sectioning);
}

* + :is(p, blockquote, figure, figcaption, pre, menu, dir, hr),
:is(h1, h2, h3, h4, h5, h6, p, blockquote, figure, figcaption, pre, menu, dir, hr) + div,
:not(dd, li, li > details) > * + :is(dl, ol, ul) {
  margin-block-start: var(--spacing-block);
}

/**
 * ## Block-level text content
 */

/**
 * Replace 40px indent.
 */

ol,
ul,
menu,
dir {
  padding-inline-start: var(--spacing-inline);
}

dd {
  margin-inline-start: var(--spacing-inline);
}

blockquote,
figure {
  margin-inline: var(--spacing-inline);
}

/**
 * Make `hr` line-height neutral, i. e. 0px high.
 */

hr {
  border: none;
  outline-style: var(--stroke-style-hr, var(--stroke-style-default, solid));
  outline-width: calc(0.5 * var(--stroke-width-hr, var(--stroke-width-default, 0.125rem)));
  margin-inline: auto;
  color: var(--color-hr);
}

/**
 * ## Inline text semantics
 */

/**
 * Generic typography for monospaced elements.
 */

code,
kbd,
samp,
pre {
  font-family: var(--font-mono);
}

/**
 * Set scale-based font size.
 */

small,
sub,
sup {
  font-size: var(--scale-smaller);
}

/**
 * Prevent certain inline (pseudo) elements from affecting the line height.
 */

code,
kbd,
samp,
sub,
sup,
small,
::marker {
  line-height: 0;
}