/*
 * ヒーローのみ。個別セクション・フォント読み込み・ヘッダーJSは未実装。
 * 原本の40/62/72px等はtokens.cssが768/1024pxで切り替える。
 */
.zpf-site .zpf-hero {
  position: relative;
  padding-top: var(--zpf-hero-section-top);
  overflow: hidden;
  background: var(--zpf-bg-page);
}
/* WP標準管理バー分の補正。将来、この専用クラスだけで調整可能。 */
.zpf-site .zpf-hero--admin-toolbar {
  padding-top: calc(var(--zpf-hero-section-top) + 32px);
}
.zpf-site .zpf-hero__grid-texture {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, var(--zpf-grid-line-color) var(--zpf-grid-line-width), transparent var(--zpf-grid-line-width)),
    linear-gradient(to bottom, var(--zpf-grid-line-color) var(--zpf-grid-line-width), transparent var(--zpf-grid-line-width));
  background-size: var(--zpf-grid-cell) var(--zpf-grid-cell);
  mask-image: linear-gradient(to bottom, black, transparent var(--zpf-hero-grid-mask-end));
}
.zpf-site .zpf-hero__container { position: relative; }
.zpf-site .zpf-hero__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--zpf-hero-column-gap);
  align-items: center;
  padding-top: var(--zpf-hero-inner-top);
  padding-bottom: var(--zpf-hero-inner-bottom);
}
.zpf-site .zpf-hero__copy,
.zpf-site .zpf-hero__visual { min-width: 0; }
.zpf-site .zpf-hero__eyebrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zpf-space-8) var(--zpf-space-12);
  margin-bottom: var(--zpf-hero-eyebrow-margin);
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label);
  letter-spacing: var(--zpf-hero-eyebrow-tracking);
  color: var(--zpf-text-muted);
}
.zpf-site .zpf-hero__eyebrow-line {
  width: var(--zpf-space-36);
  height: var(--zpf-border-width);
  background: var(--zpf-color-accent-500);
}
.zpf-site .zpf-hero__expert {
  display: none;
  border-left: var(--zpf-border-width) solid var(--zpf-border-heading);
  padding-left: var(--zpf-space-12);
  letter-spacing: var(--zpf-tracking-index);
  color: var(--zpf-color-accent-700);
}
.zpf-site .zpf-hero__title {
  margin: 0 0 var(--zpf-hero-title-margin);
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-hero-title-size);
  font-weight: var(--zpf-hero-title-weight);
  line-height: var(--zpf-hero-title-line);
  letter-spacing: var(--zpf-hero-title-tracking);
  color: var(--zpf-hero-title-color);
}
.zpf-site .zpf-hero__word,
.zpf-site .zpf-hero__title-tail { display: inline-block; white-space: nowrap; }
.zpf-site .zpf-hero__cross {
  margin-inline: var(--zpf-hero-cross-margin);
  font-weight: var(--zpf-hero-cross-weight);
  color: var(--zpf-hero-cross-color);
}
.zpf-site .zpf-hero__subtitle {
  margin: 0 0 var(--zpf-hero-subtitle-margin);
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-hero-subtitle-size);
  font-weight: var(--zpf-hero-subtitle-weight);
  line-height: var(--zpf-hero-subtitle-line);
  letter-spacing: var(--zpf-tracking-tight);
  color: var(--zpf-hero-subtitle-color);
}
.zpf-site .zpf-hero__subtitle span { color: var(--zpf-hero-subtitle-accent); }
.zpf-site .zpf-hero__description {
  max-width: var(--zpf-content-max-short);
  margin: 0 0 var(--zpf-hero-description-margin);
  font-size: var(--zpf-hero-description-size);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-body);
}
.zpf-site .zpf-hero__actions {
  gap: var(--zpf-hero-actions-gap);
  margin-bottom: var(--zpf-hero-actions-margin);
}
.zpf-site .zpf-hero__actions .zpf-button {
  padding: var(--zpf-hero-button-padding-y) var(--zpf-hero-button-padding-x);
}
.zpf-site .zpf-hero__trust {
  border-top: var(--zpf-border-width) solid var(--zpf-border-color);
  padding-top: var(--zpf-hero-trust-padding-top);
}
.zpf-site .zpf-hero__trust-list,
.zpf-site .zpf-hero__quick-list { list-style: none; margin: 0; padding: 0; }
.zpf-site .zpf-hero__trust-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zpf-space-12) var(--zpf-space-32);
}
.zpf-site .zpf-hero__trust-list li {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-8);
  margin: 0;
  padding: 0;
  font-size: var(--zpf-text-sm);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-hero__check { color: var(--zpf-color-accent-600); }
