/*
Theme Name: Cero (Arkhe Child)
Template: arkhe
Description: 株式会社Cero コーポレートサイト用 Arkhe子テーマ。白基調の明るいシック + 濃紺×ロイヤルブルー。
Version: 0.3.0
*/

/* ============================================
   デザイントークン(ここを変えれば全体が変わる)
   ============================================ */
:root {
  /* ベース: 白〜ごく薄いグレー */
  --cero-bg: #ffffff;          /* ページ背景 */
  --cero-bg-alt: #f5f7f8;      /* セクション交互の背景 */
  --cero-surface: #ffffff;     /* カード・パネル */
  --cero-border: #e3e8eb;      /* 罫線 */

  /* 引き締めの濃紺(ダークセクション・フッターに使用) */
  --cero-ink: #1a2740;         /* 濃紺(青みを効かせたネイビー) */
  --cero-ink-soft: #24344f;    /* 濃紺のやや明るい面 */

  /* テキスト */
  --cero-text: #212e3f;        /* 本文(濃紺寄りの黒) */
  --cero-text-muted: #63707f;  /* 補足・キャプション */
  --cero-text-on-dark: #eef1f5;      /* 濃紺セクション上の文字 */
  --cero-text-on-dark-muted: #a9b4c6;

  /* 差し色: ロイヤルブルー(濃紺と同系でまとまる) */
  --cero-accent: #2455bd;      /* リンク・強調・ラベル */
  --cero-accent-strong: #1c449c; /* ボタンなど面で使う時 */
  --cero-accent-light: #8fb3ef;  /* 濃紺背景上でのアクセント */

  /* 余白(シックさは余白で作る) */
  --cero-section-pad: clamp(4rem, 10vw, 8rem);
}

/* ============================================
   全体ベース
   ============================================ */
body {
  background-color: var(--cero-bg);
  color: var(--cero-text);
}

a {
  color: var(--cero-accent);
  transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
  color: var(--cero-accent-strong);
}

:focus-visible {
  outline: 2px solid var(--cero-accent);
  outline-offset: 2px;
}

/* 見出し: 余白広め・トラッキングで格を出す */
h1, h2, h3, h4 {
  color: var(--cero-text);
  letter-spacing: 0.04em;
}

/* ============================================
   ヘッダー / フッター
   ============================================ */
.l-header {
  background-color: rgba(255, 255, 255, 0.95);
  border-bottom: 1px solid var(--cero-border);
}

/* サイト名をロゴタイプ風に(明朝・字間広め・濃紺) */
.c-headLogo {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-weight: 600;
  font-size: 1.3rem;
  letter-spacing: 0.14em;
  color: var(--cero-ink);
  white-space: nowrap;
}

/* スマホ: 字間を詰めて1行に収める */
@media (max-width: 480px) {
  .c-headLogo {
    font-size: 1.05rem;
    letter-spacing: 0.05em;
  }
}

/* コーポレートサイトに検索は不要 */
.l-header__searchBtn {
  display: none;
}

/* グローバルナビ: 日本語は落ち着いた濃紺、英字はブルーの小さなラベル */
.c-gnav .__mainText {
  letter-spacing: 0.1em;
  transition: color 0.2s ease;
}

.c-gnav .__subText {
  color: var(--cero-accent);
  letter-spacing: 0.22em;
  font-size: 0.62rem;
}

.c-gnav__a:hover .__mainText {
  color: var(--cero-accent);
}

/* テーマ標準のタイトル帯(灰色の帯)は視覚的に非表示。
   各ページ内に英字ラベル+明朝見出しを持っているため二重になる。
   h1はSEO・スクリーンリーダー向けに残す */
.p-topArea.-noimg {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
}

/* パンくず: 小さく控えめに */
.p-breadcrumb {
  font-size: 0.78rem;
  padding: 1.4rem 0 0.5rem;
}

.p-breadcrumb__text,
.p-breadcrumb a {
  color: var(--cero-text-muted);
}

