*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  font-family: var(--font-ja);
  font-weight: var(--fw-regular);
  line-height: 1.75;
  color: var(--c-text-on-light);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
ul, ol { list-style: none; }
.container { width: 100%; max-width: var(--content-max); margin: 0 auto; padding: 0 clamp(20px, 4vw, 40px); }
.container--narrow { max-width: var(--content-narrow); }
.section { padding: var(--section-pad) 0; }
.section--dark { background: var(--c-dark-primary); color: var(--c-text-on-dark); }
.section--darker { background: var(--c-black); color: var(--c-text-on-dark); }
.section--light { background: var(--c-white); color: var(--c-text-on-light); }
.section--offwhite { background: var(--c-off-white); color: var(--c-text-on-light); }
.heading-xl { font-size: clamp(28px, 4vw, 44px); font-weight: var(--fw-bold); line-height: 1.3; letter-spacing: -0.02em; }
.heading-lg { font-size: clamp(22px, 3vw, 32px); font-weight: var(--fw-bold); line-height: 1.4; letter-spacing: -0.01em; }
.heading-md { font-size: clamp(18px, 2vw, 22px); font-weight: var(--fw-semi); line-height: 1.5; }
.heading-sm { font-size: clamp(14px, 1.5vw, 16px); font-weight: var(--fw-medium); line-height: 1.6; letter-spacing: 0.04em; text-transform: uppercase; }
.text-body { font-size: clamp(14px, 1.2vw, 16px); line-height: 1.8; }
.text-sub { font-size: clamp(12px, 1vw, 14px); line-height: 1.7; }
.text-en { font-family: var(--font-en); }
.text-muted { color: var(--c-text-on-light-sub); }
.section--dark .text-muted, .section--darker .text-muted { color: var(--c-text-on-dark-sub); }
.text-center { text-align: center; }
.text-metallic {
  background: linear-gradient(135deg, var(--c-steel-light), var(--c-chrome), var(--c-steel-light));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