.zpf-site .zpf-hero__media {
  position: relative;
  width: 100%;
  height: var(--zpf-hero-image-height);
  overflow: hidden;
  background: var(--zpf-bg-image-placeholder);
  border-radius: var(--zpf-radius-none);
}
.zpf-site .zpf-hero__media :is(img, video) {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.zpf-site .zpf-hero__caption {
  display: flex;
  align-items: baseline;
  gap: var(--zpf-space-16);
  border-top: var(--zpf-border-width) solid var(--zpf-border-color);
  padding-top: var(--zpf-space-16);
  margin-top: var(--zpf-space-16);
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-hero__caption-label {
  flex-shrink: 0;
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label-small);
  letter-spacing: var(--zpf-hero-eyebrow-tracking);
  color: var(--zpf-color-primary-600);
}
.zpf-site .zpf-hero__quick {
  position: relative;
  border-top: var(--zpf-border-width) solid var(--zpf-border-color);
  background: var(--zpf-bg-hero-quick-nav);
}
.zpf-site .zpf-hero__quick-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.zpf-site .zpf-hero__quick-list li { margin: 0; padding: 0; min-width: 0; }
.zpf-site .zpf-hero__quick-list li + li {
  border-left: var(--zpf-border-width) solid var(--zpf-border-color);
}
.zpf-site .zpf-hero__quick-list a {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-12);
  height: 100%;
  padding: var(--zpf-space-20) var(--zpf-space-16);
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-text-body);
  text-decoration: none;
}
.zpf-site .zpf-hero__quick-number {
  flex-shrink: 0;
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label-small);
  font-variant-numeric: tabular-nums;
  color: var(--zpf-color-primary-600);
}
@media (hover: hover) {
  .zpf-site .zpf-hero__quick-list a:hover {
    background: var(--zpf-bg-page);
    color: var(--zpf-color-primary-600);
  }
}
@media (min-width: 640px) {
  .zpf-site .zpf-hero__expert { display: inline; }
}
@media (min-width: 768px) {
  .zpf-site .zpf-hero__quick-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .zpf-site .zpf-hero__quick-list a { padding-inline: var(--zpf-space-24); }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-hero__layout { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .zpf-site .zpf-hero__copy { grid-column: span 7; }
  .zpf-site .zpf-hero__visual { grid-column: span 5; }
  .zpf-site .zpf-hero__quick-list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 782px) {
  .zpf-site .zpf-hero--admin-toolbar { padding-top: calc(var(--zpf-hero-section-top) + 46px); }
}

/* お困りごと: 囲い枠・縦線・カードを使わず、番号と横の細線で構成する。 */
.zpf-site .zpf-troubles { background-color: var(--zpf-bg-section-soft); }
.zpf-site .zpf-troubles__heading { max-width: var(--zpf-content-max-lead); }
.zpf-site .zpf-troubles__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  list-style: none;
  margin: var(--zpf-space-64) 0 0;
  padding: 0;
  border-top: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-troubles__item {
  display: flex;
  align-items: baseline;
  gap: var(--zpf-space-20);
  margin: 0;
  padding: var(--zpf-space-24) 0;
  border-bottom: var(--zpf-border-width) solid var(--zpf-border-subtle-source-intent);
}
.zpf-site .zpf-troubles__number {
  width: var(--zpf-space-28);
  transition: color 300ms ease;
}
.zpf-site .zpf-troubles__text { min-width: 0; }
.zpf-site .zpf-troubles__title {
  margin: 0;
  font-family: var(--zpf-font-body);
  font-size: var(--zpf-troubles-text-size);
  font-weight: var(--zpf-weight-normal);
  line-height: var(--zpf-line-relaxed);
  letter-spacing: var(--zpf-tracking-tight);
  color: var(--zpf-color-foreground-900);
}
.zpf-site .zpf-troubles__description {
  margin: var(--zpf-space-8) 0 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-troubles__note {
  margin: var(--zpf-space-32) 0 0;
  font-size: var(--zpf-text-sm);
  color: var(--zpf-text-muted);
}
@media (min-width: 768px) {
  .zpf-site .zpf-troubles__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    column-gap: var(--zpf-space-64);
    margin-top: var(--zpf-space-80);
  }
  .zpf-site .zpf-troubles__item {
    gap: var(--zpf-space-28);
    padding-block: var(--zpf-space-32);
  }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-troubles__list { column-gap: var(--zpf-space-112); }
}
@media (hover: hover) {
  .zpf-site .zpf-troubles__item:hover .zpf-troubles__number { color: var(--zpf-color-accent-600); }
}
@media (prefers-reduced-motion: reduce) {
  .zpf-site .zpf-troubles__number { transition: none; }
}

/* サービスのみ。既存ヒーロー・お困りごとのスタイルは保持。 */
.zpf-site .zpf-services { background: var(--zpf-bg-page); }
.zpf-site .zpf-services__heading { max-width: var(--zpf-content-max-lead); }
.zpf-site .zpf-services__list {
  margin-top: var(--zpf-space-56);
  border-top: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-services__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: var(--zpf-space-32);
  padding-block: var(--zpf-service-row-space);
  border-bottom: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-services__copy { min-width: 0; }
.zpf-site .zpf-services__title-row {
  display: flex;
  align-items: baseline;
  gap: var(--zpf-space-20);
  margin-bottom: var(--zpf-space-16);
}
.zpf-site .zpf-services__number {
  flex-shrink: 0;
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-service-number-size);
  font-weight: var(--zpf-weight-semibold);
  line-height: var(--zpf-service-number-line);
  font-variant-numeric: tabular-nums;
  color: var(--zpf-service-number-color);
}
.zpf-site .zpf-services__title {
  margin: 0;
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-service-title-size);
  font-weight: var(--zpf-weight-bold);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-services__description {
  max-width: var(--zpf-content-max-lead);
  margin: 0 0 var(--zpf-space-24);
  color: var(--zpf-text-description);
  line-height: var(--zpf-line-relaxed);
}
.zpf-site .zpf-services__items {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: var(--zpf-space-32);
  max-width: var(--zpf-content-max-lead);
  list-style: none;
  margin: 0;
  padding: 0;
}
.zpf-site .zpf-services__items li {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-12);
  margin: 0;
  padding: var(--zpf-space-12) 0;
  border-top: var(--zpf-border-width) solid var(--zpf-border-subtle);
  font-size: var(--zpf-text-sm);
  color: var(--zpf-text-body);
}
.zpf-site .zpf-services__dot {
  flex-shrink: 0;
  width: var(--zpf-space-6);
  height: var(--zpf-space-6);
  border-radius: var(--zpf-radius-circle);
  background: var(--zpf-color-accent-500);
}
.zpf-site .zpf-services__media {
  min-width: 0;
  width: 100%;
  height: 230px; /* 原本固定値。既存トークンに画像高さなし */
  overflow: hidden;
  border-radius: var(--zpf-radius-none);
  background: var(--zpf-bg-image-placeholder);
}
.zpf-site .zpf-services__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.zpf-site .zpf-services__detail {
  display: inline-block;
  margin-top: var(--zpf-space-24);
  font-size: var(--zpf-text-sm);
}
@media (min-width: 640px) {
  .zpf-site .zpf-services__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .zpf-site .zpf-services__list { margin-top: var(--zpf-space-80); }
  .zpf-site .zpf-services__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zpf-site .zpf-services__media { height: 310px; /* 原本固定値 */ }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-services__row {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--zpf-space-56);
  }
  /* 原本の1段目は写真左／文章右、2段目は文章左／写真右。 */
  .zpf-site .zpf-services__media { grid-column: 1 / span 5; grid-row: 1; }
  .zpf-site .zpf-services__copy { grid-column: 6 / span 7; grid-row: 1; }
  .zpf-site .zpf-services__row--reversed .zpf-services__copy { grid-column: 1 / span 7; }
  .zpf-site .zpf-services__row--reversed .zpf-services__media { grid-column: 8 / span 5; }
}