.p-breadcrumb a:hover {
  color: var(--cero-accent);
}

/* フッター: 濃紺にゆったりした余白、中央揃えのシンプル構成 */
.l-footer {
  background-color: var(--cero-ink);
  color: var(--cero-text-on-dark-muted);
}

.l-footer a {
  color: var(--cero-text-on-dark);
}

.l-footer__widgets {
  padding: 4.5rem 1.5rem 2rem;
  text-align: center;
}

.l-footer .w-footer h2 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--cero-text-on-dark);
  margin-bottom: 1.2em;
}

.l-footer .w-footer p {
  font-size: 0.85rem;
  line-height: 2.2;
  letter-spacing: 0.08em;
  color: var(--cero-text-on-dark-muted);
}

.l-footer__foot {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.l-footer__nav a {
  font-size: 0.8rem;
  color: var(--cero-text-on-dark-muted);
  letter-spacing: 0.1em;
}

.l-footer__nav a:hover {
  color: var(--cero-text-on-dark);
}

.c-copyright {
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  color: var(--cero-text-on-dark-muted);
  opacity: 0.7;
  margin-top: 1em;
}

/* ============================================
   ボタン
   ============================================ */
/* 主要CTA: 濃紺の直角ボックス + 白文字 + 動く矢印 */
.wp-block-button__link,
.c-btn {
  background-color: var(--cero-ink);
  color: #ffffff;
  border-radius: 0;
  letter-spacing: 0.14em;
  padding: 1.05em 2.8em;
  transition: background-color 0.25s ease, color 0.25s ease,
    box-shadow 0.25s ease, transform 0.25s ease;
}

.wp-block-button__link::after {
  content: "→";
  margin-left: 0.9em;
  color: var(--cero-accent-light);
  display: inline-block;
  transition: transform 0.25s ease;
}

.wp-block-button__link:hover,
.c-btn:hover {
  background-color: var(--cero-ink-soft);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(26, 39, 64, 0.22);
  transform: translateY(-1px);
}

.wp-block-button__link:hover::after {
  transform: translateX(5px);
}

/* 濃紺セクションの上では白い箱に反転 */
.cero-recruit .wp-block-button__link {
  background-color: #ffffff;
  color: var(--cero-ink);
}

.cero-recruit .wp-block-button__link::after {
  color: var(--cero-accent);
}

.cero-recruit .wp-block-button__link:hover {
  background-color: #eef2f7;
  color: var(--cero-ink);
}

/* セカンダリ(旧アウトライン): 箱をやめて「テキスト+矢印」の品あるリンクに
   ※WP本体の .is-style-outline 用CSSに勝つため詳細度を上げている */
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color) {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--cero-border);
  border-radius: 0;
  color: var(--cero-ink);
  padding: 0.6em 0.3em;
  letter-spacing: 0.12em;
}

