/* Modern reset CSS + custom font + compiled with postcss + autoprefixer */
:root {
    --csstools-color-scheme--light: initial;
    color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
    :root {
        --csstools-color-scheme--light:  ;
    }
}

html {
  /* Keep text size stable on iOS (no auto-inflation in landscape). */
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%;
}

*, *::before, *::after {
    font-family: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, 'DejaVu Serif', serif;
    -moz-box-sizing: border-box;
         box-sizing: border-box;
}

*:not(dialog) {
  margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
  /* iOS Safari auto-zooms when a focused control's font size is under 16px. */
  font-size: 16px;
  font-size: max(16px, 1rem);
}

p, h1, h2, h3, h4, h5, h6 {
  word-wrap: break-word;
}

p {
  text-wrap: pretty;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/* Other styles. Strictly follow BEM style.                           */
/* main.css is responsible for the root page of angliuster.de website */

.page {
  max-width: 65ch;
  margin-left: auto;
  margin-right: auto;
  padding-top: max(2rem, min(10vh, 5rem));
  padding-bottom: 2rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  line-height: 1.6;
}

.page__title {
  margin-bottom: 0.75em;
}

.page__text + .page__text {
  margin-top: 1em;
}