/* 事務所ITインフラのみ。写真と濃色パネルの対比、囲いすぎない細線。 */
.zpf-site .zpf-infra { background: var(--zpf-bg-page); }
.zpf-site .zpf-infra__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: var(--zpf-space-32);
}
.zpf-site .zpf-infra__media {
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 440px; /* 原本のmin-heightが320px指定より優先される */
  overflow: hidden;
  border-radius: var(--zpf-radius-none);
  background: var(--zpf-bg-image-placeholder);
}
.zpf-site .zpf-infra__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.zpf-site .zpf-infra__panel {
  min-width: 0;
  padding: var(--zpf-space-48) var(--zpf-space-24);
  border-radius: var(--zpf-radius-none);
  background: var(--zpf-bg-infra);
  color: var(--zpf-color-background-50);
}
.zpf-site .zpf-infra__label {
  margin: 0;
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label);
  letter-spacing: var(--zpf-tracking-label);
  color: oklch(var(--zpf-oklch-background-50) / 0.5);
}
.zpf-site .zpf-infra__equipment-label { margin-top: var(--zpf-space-40); }
.zpf-site .zpf-infra__items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--zpf-space-16);
  list-style: none;
  margin: var(--zpf-space-16) 0 0;
  padding: 0;
  border-top: var(--zpf-border-width) solid var(--zpf-border-on-dark);
}
.zpf-site .zpf-infra__items li {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-10);
  margin: 0;
  padding: var(--zpf-space-16) 0;
  border-bottom: var(--zpf-border-width) solid var(--zpf-border-on-dark);
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-snug);
  color: oklch(var(--zpf-oklch-background-50) / 0.9);
}
/* アイコン外部CSSは未導入。原本のアイコン名を保持し、暫定はシアンの小さい印。 */
.zpf-site .zpf-infra__item-mark {
  flex-shrink: 0;
  width: var(--zpf-space-6);
  height: var(--zpf-space-6);
  background: var(--zpf-color-accent-300);
}
.zpf-site .zpf-infra__scenes {
  margin-top: var(--zpf-space-48);
  padding-top: var(--zpf-space-32);
  border-top: var(--zpf-border-width) solid var(--zpf-border-on-dark);
}
.zpf-site .zpf-infra__scene-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--zpf-space-24);
  margin-top: var(--zpf-space-24);
}
.zpf-site .zpf-infra__scene-title {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-8);
  margin: 0 0 var(--zpf-space-10);
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-text-sm);
  font-weight: var(--zpf-weight-semibold);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-color-background-50);
}
.zpf-site .zpf-infra__scene-title span {
  flex-shrink: 0;
  width: var(--zpf-space-6);
  height: var(--zpf-space-6);
  background: var(--zpf-color-accent-400);
}
.zpf-site .zpf-infra__scene-description {
  margin: 0;
  font-size: var(--zpf-text-infra-description);
  line-height: var(--zpf-line-relaxed);
  color: oklch(var(--zpf-oklch-background-50) / 0.7);
}
.zpf-site .zpf-infra__closing {
  display: flex;
  align-items: center;
  gap: var(--zpf-space-8);
  margin: var(--zpf-space-40) 0 0;
  font-size: var(--zpf-text-sm);
  color: var(--zpf-color-background-50);
}
.zpf-site .zpf-infra__closing span { color: var(--zpf-color-accent-300); }
@media (min-width: 768px) {
  .zpf-site .zpf-infra__layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zpf-site .zpf-infra__panel { padding: var(--zpf-space-64) var(--zpf-space-48); }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-infra__layout { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--zpf-space-48); }
  .zpf-site .zpf-infra__media { grid-column: span 5; }
  .zpf-site .zpf-infra__panel { grid-column: span 7; }
  .zpf-site .zpf-infra__items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .zpf-site .zpf-infra__scene-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zpf-space-32); }
}

