/* =========================================================================
   page-terms.css — clause typography for the 利用規約 (Terms of Service) page.
   Long-form legal text: constrained line length, generous vertical rhythm,
   indented sub-items. Reuses theme.css tokens; no new colors introduced.
   ========================================================================= */

.ms-terms-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: clamp(26px, 3.2vw, 42px);
}

.ms-terms__list {
  border-top: 1px solid var(--ms-hairline-light);
}

.ms-clause {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(14px, 3vw, 48px);
  align-items: flex-start;
  padding-block: clamp(26px, 3.2vw, 44px);
  border-bottom: 1px solid var(--ms-hairline-light);
}

.ms-clause__num {
  flex: 0 0 auto;
  min-width: 5.2em;
}

.ms-clause__num-figure {
  display: block;
  font-family: var(--ms-font-display);
  font-weight: 800;
  font-size: clamp(22px, 2.8vw, 40px);
  line-height: .86;
  letter-spacing: -.045em;
  color: #CFCABC;
}

.ms-clause__num-label {
  display: block;
  margin-top: 6px;
  font-family: var(--ms-font-display);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .16em;
  color: var(--ms-note);
}

.ms-clause__body {
  flex: 1 1 min(100%, 260px);
  max-width: 46em;
}

.ms-clause__body h2 {
  font-family: var(--ms-font-head);
  font-size: clamp(17px, 1.9vw, 24px);
  font-weight: 800;
  line-height: 1.6;
  letter-spacing: -.01em;
  color: #111;
}

.ms-clause__content { margin-top: 14px; }

.ms-clause__content p {
  font-size: 14px;
  line-height: 2.1;
  color: var(--ms-lead);
  max-width: 46em;
}
.ms-clause__content p + p { margin-top: 14px; }

.ms-clause__content ol,
.ms-clause__content ul {
  max-width: 46em;
  margin-top: 14px;
}

.ms-clause__content li {
  font-size: 14px;
  line-height: 2.05;
  color: var(--ms-lead);
  padding-left: 1.5em;
  position: relative;
  margin-top: 8px;
}

.ms-clause__content ol { counter-reset: lg; }
.ms-clause__content ol > li { counter-increment: lg; }
.ms-clause__content ol > li::before {
  content: counter(lg) ".";
  position: absolute;
  left: 0;
  font-family: var(--ms-font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--ms-accent);
  top: .35em;
}

.ms-clause__content ul > li::before {
  content: "";
  position: absolute;
  left: .2em;
  top: .95em;
  width: 6px;
  height: 1px;
  background: #A7A296;
}

/* Sub-item indentation: a ul/ol nested inside a li (e.g. bulleted examples
   under a numbered point) sits further in and tightens its own spacing. */
.ms-clause__content li > ul,
.ms-clause__content li > ol {
  margin-top: 8px;
  margin-left: .4em;
}
.ms-clause__content li > ul > li,
.ms-clause__content li > ol > li {
  margin-top: 6px;
}

.ms-clause__content strong { font-weight: 700; color: #111; }

/* Fee callouts: mirrors the site's dark price-card treatment, scaled down
   for inline use inside clause text. */
.ms-fee-grid {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(12px, 1.8vw, 20px);
  margin-top: 18px;
}

.ms-fee-box {
  flex: 1 1 min(100%, 180px);
  background: var(--ms-dark);
  color: #F5F4F0;
  padding: clamp(18px, 2.2vw, 26px);
  border-radius: var(--ms-radius);
}
.ms-clause__content li > .ms-fee-box,
.ms-clause__content > .ms-fee-box {
  margin-top: 14px;
}

.ms-fee-box__label {
  display: block;
  font-size: 11.5px;
  letter-spacing: .12em;
  color: rgba(245, 244, 240, .6);
}

.ms-fee-box__num {
  display: block;
  margin-top: 10px;
  font-family: var(--ms-font-display);
  font-weight: 800;
  line-height: .9;
  font-size: clamp(28px, 3.6vw, 44px);
  color: var(--ms-accent);
}
.ms-fee-box__num small {
  font-family: var(--ms-font-head);
  font-size: .34em;
  font-weight: 700;
  color: #F5F4F0;
  margin-left: .14em;
}

.ms-fee-box--flat {
  background: var(--ms-alt-bg);
  color: #111;
  font-family: var(--ms-font-head);
  font-size: clamp(15px, 1.6vw, 20px);
  font-weight: 800;
  padding: 16px 20px;
}

/* Service inclusion grid (Article 3 — 14 items). */
.ms-service-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 1px;
  background: var(--ms-hairline-light);
  border: 1px solid var(--ms-hairline-light);
  margin-top: 18px;
}
.ms-service-grid__cell {
  background: var(--ms-bg);
  padding: clamp(16px, 1.8vw, 22px);
}
.ms-service-grid__num {
  display: block;
  font-family: var(--ms-font-display);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ms-accent);
  margin-bottom: 10px;
}
.ms-service-grid__title {
  display: block;
  font-family: var(--ms-font-head);
  font-size: 14px;
  font-weight: 700;
  color: #111;
}
.ms-service-grid__desc {
  display: block;
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.95;
  color: var(--ms-lead);
}

/* Foot matter: enactment date / business name + link to the Legal page. */
.ms-terms-foot {
  margin-top: clamp(32px, 4vw, 52px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-end;
}
.ms-terms-foot dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 22px;
  font-size: 12.5px;
  line-height: 1.9;
  color: var(--ms-lead);
}
.ms-terms-foot dt {
  font-family: var(--ms-font-display);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .14em;
  color: var(--ms-note);
  padding-top: 3px;
}
.ms-terms-foot dd strong { font-weight: 700; color: #111; }

@media (max-width: 640px) {
  .ms-clause__content p,
  .ms-clause__content li { font-size: 13.5px; line-height: 1.95; }
}