.wp-block-button.is-style-outline > .wp-block-button__link::after {
  content: "→";
  margin-left: 0.8em;
  color: var(--cero-accent);
  display: inline-block;
  transition: transform 0.25s ease;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color):hover {
  background: transparent;
  color: var(--cero-accent);
  border-bottom-color: var(--cero-accent);
  box-shadow: none;
  transform: none;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover::after {
  transform: translateX(5px);
}

/* ============================================
   カード・パネル
   ============================================ */
.p-postList__item,
.c-card {
  background-color: var(--cero-surface);
  border: 1px solid var(--cero-border);
}

/* テーブル(会社概要などで使用) */
table {
  border-color: var(--cero-border);
}

table th {
  background-color: var(--cero-bg-alt);
  color: var(--cero-text);
}

table td {
  color: var(--cero-text);
}

/* ============================================
   トップページ用セクション
   ============================================ */

/* 英字ラベル(セクション上の小さな見出し) */
.cero-label {
  color: var(--cero-accent);
  font-size: 0.8rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  margin-bottom: 0.5em;
}

/* セクション見出し: 明朝で格を出す */
.cero-heading {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  margin-bottom: 1.5em;
}

/* セクション共通 */
.cero-section {
  padding: var(--cero-section-pad) 1.5rem;
}

.cero-section--alt {
  background-color: var(--cero-bg-alt);
}

.cero-section__inner {
  max-width: 1080px;
  margin: 0 auto;
}

.cero-section__more {
  margin-top: 2.5rem;
}

.cero-page .cero-section__more {
  margin-top: 4rem;
}

/* お知らせバナー: ヒーローの上に置く、控えめな一行 */
.cero-notice {
  background-color: var(--cero-ink);
  padding: 0.7rem 1.5rem;
}

.cero-notice__text {
  max-width: 1080px;
  margin: 0 auto;
  text-align: center;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  color: var(--cero-text-on-dark-muted);
}

.cero-notice__date {
  font-variant-numeric: tabular-nums;
  color: var(--cero-text-on-dark);
  font-weight: 600;
  margin-right: 0.8em;
  letter-spacing: 0.06em;
}

.cero-notice__text a {
  color: var(--cero-accent-light);
  margin-left: 0.6em;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cero-notice__text a:hover {
  color: #ffffff;
}

@media (max-width: 600px) {
  .cero-notice__text {
    font-size: 0.76rem;
  }
  .cero-notice__date {
    display: block;
    margin: 0 0 0.2em;
  }
}

/* ヒーロー: 走るバンの写真に白のグラデーションを重ねる(左は文字用に白く、右は写真を見せる) */
.cero-hero {
  min-height: 80vh;
  display: flex;
  align-items: center;
  padding: 6rem 1.5rem;
  background:
    linear-gradient(100deg,
      rgba(255, 255, 255, 0.96) 0%,
      rgba(255, 255, 255, 0.88) 38%,
      rgba(245, 247, 248, 0.5) 68%,
      rgba(245, 247, 248, 0.18) 100%),
    url(/wp-content/uploads/2026/07/cero-hero-van.jpg) center / cover no-repeat;
  border-bottom: 1px solid var(--cero-border);
}

.cero-hero__inner {
  max-width: 1080px;
  margin: 0 auto;
  width: 100%;
}

.cero-hero__copy {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: clamp(2.4rem, 6vw, 4.2rem);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
  color: var(--cero-ink);
  margin-bottom: 0.8em;
}

.cero-hero__lead {
  color: var(--cero-text-muted);
  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
  line-height: 2.2;
  margin-bottom: 3em;
}

/* 事業カード */
.cero-card {
  background-color: var(--cero-surface);
  border: 1px solid var(--cero-border);
  border-top: 2px solid var(--cero-accent);
  padding: 2.5rem 2rem;
  height: 100%;
  box-shadow: 0 1px 3px rgba(29, 43, 53, 0.06);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.cero-card:hover {
  box-shadow: 0 10px 28px rgba(26, 39, 64, 0.1);
  transform: translateY(-3px);
}

/* カード上部の写真(カードの余白を突き抜けて端まで表示) */
.cero-card .cero-card__img {
  margin: -2.5rem -2rem 1.8rem;
}

.cero-card .cero-card__img img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  filter: saturate(0.88) contrast(1.03);
}

/* ビジョン: ページ内で唯一の中央揃え「宣言」ブロック */
.cero-vision {
  text-align: center;
  padding: 2.5rem 0 3.5rem;
}

.cero-vision .cero-label {
  letter-spacing: 0.35em;
}

.cero-vision__copy {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: clamp(1.7rem, 3.5vw, 2.4rem);
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--cero-ink);
  margin: 0.6em 0 1.8em;
}

.cero-vision__body {
  text-align: left;
  max-width: 34em;
  margin-left: auto;
  margin-right: auto;
  color: var(--cero-text-muted);
}

/* 写真×テキストの2カラム(雑誌風の交互配置) */
.cero-media {
  margin: 4rem 0;
  align-items: center;
  grid-template-columns: 46% 1fr;
  gap: 0 3rem;
}

.cero-media.has-media-on-the-right {
  grid-template-columns: 1fr 46%;
}

.cero-media .wp-block-media-text__media {
  position: relative;
}

/* 写真の後ろに薄青の面をずらして敷く(額装効果) */
.cero-media .wp-block-media-text__media::after {
  content: "";
  position: absolute;
  inset: 14px -14px -14px 14px;
  background-color: rgba(36, 85, 189, 0.06);
  z-index: -1;
}

.cero-media.has-media-on-the-right .wp-block-media-text__media::after {
  inset: 14px 14px -14px -14px;
}

.cero-media .wp-block-media-text__media img {
  width: 100%;
  height: 340px;
  object-fit: cover;
  filter: saturate(0.88) contrast(1.03);
}

/* 事業見出し: 青線をやめて英字ラベル+明朝に格上げ */
.cero-media .cero-label {
  margin-bottom: 0.2em;
}

.cero-page .cero-media h3 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: 1.5rem;
  border-left: none;
  padding-left: 0;
  margin-top: 0.3em;
  margin-bottom: 1em;
  letter-spacing: 0.12em;
}