/* 選ばれる理由のみ。原本のSPEED / RELIABILITYと番号・細線・余白。 */
.zpf-site .zpf-reasons { background: var(--zpf-bg-section-soft); }
.zpf-site .zpf-reasons__heading { max-width: var(--zpf-content-max-lead); }
.zpf-site .zpf-reasons__groups {
  display: grid;
  gap: var(--zpf-space-56);
  margin-top: var(--zpf-space-64);
}
.zpf-site .zpf-reasons__group-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--zpf-space-8) var(--zpf-space-20);
  border-top: var(--zpf-border-width) solid var(--zpf-border-heading);
  padding-top: var(--zpf-space-20);
  margin-bottom: var(--zpf-space-8);
}
.zpf-site .zpf-reasons__label {
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label);
  letter-spacing: var(--zpf-tracking-label);
  color: var(--zpf-text-label);
}
.zpf-site .zpf-reasons__group-title {
  margin: 0;
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-reasons-group-title-size);
  font-weight: var(--zpf-weight-bold);
  letter-spacing: var(--zpf-tracking-tight);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-reasons__caption {
  flex-basis: 100%;
  margin: var(--zpf-space-4) 0 0;
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-muted);
}
.zpf-site .zpf-reasons__items {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  list-style: none;
  margin: 0;
  padding: 0;
}
.zpf-site .zpf-reasons__item {
  display: flex;
  align-items: baseline;
  gap: var(--zpf-space-20);
  margin: 0;
  padding: var(--zpf-space-24) 0;
  border-bottom: var(--zpf-border-width) solid var(--zpf-border-subtle-source-intent);
}
.zpf-site .zpf-reasons__number {
  width: var(--zpf-space-28);
  transition: color 300ms ease;
}
.zpf-site .zpf-reasons__text { min-width: 0; }
.zpf-site .zpf-reasons__item-title {
  margin: 0 0 var(--zpf-space-8);
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-reasons-item-title-size);
  font-weight: var(--zpf-weight-semibold);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-reasons__description {
  margin: 0;
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
@media (min-width: 768px) {
  .zpf-site .zpf-reasons__groups { gap: var(--zpf-space-80); margin-top: var(--zpf-space-80); }
  .zpf-site .zpf-reasons__caption { flex-basis: auto; margin: 0; }
  .zpf-site .zpf-reasons__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    column-gap: var(--zpf-space-56);
  }
  .zpf-site .zpf-reasons__item { gap: var(--zpf-space-28); padding-block: var(--zpf-space-28); }
  .zpf-site .zpf-reasons__description { font-size: var(--zpf-text-sm); }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-reasons__items { column-gap: var(--zpf-space-96); }
}
@media (hover: hover) {
  .zpf-site .zpf-reasons__item:hover .zpf-reasons__number { color: var(--zpf-color-accent-600); }
}
@media (prefers-reduced-motion: reduce) {
  .zpf-site .zpf-reasons__number { transition: none; }
}

