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

body {
  margin: 0;
  background: var(--bg);
  color: var(--text-body);
  font-family: var(--font-sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

/* overflow-x:hidden は使わない。横スクロールを隠すと check_visual.py が
   検出できなくなり、崩れが放置される。溢れは隠さず直すこと。 */

img, svg { max-width: 100%; height: auto; display: block; }

a { color: var(--text-strong); text-decoration: none; }
a:hover { color: var(--gold); }

h1, h2, h3 {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 500;
  color: var(--text-strong);
  line-height: 1.5;
}

p { margin: 0; line-height: 2.1; }

ul { margin: 0; padding: 0; list-style: none; }

/* コンテンツの最大幅。デザイン案の width:1440px に対応 */
.page {
  width: 100%;
  max-width: var(--page-max);
  margin-inline: auto;
  background: var(--surface);
}

.section { padding-inline: var(--gutter); }