/* デスクトップでは本文幅から少しはみ出させて編集デザインに */
@media (min-width: 1100px) {
  .cero-media {
    margin-inline: -5em;
  }
}

@media (max-width: 600px) {
  .cero-media {
    gap: 1.5rem 0;
  }

  .cero-media .wp-block-media-text__media img {
    height: 220px;
  }
}

/* 写真つきタイトル帯(アイキャッチ設定時): 紺オーバーレイ+白の明朝 */
.p-topArea:not(.-noimg) {
  position: relative;
  min-height: clamp(240px, 32vh, 340px);
  display: flex;
  align-items: center;
}

.p-topArea:not(.-noimg)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(26, 39, 64, 0.5);
  z-index: 1;
}

.p-topArea:not(.-noimg) .p-topArea__body {
  position: relative;
  z-index: 2;
  width: 100%;
}

.p-topArea:not(.-noimg) .c-pageTitle__main {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: clamp(1.7rem, 4vw, 2.3rem);
  font-weight: 600;
  letter-spacing: 0.22em;
  color: #ffffff;
  text-shadow: 0 1px 10px rgba(26, 39, 64, 0.45);
}

/* 下層ページの横長写真 */
.cero-figure {
  margin: 3rem 0 3.5rem;
}

.cero-figure img {
  display: block;
  width: 100%;
  height: 320px;
  object-fit: cover;
}

@media (max-width: 600px) {
  .cero-figure img {
    height: 200px;
  }
}

.cero-card h3 {
  font-size: 1.25rem;
  letter-spacing: 0.1em;
  margin-bottom: 1em;
}

.cero-card p {
  color: var(--cero-text-muted);
  line-height: 2;
}

/* 代表メッセージ */
.cero-message__quote {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: clamp(1.1rem, 2vw, 1.4rem);
  line-height: 2.4;
  max-width: 40em;
  border-left: 2px solid var(--cero-accent);
  padding-left: 1.5em;
}

.cero-message__name {
  color: var(--cero-text-muted);
  margin-top: 2em;
  letter-spacing: 0.15em;
}

/* 下層ページ共通(幅を絞って読みやすく) */
.cero-page {
  max-width: 46em;
  margin: 0 auto;
  padding: 3.5rem 0 7rem;
}

.cero-page p {
  line-height: 2.2;
}

.cero-page .cero-heading {
  margin-bottom: 2em;
}

/* 下層ページの中見出し: 細いブルーの縦線で品よく。
   セクションの切れ目としてたっぷり空ける */
.cero-page h3 {
  margin-top: 5.5em;
  margin-bottom: 1.4em;
  padding-left: 0.7em;
  border-left: 3px solid var(--cero-accent);
  letter-spacing: 0.08em;
}