/* ご相談の流れのみ。囲いカードを使わず、ステップ番号と上罫線で構成。 */
.zpf-site .zpf-flow { background: var(--zpf-bg-page); }
.zpf-site .zpf-flow__heading { max-width: var(--zpf-content-max-lead); }
.zpf-site .zpf-flow__steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--zpf-space-40) var(--zpf-space-28);
  list-style: none;
  margin: var(--zpf-space-56) 0 0;
  padding: 0;
}
.zpf-site .zpf-flow__step {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: var(--zpf-space-24) 0 0;
  border-top: var(--zpf-border-width) solid var(--zpf-border-heading);
}
.zpf-site .zpf-flow__step::before {
  content: '';
  position: absolute;
  top: -3px; /* 原本の線上マーカー位置 */
  left: 0;
  width: var(--zpf-space-6);
  height: var(--zpf-space-6);
  background: var(--zpf-color-primary-500);
}
.zpf-site .zpf-flow__number { font-size: var(--zpf-text-xs); }
.zpf-site .zpf-flow__title {
  margin: var(--zpf-space-12) 0 var(--zpf-space-8);
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-text-lead);
  font-weight: var(--zpf-weight-semibold);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-flow__description {
  margin: 0;
  font-size: var(--zpf-text-caption);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-flow__closing {
  margin-top: var(--zpf-space-48);
  padding-top: var(--zpf-space-24);
  border-top: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-flow__closing p {
  margin: 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-flow__break { display: none; }
@media (min-width: 768px) {
  .zpf-site .zpf-flow__steps {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: var(--zpf-space-80);
  }
  .zpf-site .zpf-flow__closing { margin-top: var(--zpf-space-64); }
  .zpf-site .zpf-flow__break { display: inline; }
}

/* 会社の姿勢・理念のみ。写真・共通見出し・引用文の原本構成。 */
.zpf-site .zpf-philosophy {
  background-color: var(--zpf-bg-section-soft);
  background-image:
    linear-gradient(to right, var(--zpf-grid-line-color) var(--zpf-grid-line-width), transparent var(--zpf-grid-line-width)),
    linear-gradient(to bottom, var(--zpf-grid-line-color) var(--zpf-grid-line-width), transparent var(--zpf-grid-line-width));
  background-size: var(--zpf-grid-cell) var(--zpf-grid-cell);
}
.zpf-site .zpf-philosophy__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: var(--zpf-space-40);
}
.zpf-site .zpf-philosophy__media {
  width: 100%;
  min-width: 0;
  height: 340px; /* 原本固定値。写真専用トークンは未定義 */
  overflow: hidden;
  border-radius: var(--zpf-radius-none);
  background: var(--zpf-color-background-200);
}
.zpf-site .zpf-philosophy__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.zpf-site .zpf-philosophy__copy { min-width: 0; }
.zpf-site .zpf-philosophy__heading .zpf-section-heading__title br { display: none; }
/* Cocoonの引用装飾をこの引用文だけ解除し、原本の左線だけを残す。 */
.zpf-site .zpf-philosophy__quote {
  margin: var(--zpf-space-32) 0 0;
  padding: 0 0 0 var(--zpf-space-24);
  border: 0;
  border-left: var(--zpf-border-width-emphasis) solid var(--zpf-color-primary-500);
  border-radius: var(--zpf-radius-none);
  background: transparent;
  box-shadow: none;
}
.zpf-site .zpf-philosophy__quote::before,
.zpf-site .zpf-philosophy__quote::after { content: none; }
.zpf-site .zpf-philosophy__quote p {
  margin: 0;
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-philosophy-quote-size);
  font-weight: var(--zpf-weight-normal);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-philosophy__quote br { display: none; }
.zpf-site .zpf-philosophy__note {
  max-width: var(--zpf-content-max-short);
  margin: var(--zpf-space-28) 0 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-muted);
}
@media (min-width: 640px) {
  .zpf-site .zpf-philosophy__quote br { display: inline; }
}
@media (min-width: 768px) {
  .zpf-site .zpf-philosophy__media { height: 520px; /* 原本固定値 */ }
  .zpf-site .zpf-philosophy__heading .zpf-section-heading__title br { display: inline; }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-philosophy__layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--zpf-space-56);
  }
}

