/* CIZ 会社概要 — company profile table and history timeline.

   New content that has no counterpart in the Framer template, so it is built
   here rather than bent out of a template block. Injected as the last thing
   before the closing CTA of every breakpoint copy of the 会社概要 page
   (see company-profile.js); hidden copies are display:none, so only the one
   matching the viewport ever paints.

   Type scale is lifted from the sections it sits between, measured off the
   live page: display heading 90px/200 Archivo ExtraLight at -1.8px tracking,
   bracket label and index column 14px, row title 24px at -0.48px, note 14px.
   Remove the <link>/<script> in about-me/index.html to revert. */

.ciz-profile {
  --cp-ink: #1f1f1f;
  --cp-rule: rgba(31, 31, 31, .18);
  --cp-mute: #6c7175;
  box-sizing: border-box;
  width: 100%;
  padding: 120px 53px 40px;
  background: #fff;
  color: var(--cp-ink);
}
.ciz-profile *,
.ciz-profile *::before,
.ciz-profile *::after { box-sizing: inherit; }

/* Display heading. Archivo ExtraLight carries no CJK, so the Japanese falls
   through to the ja.css stack per-glyph; 1.06 line-height matches the
   override ja.css already applies to the other display blocks. */
.ciz-profile__h {
  margin: 0;
  font-family: "Archivo ExtraLight", var(--ja-sans, sans-serif);
  font-weight: 200;
  font-size: 90px;
  line-height: 1.06;
  letter-spacing: -1.8px;
}

.ciz-profile__label {
  margin: 44px 0 0;
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: normal;
  color: var(--cp-mute);
}

/* Rows. The grid columns line up with the 対応施策 list above: index column
   at ~28% and the value starting where that list's titles start. */
.ciz-profile__list { margin: 18px 0 0; border-top: 1px solid var(--cp-rule); }
.ciz-profile__row {
  display: grid;
  grid-template-columns: minmax(140px, 24%) 1fr;
  gap: 24px;
  padding: 22px 0;
  border-bottom: 1px solid var(--cp-rule);
}
.ciz-profile__k {
  font-size: 14px;
  line-height: 1.4;
  color: var(--cp-mute);
}
.ciz-profile__v {
  font-size: 18px;
  line-height: 1.75;
  letter-spacing: -.18px;
}
.ciz-profile__v p { margin: 0; }
.ciz-profile__v p + p { margin-top: 1.1em; }
.ciz-profile__v ul { margin: 0; padding: 0; list-style: none; }
.ciz-profile__v a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* 業務内容 is long-form prose, so it drops to reading size rather than
   holding the 18px used for one-line values. */
.ciz-profile__v--prose { font-size: 15px; line-height: 2; }

/* History. Same two columns, but the date column is the index, so it takes
   the monospace-ish 14px the W/00x and A/00x labels use. */
.ciz-profile__row--hist { grid-template-columns: minmax(140px, 24%) 1fr; }
.ciz-profile__row--hist .ciz-profile__k { font-size: 14px; color: var(--cp-ink); }
.ciz-profile__row--hist .ciz-profile__v { font-size: 20px; letter-spacing: -.4px; }
.ciz-profile__note { display: block; margin-top: 4px; font-size: 13px; color: var(--cp-mute); }

@media (max-width: 1199.98px) {
  .ciz-profile { padding: 96px 40px 32px; }
  .ciz-profile__h { font-size: 64px; letter-spacing: -1.28px; }
}
@media (max-width: 767.98px) {
  .ciz-profile { padding: 72px 24px 24px; }
  .ciz-profile__h { font-size: 40px; letter-spacing: -.8px; }
  .ciz-profile__row,
  .ciz-profile__row--hist { grid-template-columns: 1fr; gap: 6px; padding: 18px 0; }
  .ciz-profile__v { font-size: 16px; }
  .ciz-profile__row--hist .ciz-profile__v { font-size: 17px; }
}

@media (prefers-reduced-motion: no-preference) {
  .ciz-profile__row { opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease; }
  .ciz-profile.is-in .ciz-profile__row { opacity: 1; transform: none; }
}