/* 最初のセクション見出しだけは詰める(大見出し直後のため) */
.cero-page .cero-heading + h3 {
  margin-top: 0;
}

/* セクション用の英字ラベル(番号つき): 章の切れ目としてたっぷり空ける */
.cero-page .cero-sec-label {
  margin-top: 5.5em;
  margin-bottom: 0.3em;
}

/* 英字ラベル+明朝のセクション見出し(青線なし) */
.cero-page h3.cero-h {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: 1.5rem;
  border-left: none;
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 1.4em;
  letter-spacing: 0.12em;
}

.cero-page h4 {
  letter-spacing: 0.08em;
}

.cero-page .cero-cards {
  margin-top: 2.8rem;
  gap: 2.5rem;
}

/* 下層ページの小カード: 箱をやめて細い罫線+テキストの静かなリストに */
.cero-page .cero-card {
  background: transparent;
  border: none;
  border-top: 1px solid var(--cero-ink);
  box-shadow: none;
  padding: 1.4rem 0 0;
}

.cero-page .cero-card:hover {
  box-shadow: none;
  transform: none;
}

.cero-page .cero-card h4 {
  font-size: 1rem;
  letter-spacing: 0.12em;
  margin-bottom: 0.8em;
}

.cero-page .cero-card p {
  font-size: 0.88rem;
  line-height: 2;
  color: var(--cero-text-muted);
}

/* 社長挨拶ページ(読み物ページ) */
.cero-message-page {
  max-width: 42em;
  margin: 0 auto;
  padding: 2rem 0 4rem;
}

.cero-message-page p {
  line-height: 2.2;
}

.cero-message-page .cero-message__quote {
  margin: 2em 0 3em;
}

.cero-message-page .cero-message__sign {
  margin-top: 4em;
  letter-spacing: 0.1em;
}

/* 採用バナー: 東京の夕景に濃紺を重ねて引き締める */
.cero-recruit {
  padding: var(--cero-section-pad) 1.5rem;
  background:
    linear-gradient(rgba(26, 39, 64, 0.82), rgba(26, 39, 64, 0.82)),
    url(/wp-content/uploads/2026/07/cero-recruit-tokyo.jpg) center / cover no-repeat;
}

.cero-recruit .cero-label {
  color: var(--cero-accent-light);
}

.cero-recruit .cero-heading {
  color: var(--cero-text-on-dark);
}

.cero-recruit p {
  color: var(--cero-text-on-dark-muted);
  line-height: 2;
  margin-bottom: 2.5em;
}

/* お問い合わせCTA */
.cero-cta {
  padding: var(--cero-section-pad) 1.5rem;
  background-color: var(--cero-bg-alt);
  border-top: 1px solid var(--cero-border);
  text-align: center;
}

.cero-cta p {
  color: var(--cero-text-muted);
  margin-bottom: 2.5em;
}

.cero-cta .wp-block-buttons {
  justify-content: center;
}

/* 1日のスケジュール(採用ページ): 時刻を主役にした明朝の数字 */
.cero-page .cero-card .cero-time {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--cero-ink);
  margin-bottom: 0.6em;
}

.cero-page .cero-card p strong {
  color: var(--cero-text);
  letter-spacing: 0.06em;
}

/* 会社概要テーブル: 罫線は細く、余白はたっぷり */
.cero-table table {
  border-collapse: collapse;
  width: 100%;
  border: none;
  border-top: 1px solid var(--cero-border);
}

.cero-table {
  /* Arkheがセル余白を!importantで強制しているため、変数側で上書きする */
  --ark-padding--cell: 1.8em 0.5em;
}

.cero-table td {
  border: none;
  border-bottom: 1px solid var(--cero-border);
  vertical-align: top;
}