/* 対応シーン・実績のみ。原本の写真・タグ・見出し・説明文。囲いカードなし。 */
.zpf-site .zpf-scenes { background: var(--zpf-bg-page); }
.zpf-site .zpf-scenes__heading { max-width: var(--zpf-content-max-lead); }
.zpf-site .zpf-scenes__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--zpf-space-48) var(--zpf-space-32);
  margin-top: var(--zpf-space-56);
}
.zpf-site .zpf-scenes__item { min-width: 0; }
.zpf-site .zpf-scenes__media {
  width: 100%;
  height: 240px; /* 原本の写真高さ。既存トークンに専用値なし */
  overflow: hidden;
  border-radius: var(--zpf-radius-none);
  background: var(--zpf-bg-image-placeholder);
}
.zpf-site .zpf-scenes__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: transform 700ms ease-out;
}
.zpf-site .zpf-scenes__copy {
  margin-top: var(--zpf-space-20);
  padding-top: var(--zpf-space-20);
  border-top: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-scenes__tag {
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-label);
  letter-spacing: var(--zpf-tracking-index);
  color: var(--zpf-text-label);
}
.zpf-site .zpf-scenes__title {
  margin: var(--zpf-space-12) 0;
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-text-base);
  font-weight: var(--zpf-weight-semibold);
  line-height: var(--zpf-line-snug);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-scenes__description {
  margin: 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
@media (min-width: 768px) {
  .zpf-site .zpf-scenes__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .zpf-site .zpf-scenes__media { height: 320px; /* 原本固定値 */ }
}
@media (hover: hover) {
  .zpf-site .zpf-scenes__item:hover .zpf-scenes__media img { transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  .zpf-site .zpf-scenes__media img { transition: none; }
  .zpf-site .zpf-scenes__item:hover .zpf-scenes__media img { transform: none; }
}

/* FAQのみ。ネイティブdetailsで開閉し、原本の細線・余白を保持する。 */
.zpf-site .zpf-faq { background: var(--zpf-bg-section-soft); }
.zpf-site .zpf-faq__container { max-width: var(--zpf-content-max-faq); }
.zpf-site .zpf-faq__list {
  margin-top: var(--zpf-space-48);
  border-top: var(--zpf-border-width) solid var(--zpf-border-standard);
}
.zpf-site .zpf-faq__item {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: var(--zpf-border-width) solid var(--zpf-border-standard);
  border-radius: var(--zpf-radius-none);
  background: transparent;
  box-shadow: none;
}
.zpf-site .zpf-faq__question {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--zpf-space-20);
  margin: 0;
  padding: var(--zpf-space-24) 0;
  border: 0;
  background: transparent;
  list-style: none;
  text-align: left;
  cursor: pointer;
}
.zpf-site .zpf-faq__question::-webkit-details-marker { display: none; }
.zpf-site .zpf-faq__question::marker { content: ''; }
.zpf-site .zpf-faq__question::before,
.zpf-site .zpf-faq__question::after { content: none; }
.zpf-site .zpf-faq__question:focus-visible {
  outline: var(--zpf-border-width-emphasis) solid var(--zpf-color-primary-500);
  outline-offset: var(--zpf-space-4);
}
.zpf-site .zpf-faq__question-copy {
  display: flex;
  align-items: flex-start;
  gap: var(--zpf-space-16);
  min-width: 0;
}
.zpf-site .zpf-faq__q,
.zpf-site .zpf-faq__a {
  flex-shrink: 0;
  margin-top: var(--zpf-space-2);
  font-family: var(--zpf-font-label);
  font-size: var(--zpf-text-sm);
  font-weight: var(--zpf-weight-semibold);
}
.zpf-site .zpf-faq__q { color: var(--zpf-color-primary-500); }
.zpf-site .zpf-faq__a { color: var(--zpf-color-foreground-400); }
.zpf-site .zpf-faq__question-text {
  font-family: var(--zpf-font-heading);
  font-size: var(--zpf-text-lead);
  font-weight: var(--zpf-weight-medium);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-strong);
}
.zpf-site .zpf-faq__toggle {
  position: relative;
  flex-shrink: 0;
  width: var(--zpf-space-20);
  height: var(--zpf-space-20);
  color: var(--zpf-color-foreground-400);
  transition: transform 300ms ease;
}
.zpf-site .zpf-faq__toggle::before,
.zpf-site .zpf-faq__toggle::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--zpf-space-12);
  height: var(--zpf-border-width);
  background: currentColor;
  transform: translate(-50%, -50%);
}
.zpf-site .zpf-faq__toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.zpf-site .zpf-faq__item[open] .zpf-faq__toggle { transform: rotate(45deg); }
.zpf-site .zpf-faq__answer {
  display: flex;
  align-items: flex-start;
  gap: var(--zpf-space-16);
  padding-bottom: var(--zpf-space-24);
}
.zpf-site .zpf-faq__answer p {
  margin: 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-description);
}
@media (min-width: 768px) {
  .zpf-site .zpf-faq__question-text { font-size: var(--zpf-text-base); }
}
@media (prefers-reduced-motion: reduce) {
  .zpf-site .zpf-faq__toggle { transition: none; }
}

