/* 出所: RHEMS-Japan/reducer-lp  design/design-system/tokens/base.css（2026-11-11 取得）
   値は改変していない。DS 更新時はファイルごと差し替える。 */

/* reducer — Base reset + brand utility classes
 * Mirrors the real reducer-lp common.css so consumers get the same building
 * blocks (pills, buttons, columns, containers) grounded in tokens.
 */

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

html { font-size: 62.5%; } /* 10px base — matches the site */

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; vertical-align: bottom; }

a { color: var(--color-link); text-decoration: none; }
a:hover { opacity: var(--hover-opacity); transition: opacity var(--dur-hover) var(--ease-in); }

h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul { list-style: none; padding: 0; }

.rd-bold { font-weight: var(--fw-semibold); }

/* ---- Containers ---- */
.rd-inner { width: 100%; max-width: var(--container); margin: 0 auto; }
.rd-inner-s { width: 100%; max-width: var(--container-narrow); margin: 0 auto; }

/* ---- Pills (kadomaru) ---- */
.rd-pill {
  display: inline-block;
  border-radius: var(--radius-full);
  background: var(--color-primary);
  color: var(--reducer-white);
  padding: 0.7rem 3rem;
  text-align: center;
  line-height: 1.4;
}
.rd-pill--dark { background: var(--color-primary-strong); font-weight: var(--fw-bold); }

/* ---- Columns ---- */
.rd-col-3 { display: flex; justify-content: space-between; gap: 40px; }
.rd-col-3 > * { width: calc((100% - 80px) / 3); }
@media (max-width: 768px) {
  .rd-col-3 { display: block; }
  .rd-col-3 > * { width: 100%; }
}