/* =========================================================
   Care Family — Brand Stylesheet (プロト忠実移植版)
   元 style.css を移植し、JSで上書きされていた indigo-sun を
   :root に焼き込み（--coral をインディゴ化）。React/Tailwind は不使用。
   Lightning(Bootstrap4) と併存する前提で .cf-* に名前空間化。
   ========================================================= */

:root{
  --coral: #b7384a;
  --coral-deep: #8f2a39;
  --peach: oklch(0.92 0.06 270);
  --peach-deep: oklch(0.84 0.10 270);
  --yellow: oklch(0.86 0.16 85);
  --yellow-deep: oklch(0.80 0.17 80);
  --navy: oklch(0.24 0.04 260);
  --navy-2: oklch(0.34 0.04 260);
  --paper: oklch(0.985 0.005 60);
  --paper-warm: oklch(0.965 0.012 55);
}

/* ---- Base（Lightning本文への影響を最小化するため .cf スコープ寄せ） ---- */
body{
  font-family: 'Noto Sans JP', 'Manrope', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ---- Typography utilities ---- */
.font-serif-jp{ font-family: 'Noto Serif JP', serif; font-weight: 900; letter-spacing: -0.01em; }
.font-mono-en{ font-family: 'Manrope', sans-serif; letter-spacing: 0.02em; }
.eyebrow{
  font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 16px;
  letter-spacing: 0.22em; text-transform: uppercase;
}
.num-badge{ font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 12px; letter-spacing: 0.18em; color: var(--coral); }

/* ---- Material Symbols ---- */
.material-symbols-rounded{
  font-family: 'Material Symbols Rounded';
  font-weight: normal; font-style: normal;
  font-size: 24px; line-height: 1;
  letter-spacing: normal; text-transform: none;
  display: inline-block; white-space: nowrap; word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
.ms-fill{ font-variation-settings: 'FILL' 1; }

/* ---- Buttons ---- */
.pill-cta{
  background-color: #06C755; color: white; border-radius: 999px;
  box-shadow: 0 0px 10px -10px color-mix(in oklch,var(--coral) 65%,transparent), inset 0 -2px 0 rgba(0,0,0,0.10);
  transition: transform .15s ease, box-shadow .25s ease;
}
.pill-cta:hover{ transform: translateY(-2px); color:#fff; }
.pill-cta:active{ transform: translateY(0) scale(0.98); }
.pill-ghost{
  background: white; color: var(--navy); border-radius: 999px;
  border: 1.5px solid color-mix(in oklch, var(--navy) 12%, transparent);
  transition: all .2s ease;
}
.pill-ghost:hover{ border-color: var(--coral); color: var(--coral); }

/* ---- Decorative ---- */
.stripe-ph{
  background:
    repeating-linear-gradient(135deg, color-mix(in oklch, var(--navy) 5%, transparent) 0 12px, transparent 12px 24px),
    color-mix(in oklch, var(--peach) 60%, white);
}
@keyframes drift1 { 0%,100%{ transform: translate(0,0) rotate(0deg);} 50%{ transform: translate(10px,-14px) rotate(-3deg);} }
@keyframes drift2 { 0%,100%{ transform: translate(0,0) rotate(0deg);} 50%{ transform: translate(-12px,12px) rotate(4deg);} }
@keyframes drift3 { 0%,100%{ transform: translate(0,0) rotate(0deg);} 50%{ transform: translate(6px,8px) rotate(-2deg);} }
.drift-1{ animation: drift1 12s ease-in-out infinite; }
.drift-2{ animation: drift2 14s ease-in-out infinite; }
.drift-3{ animation: drift3 16s ease-in-out infinite; }
.cf-hero-blobs .drift-3 path{
  fill: oklch(0.78 0.14 25) !important;
  opacity: 0.18 !important;
}
/* セクション背景の装飾ブロブ：最背面・クリック透過・はみ出しはこの中で内包 */
.cf-section-blobs{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }

/* 同セクションのコンテンツを前面レイヤーに */
.cf-section-blobs ~ .cf-wrap,
.cf-section-blobs ~ * { position:relative; z-index:1; }

.lift{ transition: transform .3s ease, box-shadow .3s ease; }
.lift:hover{ transform: translateY(-6px); box-shadow: 0 30px 60px -30px rgba(20,30,60,0.25); }
.tick{ width: 22px; height: 22px; border-radius: 999px; background: color-mix(in oklch, var(--yellow) 70%, white); display:inline-flex; align-items:center; justify-content:center; color: var(--coral-deep); flex-shrink: 0;}
.tick .material-symbols-rounded{ font-size: 16px; }
.dotline{
  background-image: radial-gradient(circle, color-mix(in oklch, var(--navy) 18%, transparent) 1.2px, transparent 1.4px);
  background-size: 8px 8px;
}
@keyframes rise { from{ opacity:0; transform: translateY(14px);} to{ opacity:1; transform: none;} }
.rise{ animation: rise .8s cubic-bezier(.2,.7,.2,1) both; }
::selection{ background: var(--yellow); color: var(--navy); }

.logo{ display:block; max-width:100%; width:50px; }
.QR{ display:block; max-width:100%; width:100px; }
.tex_sm{ color: var(--navy); font-size: 1em; }
.client{ color: var(--navy); font-size: 1.6em; }

/* ---- Company info table ---- */
/*
 * .cf-table — 会社概要テーブル
 * reset.css の「th, td { border: 1px solid #ddd }」や
 * Lightning の style-theme-json.css が全辺に線を追加するため、
 * border-collapse: collapse + border をここで完全上書きして
 * 下線のみの元HTMLデザインに戻す。
 */
.cf-table{ width:100%; border-collapse:collapse; border-spacing:0; border:none; }
.cf-table tr{ border:none; border-bottom:1px solid color-mix(in oklch, var(--navy) 8%, transparent); }
.cf-table th,
.cf-table td{
  padding:22px 4px;
  vertical-align:top;
  text-align:left;
  font-size:15px;
  line-height:1.85;
  border:none;                      /* reset.css / Lightning の全辺ボーダーを除去 */
  border-bottom:1px solid color-mix(in oklch, var(--navy) 8%, transparent);
}
.cf-table th{
  width:120px;
  font-family:'Manrope',sans-serif;
  font-weight:700;
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--coral);
  padding-right:24px;
  background:none;                  /* Lightning が th に背景色を付ける場合の除去 */
}
.cf-table th .jp{ display:block; font-family:'Noto Sans JP',sans-serif; font-size:15px; letter-spacing:normal; text-transform:none; color:var(--navy); margin-top:2px; }
.cf-table tr:last-child th,
.cf-table tr:last-child td{ border-bottom:0; }

/* ---- Form fields ---- */
.field{ width:100%; padding:14px 18px; border-radius:14px; border:1.5px solid color-mix(in oklch, var(--navy) 10%, transparent); background:white; color:var(--navy); font-size:15px; transition:border-color .2s ease, box-shadow .2s ease; font-family:inherit; }
.field:focus{ outline:none; border-color:var(--coral); box-shadow:0 0 0 4px color-mix(in oklch, var(--coral) 18%, transparent); }
.field::placeholder{ color: color-mix(in oklch, var(--navy) 35%, transparent); }
.form-label{ display:block; font-weight:700; font-size:13px; margin-bottom:10px; color:var(--navy); }
.form-label .req{ font-size:10px; font-weight:800; color:white; background:var(--coral); padding:2px 7px; border-radius:999px; margin-left:6px; vertical-align:middle; letter-spacing:0.06em; }
.form-label .opt{ font-size:10px; font-weight:700; color:var(--navy-2); background:color-mix(in oklch, var(--navy) 6%, transparent); padding:2px 7px; border-radius:999px; margin-left:6px; vertical-align:middle; letter-spacing:0.06em; }
.radio-chip, .checkbox-chip{ display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; font-size:13px; font-weight:700; border:1.5px solid color-mix(in oklch, var(--navy) 10%, transparent); background:white; color:var(--navy); cursor:pointer; transition:all .15s ease; user-select:none; }
.radio-chip input, .checkbox-chip input{ position:absolute; opacity:0; pointer-events:none; }
.radio-chip:has(input:checked), .checkbox-chip:has(input:checked){ background:var(--coral); color:white; border-color:var(--coral); box-shadow:0 8px 20px -10px color-mix(in oklch, var(--coral) 60%, transparent); }
.radio-chip:hover, .checkbox-chip:hover{ border-color:var(--coral); }
.chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-size:11px; font-family:'Manrope',sans-serif; font-weight:700; border:1.5px solid color-mix(in oklch, var(--navy) 10%, transparent); cursor:pointer; transition:all .2s ease; background:white; color:var(--navy-2); }
.chip:hover{ border-color:var(--coral); color:var(--coral); }
.chip.active{ background:var(--coral); color:white; border-color:var(--coral); }
details > summary{ list-style:none; }
details > summary::-webkit-details-marker{ display:none; }

/* =========================================================
   .cf-* レイアウトユーティリティ
   Tailwind を使わずプロトのレイアウトを再現するための最小セット。
   ブロック側は core/group, core/columns に className を付与して使用。
   ========================================================= */
/*
 * !important が必要な理由:
 * WordPress が <head> 最後に生成する core-block-supports-inline-css が
 * .is-layout-constrained の直子に max-width:100% を後から適用するため。
 * !important を付けることでその上書きを防ぎ、1280px 制限を維持する。
 */
.cf-wrap{ max-width:1280px !important; margin-inline:auto; padding-inline:24px; }
@media(min-width:1024px){ .cf-wrap{ padding-inline:40px; } }
.cf-paper{ background:var(--paper); }
.cf-paper-warm{ background:var(--paper-warm); }
.cf-relative{ position:relative; }
.cf-overflow-hidden{ overflow:hidden; }

/* セクション縦余白（プロトの py-24〜py-28 相当） */
.cf-sec{ padding-block: clamp(64px, 9vw, 112px); }
.cf-sec-sm{ padding-block: clamp(40px, 6vw, 64px); }

/* 見出しスケール */
.cf-h1{ font-size: clamp(44px, 6vw, 68px); line-height:1.05; color:var(--navy); }
.cf-h2{ font-size: clamp(34px, 4.5vw, 52px); line-height:1.15; color:var(--navy); }
.cf-h3{ font-size: clamp(26px, 3vw, 40px); line-height:1.2; color:var(--navy); }
.cf-lead{ font-size:16px; line-height:2; color:var(--navy-2); }
.cf-body{ font-size:15px; line-height:2.1; color:var(--navy-2); }
.cf-navy{ color:var(--navy); }
.cf-navy2{ color:var(--navy-2); }
.cf-coral{ color:var(--coral); }

/* カード */
.cf-card{ background:#fff; border-radius:24px; padding:28px; box-shadow:0 20px 50px -30px rgba(20,30,60,0.25); }
.cf-card--line{ border:1px solid rgba(0,0,0,0.04); border-radius:24px; }

/* 円形アイコンバッジ */
.cf-iconwrap{ width:40px; height:40px; border-radius:999px; display:grid; place-items:center; }
.cf-step-num{ width:36px; height:36px; border-radius:999px; display:grid; place-items:center; font-family:'Manrope',sans-serif; font-weight:800; color:#fff; font-size:14px; background:var(--coral); }

/* ブロブ用：写真の正方形枠＋クリップ */
.cf-blobframe{ position:relative; aspect-ratio:1/1; max-width:440px; margin-inline:auto; }
.cf-blobframe img{ width:100%; height:100%; object-fit:cover; }
.cf-abs-fill{ position:absolute; inset:0; }

/* CTA グラデ枠（プロトのオレンジ系を直値で維持） */
.cf-cta-card{ border-radius:40px; overflow:hidden; background:linear-gradient(120deg, oklch(0.74 0.18 32), oklch(0.66 0.20 18)); color:#fff; }

/* ナビ／フッター（プロト） */
.cf-header{ position:fixed; top:0; left:0; right:0; z-index:50; backdrop-filter:blur(20px); background:rgba(255,255,255,0.75); border-bottom:1px solid rgba(0,0,0,0.04); }
.cf-footer{ background: oklch(0.92 0.10 80); color:#000; }

/* ---- 2カラムグリッド（lg以上で2分割。プロトの lg:grid-cols-12 相当） ---- */
@media(min-width:1024px){
  .cf-hero-grid{ grid-template-columns: 1fr 1fr; }
  .cf-why-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center;
  padding-block:64px;
}
  .cf-why-row .order-1, .cf-why-row > div:first-child{ }
  .cf-voices-head{ grid-template-columns: 7fr 5fr; }
  .cf-cta-grid{ grid-template-columns: 1fr 1fr; }
}
/* 写真左/右の入れ替え（order） */
@media(min-width:1024px){
  .cf-why-row > div[style*="order:2"]{ order:1 !important; }
  .cf-why-row > div[style*="order:1"]{ order:2 !important; }
  .cf-why-row--rev > div:first-child{ order:1; }
  .cf-why-row--rev > div:last-child{ order:2; }
}

/* Why us 1行目：写真を左、テキストを右（CSSで明示） */
.cf-why-row > *:first-child{order:1;}
.cf-why-row > *:last-child{order:2;}
.cf-why-row--rev > *:first-child{order:1;}
.cf-why-row--rev > *:last-child{order:2;}

/* =========================================================
   Contact Form 7 適合スタイル
   CF7独自マークアップ(.wpcf7-list-item / input[type=submit])に
   プロトの .radio-chip / .pill-cta デザインを当て直す。
   ========================================================= */
.wpcf7 .cf-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.wpcf7 .cf-field-block{ margin-bottom:0; }

/* CF7のバリデーションで input が再生成されても .field を維持 */
.wpcf7 .field{ width:100%; }
.wpcf7-form-control-wrap{ display:block; }

/* チップ型 radio / checkbox */
.cf-chip-row .wpcf7-list-item{ display:inline-block; margin:0 10px 10px 0; position:relative; }
.cf-chip-row .wpcf7-list-item-label{ }
.cf-chip-row .wpcf7-list-item > label{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 16px; border-radius:999px; font-size:13px; font-weight:700;
  border:1.5px solid color-mix(in oklch, var(--navy) 10%, transparent);
  background:#fff; color:var(--navy); cursor:pointer; transition:all .15s ease; user-select:none;
}
.cf-chip-row .wpcf7-list-item input[type="radio"],
.cf-chip-row .wpcf7-list-item input[type="checkbox"]{ position:absolute; opacity:0; pointer-events:none; }
.cf-chip-row .wpcf7-list-item:has(input:checked) > label{
  background:var(--coral); color:#fff; border-color:var(--coral);
  box-shadow:0 8px 20px -10px color-mix(in oklch, var(--coral) 60%, transparent);
}
.cf-chip-row .wpcf7-list-item > label:hover{ border-color:var(--coral); }
.cf-chip-row{ display:flex; flex-wrap:wrap; }

/* 同意チェック（acceptance） */
.wpcf7-acceptance .wpcf7-list-item{ margin:0; }
.wpcf7-acceptance label{ display:flex; align-items:flex-start; gap:12px; font-size:13px; line-height:1.85; color:var(--navy-2); cursor:pointer; }
.wpcf7-acceptance input{ margin-top:3px; width:18px; height:18px; accent-color:var(--coral); flex-shrink:0; }

/* 送信ボタン：元HTMLの <a class="pill-cta"> に合わせた全幅スタイル */
.wpcf7 .cf-submit{
  -webkit-appearance:none; appearance:none; border:0; cursor:pointer;
  padding:16px 32px 16px 48px; font-size:15px; font-weight:700;
  font-family:'Manrope', sans-serif; letter-spacing:0.02em;
  display:block; text-align:center; border-radius:999px;
  /* chat アイコンを背景SVGで再現（Material Symbols chat の形状） */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:20px center; background-size:20px 20px;
}
/* 元HTMLは常に全幅のため media query は設けない */

/* select の dropdown 矢印（∨）を復元
   reset.css の appearance:none で消えるため背景SVGで再現 */
select.field{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23555' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:12px 8px;
  padding-right:36px;
}

/*
 * CF7送信ボタンの背景色を強制的に緑に固定。
 * reset.css の input リセットや Lightning のスタイルに負けないよう
 * !important で上書き。pill-cta クラス付きの場合も対象。
 */
.wpcf7 input[type="submit"],
input[type="submit"].pill-cta,
input[type="submit"].cf-submit {
  background-color: #06C755 !important;
  color: #fff !important;
}

/* CF7のエラー/確認メッセージ */
.wpcf7 .wpcf7-not-valid-tip{ color:var(--coral); font-size:12px; margin-top:6px; }
.wpcf7 .wpcf7-response-output{ border-radius:14px; border-width:1.5px; font-size:13px; margin:18px 0 0; padding:14px 18px; }

/* =========================================================
   Header / Footer（プロト固定ナビ・黄色フッター）
   site-header.php / site-footer.php の上書きと対で使用。
   ========================================================= */

/* 固定ヘッダー分のオフセット（プロトの main pt-72 相当） */
body{ padding-top:72px; }
.admin-bar .cf-header{ top:32px; }
@media(max-width:782px){ .admin-bar .cf-header{ top:46px; } }

/* ヘッダー内部 */
.cf-header-inner{ max-width:1280px; margin-inline:auto; padding-inline:24px; height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
@media(min-width:1024px){ .cf-header-inner{ padding-inline:40px; } }
.cf-header-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.cf-brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.cf-brand-en{ font-size:10px; letter-spacing:0.22em; font-weight:700; text-transform:uppercase; color:var(--navy-2); }
.cf-brand-jp{ font-size:18px; color:var(--navy); }

.cf-nav{ display:none; align-items:center; gap:36px; }
.cf-nav-link{ font-size:14px; font-weight:500; color:var(--navy); text-decoration:none; transition:color .2s ease; }
.cf-nav-link:hover{ color:var(--coral); }
.cf-nav-link.is-active{ color:var(--coral); font-weight:700; }

.cf-header-actions{ display:flex; align-items:center; gap:12px; }
.cf-header-cta{ display:inline-flex; align-items:center; gap:8px; padding:10px 20px; font-size:13px; font-weight:700; }
.cf-burger{ display:grid; place-items:center; width:40px; height:40px; border-radius:999px; border:1px solid rgba(0,0,0,0.1); cursor:pointer; background:#fff; }
.cf-nav-toggle{ position:absolute; opacity:0; pointer-events:none; }

@media(min-width:1024px){
  .cf-nav{ display:flex; }
  .cf-burger{ display:none; }
}
/* モバイル：ハンバーガーでナビ開閉（JS不要・チェックボックス方式） */
@media(max-width:1023px){
  .cf-nav{ position:absolute; top:72px; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:#fff; padding:4px 24px; border-bottom:1px solid rgba(0,0,0,0.06); box-shadow:0 24px 40px -30px rgba(0,0,0,.3); }
  .cf-nav-toggle:checked ~ .cf-nav{ display:flex; }
  .cf-nav-link{ padding:14px 0; border-bottom:1px solid rgba(0,0,0,0.05); }
  .cf-nav-link:last-child{ border-bottom:0; }
}

/* フッター */
.cf-footer-inner{ padding-block:80px; }
.cf-footer-grid{ display:grid; gap:40px; grid-template-columns:1fr; }
@media(min-width:768px){ .cf-footer-grid{ grid-template-columns:2fr 1fr 1fr 1.4fr; } }
.cf-footer-brand p{ font-size:13px; line-height:2; max-width:24rem; opacity:.75; margin:0; }
.cf-footer-addr{ margin-top:32px; font-size:12px; opacity:.6; font-family:'Manrope',sans-serif; line-height:1.9; }
.cf-footer-col .eyebrow{ margin-bottom:20px; opacity:.6; }
.cf-footer-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.cf-footer-col a{ font-size:13px; color:#000; text-decoration:none; transition:opacity .2s ease; }
.cf-footer-col a:hover{ opacity:.55; }
.cf-footer-contact .pill-cta{ display:inline-flex; align-items:center; gap:8px; padding:12px 20px; font-size:13px; font-weight:700; margin-bottom:16px; color:#fff; } /* .cf-footer-col a{color:#000} より高い特異度で上書き */
.cf-footer-tel{ display:block; font-size:13px; color:#000; text-decoration:none; opacity:.85; }
.cf-footer-bottom{ margin-top:64px; padding-top:32px; border-top:1px solid rgba(0,0,0,0.12); display:flex; flex-direction:column; gap:16px; align-items:center; justify-content:space-between; font-size:11px; opacity:.65; font-family:'Manrope',sans-serif; }
.cf-footer-bottom a{ color:#000; text-decoration:none; margin-left:24px; }
@media(min-width:768px){ .cf-footer-bottom{ flex-direction:row; } }

/* ロゴ画像のサイズ調整（メディアライブラリ/フォールバック共通） */
.logo img, .logo .custom-logo{ display:block; width:100%; height:auto; }

/* =========================================================
   レスポンシブ — サブページ JSON パターン グリッド修正
   inline style の grid-template-columns は CSS 詳細度最高のため
   メディアクエリ内でも !important が必要。
   元 HTML の Tailwind lg:(1024px) / md:(768px) ブレークポイントに準拠。
   ========================================================= */

/* ---- モバイル共通 (< 1024px) ---- */
@media(max-width:1023px){

  /* 名前付きグリッドクラス */
  .cf-hero-grid,
  .cf-company-grid,
  .cf-voices-head,
  .cf-cta-grid,
  .cf-why-row {
    grid-template-columns: 1fr !important;
  }

  /* inline style で固定カラムを指定しているグリッド全般 */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:1fr 2fr"],
  [style*="grid-template-columns:2fr 3fr"],
  [style*="grid-template-columns:5fr 7fr"],
  [style*="grid-template-columns:7fr 5fr"] {
    grid-template-columns: 1fr !important;
  }

  /* 求人フィーチャーカード内の画像エリア */
  [style*="grid-template-columns:5fr 7fr"] > [style*="min-height"],
  [style*="grid-template-columns:2fr 3fr"] > [style*="min-height"] {
    min-height: 220px !important;
    width: 100% !important;
  }

  /* セクション内 padding 調整 */
  [style*="padding:96px 24px"] {
    padding: 56px 20px !important;
  }
  [style*="padding:80px 24px"] {
    padding: 48px 20px !important;
  }
  [style*="padding-top:96px;padding-bottom:96px"] {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
  [style*="padding-top:80px;padding-bottom:48px"] {
    padding-top: 48px !important;
    padding-bottom: 32px !important;
  }
}

/* ---- スマートフォン (< 768px) ---- */
@media(max-width:767px){

  /* 3カラム → 1カラム */
  [style*="grid-template-columns:repeat(3,1fr)"] {
    grid-template-columns: 1fr !important;
  }

  /* ヒーロー h1 の文字サイズ */
  .cf-h1 { font-size: clamp(36px, 10vw, 52px) !important; }
  .cf-h2 { font-size: clamp(28px, 8vw, 40px) !important; }

  /* ヒーロー右カラム（ブロブ装飾）をモバイルで非表示 */
  .cf-hero-grid > div:last-child:not(.rise) {
    display: none;
  }

  /* フォームグリッド */
  .cf-grid-2,
  .wpcf7 .cf-grid-2 {
    grid-template-columns: 1fr !important;
  }

  /* フッターグリッド */
  .cf-footer-grid {
    grid-template-columns: 1fr !important;
  }

  /* カードの padding を縮小 */
  [style*="border-radius:40px"][style*="padding:clamp(40px"] {
    padding: 28px 24px !important;
  }

  /* pill-cta の幅をモバイルで全幅に */
  .pill-cta {
    width: 100%;
    justify-content: center;
  }
}

* =========================================================
   Contact page — お問い合わせグリッド
   旧 Tailwind「grid lg:grid-cols-12 / col-span-4 / col-span-8 /
   lg:sticky lg:top-[100px]」の置換。brand.css の末尾に追記する。
   カラム比率は wp:columns の width (34% / 66%) 側で指定。
   ========================================================= */
.cf-contact-grid{
  gap:40px;
  align-items:start;
}
/* PC：サイドバー（左カラム）を追従表示 */
@media(min-width:1024px){
  .cf-contact-grid > .wp-block-column:first-child{
    position:sticky;
    top:100px;
  }
}
/* SP：Gutenberg columns は 782px 未満で自動的に縦積みになるため
   追加指定は不要（sticky も解除される） */

/* ============================================================
   ヒーロー背景ブロブ：はみ出し量を抑えてクリップを回避
   （.site-body の overflow-x:hidden は維持する方針）
   ============================================================ */

/* 大ブロブ（560px / drift-1） */
.cf-hero-blobs .drift-1{
  top: -72px !important;
  left: -72px !important;
}

/* 小ブロブ（180px / drift-2） */
.cf-hero-blobs .drift-2{
  top: 140px !important;
  left: -32px !important;
}

/* タブレット以下：コンテナが画面端に達するのでさらに内側へ＋縮小 */
@media (max-width: 1023px){
  .cf-hero-blobs .drift-1{
    top: -48px !important;
    left: -48px !important;
    width: 440px !important;
    height: 440px !important;
  }
  .cf-hero-blobs .drift-2{
    left: -16px !important;
  }
}

/* スマホ：大ブロブは画面幅より大きいので右側が切れるのを防ぐため縮小 */
@media (max-width: 767px){
  .cf-hero-blobs .drift-1{
    top: -32px !important;
    left: -32px !important;
    width: 300px !important;
    height: 300px !important;
  }
  .cf-hero-blobs .drift-2{
    width: 120px !important;
    height: 120px !important;
    left: -8px !important;
  }
}

/* === 求人ページ ヒーロー === */
.cf-jobs-hero{position:relative;padding-top:64px;padding-bottom:48px;}
.cf-jobs-hero .cf-hero-deco{position:absolute;inset:0;pointer-events:none;}
.cf-jobs-hero .cf-hero-inner{position:relative;max-width:820px;}

.cf-hero-inner .eyebrow{color:#b7384a;}      /* var(--coral)は副ページで不安定なので直値 */
.cf-jobs-hero .cf-h1{color:var(--navy);}
.cf-jobs-hero .cf-body{max-width:560px;margin-top:32px;}

/* 手描き下線（SVGを背景化して見出しに付与） */
.cf-h1-underline{position:relative;display:inline-block;}
.cf-h1-underline::after{
  content:"";position:absolute;left:0;bottom:-12px;width:100%;height:20px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 18' preserveAspectRatio='none'%3E%3Cpath d='M2,12 C80,2 220,18 318,6' stroke='%23e6b54a' stroke-width='6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
  background-size:100% 100%;
}

/* 数値スタッツ */
.cf-jobs-stats .cf-stat-num{font-size:26px;font-weight:800;line-height:1;color:#b7384a;}
.cf-jobs-stats .cf-stat-label{font-size:11px;margin-top:8px;color:var(--navy-2);}

/* 紹介先パートナー帯 */
.cf-partners{
  border-top:1px solid rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.06);
  padding-block:24px;margin-top:40px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 40px;
}
.cf-partners .eyebrow{color:var(--navy-2);}
.cf-partners .cf-partner-list{display:flex;flex-wrap:wrap;align-items:center;gap:12px 40px;opacity:.7;}

/* === 求人一覧 === */
.cf-jobs-list{max-width:1280px;margin-inline:auto;padding:80px 24px 48px;}
.cf-jobs-head{margin-bottom:40px;}
.cf-jobs-head .eyebrow{color:#b7384a;margin-bottom:12px;}
.cf-jobs-head .cf-jobs-title{font-size:clamp(28px,3.5vw,44px);line-height:1.2;color:var(--navy);}
.cf-jobs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:32px;}
.cf-jobs-head .cf-jobs-title{font-size:clamp(28px,3.5vw,44px);line-height:1.2;color:var(--navy);}

.cf-jobs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:32px;}

.cf-job-card{background:#fff;border-radius:24px;overflow:hidden;border:1px solid rgba(0,0,0,.04);}
.cf-job-card--featured{grid-column:1/-1;display:grid;grid-template-columns:5fr 7fr;border-radius:28px;}
@media(max-width:720px){.cf-job-card--featured{grid-template-columns:1fr;}}

.cf-job-media{position:relative;height:176px;}
.cf-job-card--featured .cf-job-media{min-height:240px;height:auto;}
.cf-job-media img{width:100%;height:100%;object-fit:cover;display:block;}

.cf-job-body{padding:28px;display:flex;flex-direction:column;}
.cf-job-card--featured .cf-job-body{padding:clamp(32px,4vw,40px);}
.cf-job-cat{font-size:12px;font-weight:700;color:#b7384a;display:block;margin-bottom:6px;}
.cf-job-title{color:var(--navy);line-height:1.45;font-size:20px;margin-bottom:20px;}
.cf-job-card--featured .cf-job-title{font-size:clamp(20px,2.5vw,28px);line-height:1.35;}

/* バッジ */
.cf-tags{position:absolute;top:16px;left:16px;display:flex;flex-wrap:wrap;gap:8px;}
.cf-tags-inline{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.cf-job-card--featured .cf-tag--featured{position:absolute;top:20px;left:20px;}
.cf-tag{padding:4px 10px;border-radius:999px;font-size:10px;font-weight:700;}
.cf-tag--white{background:rgba(255,255,255,.95);color:var(--coral-deep);}
.cf-tag--coral{background:#b7384a;color:#fff;}
.cf-tag--yellow{background:color-mix(in oklch,var(--yellow) 60%,white);color:var(--navy);}
.cf-tag--peach{background:color-mix(in oklch,var(--peach) 70%,white);color:var(--coral-deep);}
.cf-tag--type{background:color-mix(in oklch,var(--yellow) 50%,white);color:var(--navy);}
.cf-tag--hidden{border:1px solid rgba(20,30,60,.15);color:var(--navy);}
.cf-tag--featured{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:11px;color:#fff;background:#b7384a;}

/* スタッツ（通常カード） */
.cf-job-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:12px;color:var(--navy);margin-bottom:24px;}
.cf-job-stats .l{opacity:.6;}
.cf-job-stats .v{font-weight:700;display:block;}

/* スタッツ（featured：アイコン付き） */
.cf-job-stats--icon{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;margin-bottom:28px;}
.cf-job-stats--icon .row{display:flex;align-items:flex-start;gap:12px;}
.cf-job-stats--icon .material-symbols-rounded{color:#b7384a;font-size:18px;margin-top:2px;}
.cf-job-stats--icon .k{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--navy-2);}
.cf-job-stats--icon .val{font-size:14px;font-weight:700;}

/* CTA */
.cf-job-cta--full{width:100%;justify-content:center;}
.cf-jobs-more{margin-top:48px;display:flex;justify-content:center;}

/* 求人セクションの外枠と横幅 */
.cf-jobs-list{max-width:1280px;margin-inline:auto;padding:0 24px 48px;}
.cf-jobs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:32px;}

/* カードの白枠 */
.cf-job-card{background:#fff;border-radius:24px;overflow:hidden;border:1px solid rgba(0,0,0,.04);}
.cf-job-body{padding:28px;}
.cf-job-cat{color:#b7384a;font-size:12px;font-weight:700;margin:0 0 6px;}
.cf-job-title{color:var(--navy);line-height:1.45;margin:0 0 20px;}

/* featured（横2分割・全幅） */
.cf-job-card--featured{grid-column:1/-1;display:grid;grid-template-columns:5fr 7fr;border-radius:28px;}
.cf-job-card--featured .cf-job-body{padding:clamp(32px,4vw,40px);display:flex;flex-direction:column;}
.cf-job-title--lg{font-size:clamp(20px,2.5vw,28px);line-height:1.35;}
@media(max-width:720px){.cf-job-card--featured{grid-template-columns:1fr;}}

/* 画像をネイティブブロック化したカードのメディア枠 */
.cf-job-media{position:relative;height:176px;overflow:hidden;}
.cf-job-media .wp-block-image,
.cf-job-media .wp-block-image img{
  width:100%;height:100%;margin:0;
}
.cf-job-media .wp-block-image img{
  object-fit:cover;object-position:center 70%;display:block;
}
/* バッジの重なり */
.cf-job-badges{position:absolute;top:16px;left:16px;display:flex;gap:8px;z-index:2;}

.cf-job-stats .cf-stat-l{opacity:.6;font-size:12px;margin:0;color:var(--navy);}
.cf-job-stats .cf-stat-v{font-weight:700;font-size:12px;margin:0;color:var(--navy);}
.cf-job-stats.wp-block-columns{gap:12px;margin-bottom:24px;}
.cf-job-stats .wp-block-column{flex-basis:calc(50% - 6px);}

/* TOP Voices カードのネイティブ化対応 */
.cf-voice-cat{display:inline-block;padding:4px 10px;border-radius:999px;font-size:10px;font-weight:700;margin-bottom:12px;}
.cf-voice-cat--peach{background:color-mix(in oklch,var(--peach) 70%,white);color:var(--coral-deep);}
.cf-voice-cat--yellow{background:color-mix(in oklch,var(--yellow) 50%,white);color:var(--navy);}
.cf-voice-quote{font-size:20px;line-height:1.55;margin:0 0 16px;color:var(--navy);}
.cf-voice-body{font-size:13px;line-height:1.9;color:var(--navy-2);margin:0;}
.cf-voice-foot{margin-top:20px;padding-top:20px;border-top:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:space-between;}
.cf-voice-name{font-size:13px;font-weight:700;color:var(--navy);}
.cf-voice-meta{font-size:11px;color:var(--navy-2);}

.cf-stats3.wp-block-columns{gap:24px;margin-top:32px;max-width:420px;}
.cf-stats3 .wp-block-column{flex-basis:calc(33.333% - 16px);}
.cf-stat3-num{font-size:28px;font-weight:800;line-height:1;color:var(--coral);margin:0;}
.cf-stat3-num .u{font-size:14px;}
.cf-stat3-label{font-size:11px;margin-top:8px;color:var(--navy-2);margin-bottom:0;}