/* お問い合わせ表示専用。外観のみで送信・状態切替は未実装。 */
.zpf-site .zpf-contact { background: var(--zpf-bg-page); }
.zpf-site .zpf-contact__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--zpf-space-40);
}
.zpf-site .zpf-contact__intro,
.zpf-site .zpf-contact__panel { min-width: 0; }
.zpf-site .zpf-contact__points {
  display: grid;
  gap: var(--zpf-space-16);
  list-style: none;
  margin: var(--zpf-space-36) 0 0;
  padding: 0;
}
.zpf-site .zpf-contact__points li {
  display: flex;
  align-items: flex-start;
  gap: var(--zpf-space-16);
  margin: 0;
  padding: 0;
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-relaxed);
  color: var(--zpf-text-body);
}
.zpf-site .zpf-contact__points li > span:last-child { padding-top: var(--zpf-space-6); }
.zpf-site .zpf-contact__point-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--zpf-space-36);
  height: var(--zpf-space-36);
  border: var(--zpf-border-width) solid var(--zpf-border-standard);
  color: var(--zpf-color-primary-500);
}
.zpf-site .zpf-contact__panel {
  background: var(--zpf-bg-section-soft);
  border: var(--zpf-border-width) solid var(--zpf-border-subtle-source-intent);
  padding: var(--zpf-space-24);
}
.zpf-site .zpf-contact__preview { display: grid; gap: var(--zpf-space-20); }
.zpf-site .zpf-contact__preview-note {
  margin: 0;
  font-size: var(--zpf-text-sm);
  color: var(--zpf-text-description);
}
.zpf-site .zpf-contact__field-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--zpf-space-20); }
.zpf-site .zpf-contact__label {
  display: block;
  margin-bottom: var(--zpf-space-8);
  font-size: var(--zpf-text-caption);
  font-weight: var(--zpf-weight-normal);
  color: var(--zpf-text-body);
}
.zpf-site .zpf-contact__required { color: var(--zpf-color-accent-600); }
.zpf-site .zpf-contact__input {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  border: var(--zpf-border-width) solid var(--zpf-border-standard);
  border-radius: var(--zpf-radius-small);
  background: var(--zpf-bg-page);
  padding: var(--zpf-space-12) var(--zpf-space-16);
  font-family: var(--zpf-font-body);
  font-size: var(--zpf-text-sm);
  line-height: var(--zpf-line-sm);
  color: var(--zpf-color-foreground-900);
}
.zpf-site .zpf-contact__input::placeholder { color: var(--zpf-color-foreground-400); opacity: 1; }
.zpf-site .zpf-contact__input:focus {
  border-color: var(--zpf-color-primary-500);
  box-shadow: 0 0 0 var(--zpf-border-width-emphasis) var(--zpf-color-primary-100);
}
.zpf-site .zpf-contact__message { resize: none; }
.zpf-site .zpf-contact__submit-area { padding-top: var(--zpf-space-4); }
.zpf-site .zpf-contact__submit { width: 100%; padding: var(--zpf-space-14) var(--zpf-space-32); }
.zpf-site .zpf-contact__privacy {
  margin: var(--zpf-space-12) 0 0;
  font-size: var(--zpf-text-xs);
  color: var(--zpf-color-foreground-400);
}
@media (min-width: 640px) {
  .zpf-site .zpf-contact__field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zpf-site .zpf-contact__submit { width: auto; }
}
@media (min-width: 768px) {
  .zpf-site .zpf-contact__panel { padding: var(--zpf-space-36); }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-contact__layout { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--zpf-space-64); }
  .zpf-site .zpf-contact__intro { grid-column: span 5; }
  .zpf-site .zpf-contact__panel { grid-column: span 7; }
}