/* ラベル列: 小さく・薄く・字間を開けて上品に */
.cero-table tr td:first-child {
  color: var(--cero-text-muted);
  font-size: 0.8rem;
  letter-spacing: 0.25em;
  line-height: 2.2;
  white-space: nowrap;
  width: 11em;
}

/* 値の列: ゆったりした字間 */
.cero-table tr td:last-child {
  letter-spacing: 0.06em;
  line-height: 1.9;
}

/* ============================================
   お問い合わせフォーム(Contact Form 7)
   ============================================ */
.wpcf7 {
  max-width: 40em;
  margin: 2.5rem auto 0;
}

/* 項目ラベル: 小さく濃紺で品よく */
.wpcf7 form > label {
  display: block;
  margin-bottom: 2rem;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--cero-ink);
}

/* 必須マーク: 赤ではなくブルーの小さなタグ */
.wpcf7 .text-danger {
  color: var(--cero-accent);
  font-size: 0.72rem;
  font-weight: 500;
  margin-left: 0.3em;
}

/* 入力欄: 薄いグレーの面、フォーカスで白+ブルーの線 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  display: block;
  width: 100%;
  margin-top: 0.7em;
  padding: 1em 1.1em;
  font-size: 1rem;
  font-weight: 400;
  background-color: var(--cero-bg-alt);
  border: 1px solid transparent;
  border-radius: 0;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.wpcf7 input:focus,
.wpcf7 textarea:focus {
  background-color: #ffffff;
  border-color: var(--cero-accent);
  outline: none;
}

.wpcf7 ::placeholder {
  color: #a8b2bc;
}

.wpcf7 textarea {
  min-height: 180px;
}

/* 同意チェックまわり */
.wpcf7 form > p {
  font-size: 0.85rem;
  color: var(--cero-text-muted);
  line-height: 2;
  margin: 2rem 0;
}

.wpcf7 .wpcf7-acceptance .wpcf7-list-item {
  margin: 0.6em 0 0;
  display: block;
}

.wpcf7 .wpcf7-acceptance label {
  color: var(--cero-text);
  font-weight: 500;
}

.wpcf7 input[type="checkbox"] {
  accent-color: var(--cero-accent-strong);
  width: 1.05em;
  height: 1.05em;
  margin-right: 0.5em;
}

/* 送信ボタン: 主要CTAと同じ濃紺の箱 */
.wpcf7 p.center {
  text-align: center;
  margin-top: 3rem;
}

.wpcf7 input[type="submit"] {
  background-color: var(--cero-ink);
  color: #ffffff;
  border: none;
  border-radius: 0;
  padding: 1.15em 4em;
  font-size: 1rem;
  letter-spacing: 0.22em;
  cursor: pointer;
  transition: background-color 0.25s ease, box-shadow 0.25s ease,
    transform 0.25s ease;
}

.wpcf7 input[type="submit"]:hover {
  background-color: var(--cero-ink-soft);
  box-shadow: 0 8px 20px rgba(26, 39, 64, 0.22);
  transform: translateY(-1px);
}

/* 送信結果メッセージ */
.wpcf7 .wpcf7-response-output {
  border: 1px solid var(--cero-accent);
  color: var(--cero-ink);
  padding: 1em 1.2em;
  margin: 2rem 0 0;
  font-size: 0.9rem;
}

.wpcf7 .wpcf7-not-valid-tip {
  font-size: 0.78rem;
  margin-top: 0.4em;
}

/* スマホ: ラベルを上に積むレイアウトに切り替え */
@media (max-width: 600px) {
  .cero-hero {
    min-height: 65vh;
  }

  .cero-table tr {
    display: block;
    border-bottom: 1px solid var(--cero-border);
    padding: 1.3em 0.3em 1.4em;
  }

  .cero-table td {
    display: block;
    border: none;
    --ark-padding--cell: 0;
    width: auto;
  }

  .cero-table tr td:first-child {
    width: auto;
    line-height: 1.6;
    margin-bottom: 0.4em;
  }
}