/* CTA: 原本の写真・濃色グラデーション・中央配置。既存セクションには適用しない。 */
.zpf-site .zpf-cta { position: relative; overflow: hidden; background: var(--zpf-color-primary-900); }
.zpf-site .zpf-cta__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: var(--zpf-radius-none); }
.zpf-site .zpf-cta__overlay {
  position: absolute; inset: 0;
  /* 原本の /94・/91 の不透明度意図を保持。Tailwind出力との実描画比較は別工程。 */
  background: linear-gradient(to bottom right, oklch(var(--zpf-oklch-primary-900) / 0.94), oklch(var(--zpf-oklch-primary-800) / 0.91), oklch(var(--zpf-oklch-primary-950) / 0.94));
}
.zpf-site .zpf-cta__content { position: relative; max-width: var(--zpf-content-max-cta); margin-inline: auto; padding: var(--zpf-section-space) var(--zpf-gutter); text-align: center; }
.zpf-site .zpf-cta__label { margin: 0 0 var(--zpf-space-20); font-family: var(--zpf-font-label); font-size: var(--zpf-text-label); letter-spacing: var(--zpf-tracking-label); color: oklch(var(--zpf-oklch-background-50) / 0.6); }
.zpf-site .zpf-cta__title { margin: 0 0 var(--zpf-space-24); font-family: var(--zpf-font-heading); font-size: var(--zpf-cta-title-size); font-weight: var(--zpf-weight-bold); line-height: var(--zpf-section-title-line); letter-spacing: var(--zpf-tracking-tight); color: var(--zpf-color-background-50); }
.zpf-site .zpf-cta__rule { width: var(--zpf-space-40); height: var(--zpf-border-width); margin: 0 auto var(--zpf-space-24); background: var(--zpf-color-accent-300); }
.zpf-site .zpf-cta__description { max-width: var(--zpf-content-max-short); margin: 0 auto var(--zpf-space-40); font-size: var(--zpf-text-sm); line-height: var(--zpf-line-relaxed); color: oklch(var(--zpf-oklch-background-50) / 0.8); }
.zpf-site .zpf-cta__actions { display: flex; flex-direction: column; justify-content: center; gap: var(--zpf-space-16); }
.zpf-site .zpf-cta__button { display: inline-flex; align-items: center; justify-content: center; gap: var(--zpf-space-8); padding: var(--zpf-space-16) var(--zpf-space-36); border-radius: var(--zpf-radius-small); font-size: var(--zpf-text-sm); font-weight: var(--zpf-weight-medium); line-height: var(--zpf-line-sm); text-decoration: none; white-space: nowrap; }
.zpf-site .zpf-cta__button--light { border: var(--zpf-border-width) solid transparent; background: var(--zpf-color-background-50); color: var(--zpf-color-primary-800); }
.zpf-site .zpf-cta__button--light:hover { background: var(--zpf-color-background-100); color: var(--zpf-color-primary-800); }
.zpf-site .zpf-cta__button--outline { border: var(--zpf-border-width) solid oklch(var(--zpf-oklch-background-50) / 0.4); background: transparent; color: var(--zpf-color-background-50); }
.zpf-site .zpf-cta__button--outline:hover { background: oklch(var(--zpf-oklch-background-50) / 0.1); color: var(--zpf-color-background-50); }
.zpf-site .zpf-cta__icon { width: var(--zpf-space-16); height: var(--zpf-space-16); flex-shrink: 0; }
.zpf-site .zpf-cta__note { margin: var(--zpf-space-32) 0 0; font-size: var(--zpf-text-xs); line-height: var(--zpf-line-xs); color: oklch(var(--zpf-oklch-background-50) / 0.5); }
@media (min-width: 640px) {
  .zpf-site .zpf-cta__actions { flex-direction: row; }
}
@media (min-width: 768px) {
  .zpf-site .zpf-cta__description { font-size: var(--zpf-text-base); }
}


/* 会社概要: 共通見出しと定義リスト。原本の4:8配置・細線・背景を保持。 */
.zpf-site .zpf-company { background-color: var(--zpf-bg-section-soft); }
.zpf-site .zpf-company__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--zpf-space-40); }
.zpf-site .zpf-company__heading { min-width: 0; }
.zpf-site .zpf-company__details { min-width: 0; margin: 0; padding: 0; border-top: var(--zpf-border-width) solid var(--zpf-border-standard); }
.zpf-site .zpf-company__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--zpf-space-8); padding-block: var(--zpf-space-20); border-bottom: var(--zpf-border-width) solid var(--zpf-border-subtle-source-intent); }
.zpf-site .zpf-company__term { margin: 0; font-family: var(--zpf-font-heading); font-size: var(--zpf-text-sm); font-weight: var(--zpf-weight-medium); color: var(--zpf-text-strong); }
.zpf-site .zpf-company__value { min-width: 0; margin: 0; font-size: var(--zpf-text-sm); color: var(--zpf-text-body); line-height: var(--zpf-line-relaxed); }
.zpf-site .zpf-company__business { margin: 0; padding: 0; list-style: none; }
.zpf-site .zpf-company__business-item { display: flex; align-items: flex-start; gap: var(--zpf-space-8); margin: 0; padding: 0; }
.zpf-site .zpf-company__business-item + .zpf-company__business-item { margin-top: var(--zpf-space-8); }
.zpf-site .zpf-company__dot { width: var(--zpf-space-6); height: var(--zpf-space-6); margin-top: var(--zpf-space-8); flex-shrink: 0; border-radius: var(--zpf-radius-circle); background-color: var(--zpf-color-primary-400); }
@media (min-width: 640px) {
  .zpf-site .zpf-company__row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zpf-space-24); }
  .zpf-site .zpf-company__value { grid-column: span 2; }
}
@media (min-width: 1024px) {
  .zpf-site .zpf-company__layout { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--zpf-space-64); }
  .zpf-site .zpf-company__heading { grid-column: span 4; }
  .zpf-site .zpf-company__details { grid-column: span 8; }
}