/* =====================================================================
   飯田橋社労士事務所 — theme.css
   モダン・信頼感重視（青水色基調）/ 軽量・高速 / レスポンシブ
   ===================================================================== */

/* ---------- Design Tokens ---------- */
:root {
  /* 基調色：青〜水色系 */
  --navy-900: #082f49;   /* ディープブルー */
  --navy-800: #0b4668;   /* 深い青 */
  --navy-700: #0f5f86;   /* ブルー */
  --navy-600: #137da6;   /* 明るい青 */
  --navy-500: #1aa6c9;   /* シアンブルー */
  --blue-400: #5bc7df;   /* ライトシアン */
  --gold-500: #22b8cf;   /* アクセント（水色） */
  --gold-400: #67d8e8;
  --teal-500: #12a8a0;   /* 補助アクセント */
  --ink-900: #102a3a;    /* 本文 */
  --ink-700: #27485a;
  --ink-500: #5f7783;
  --ink-300: #a5bac4;
  --line: #d8edf3;
  --line-2: #eaf6f9;
  --bg: #ffffff;
  --bg-soft: #f3fbfd;
  --bg-navy-soft: #e8f7fb;
  --white: #ffffff;

  --radius: 14px;
  --radius-sm: 9px;
  --radius-lg: 22px;
  --shadow-sm: 0 1px 2px rgba(8,47,73,.07), 0 2px 8px rgba(8,47,73,.05);
  --shadow: 0 6px 24px rgba(8,47,73,.09);
  --shadow-lg: 0 18px 50px rgba(8,47,73,.16);

  --maxw: 1160px;
  --maxw-narrow: 820px;
  --gap: clamp(1rem, 3vw, 2rem);

  --font-sans: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  --font-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;

  --header-h: 76px;
}

/* ---------- Reset / Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-sans);
  color: var(--ink-900);
  background: var(--bg);
  line-height: 1.85;
  font-size: 16px;
  letter-spacing: .01em;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--navy-600); text-decoration: none; transition: color .2s, opacity .2s; }
a:hover { color: var(--blue-400); }
h1, h2, h3, h4 { line-height: 1.4; font-weight: 700; color: var(--navy-800); margin: 0 0 .6em; }
p { margin: 0 0 1.2em; }
ul, ol { margin: 0 0 1.2em; padding-left: 1.3em; }
li { margin-bottom: .35em; }
hr { border: 0; border-top: 1px solid var(--line); margin: 2.5rem 0; }
strong { color: var(--navy-700); }
:focus-visible { outline: 3px solid var(--gold-400); outline-offset: 2px; }
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 999; background: var(--white); padding: .6rem 1rem; border-radius: 8px; box-shadow: var(--shadow); }

/* ---------- Layout helpers ---------- */
.container { width: min(100% - 2rem, var(--maxw)); margin-inline: auto; }
.container--narrow { width: min(100% - 2rem, var(--maxw-narrow)); margin-inline: auto; }
.section { padding: clamp(3rem, 7vw, 6rem) 0; }
.section--soft { background: var(--bg-soft); }
.section--navy { background: var(--bg-navy-soft); color: var(--ink-700); }
.section--navy h1,.section--navy h2,.section--navy h3 { color: var(--navy-800); }
.center { text-align: center; }
.lead { font-size: 1.12rem; color: var(--ink-700); }
.muted { color: var(--ink-500); }
.grid { display: grid; gap: var(--gap); }
.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px){ .cols-3,.cols-4 { grid-template-columns: repeat(2,1fr);} }
@media (max-width: 600px){ .cols-2,.cols-3,.cols-4 { grid-template-columns: 1fr;} }

/* ---------- Section heading ---------- */
.sec-head { text-align: center; margin-bottom: clamp(2rem,5vw,3.2rem); }
.sec-head__en { display:block; font-family: var(--font-serif); letter-spacing:.18em; color: var(--gold-500); font-size:.85rem; font-weight:700; text-transform: uppercase; margin-bottom:.5rem; }
.sec-head__ja { font-size: clamp(1.5rem, 3.4vw, 2.1rem); }
.sec-head__sub { color: var(--ink-600,#566); margin-top:.6rem; }
.sec-head--left { text-align: left; }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5em; padding:.85em 1.6em; border-radius: 999px; font-weight:700; font-size:.98rem; border:2px solid transparent; cursor:pointer; white-space:nowrap; transition: transform .15s, box-shadow .2s, background .2s; }
.btn:hover { transform: translateY(-2px); }
.btn .icon { width: 1.1em; height: 1.1em; }
.btn--primary { background: var(--gold-500); color: #053142; box-shadow: 0 8px 20px rgba(34,184,207,.28); }
.btn--primary:hover { background: var(--gold-400); color: #053142; }
.btn--navy { background: var(--navy-700); color:#fff; }
.btn--navy:hover { background: var(--navy-600); color:#fff; }
.btn--ghost { border-color: rgba(255,255,255,.5); color:#fff; }
.btn--ghost:hover { background: rgba(255,255,255,.12); color:#fff; }
.hero .btn--ghost { border-color: rgba(15,95,134,.34); color: var(--navy-700); background: rgba(255,255,255,.44); }
.hero .btn--ghost:hover { background: #fff; color: var(--navy-800); box-shadow: var(--shadow-sm); }
.btn--outline { border-color: var(--navy-600); color: var(--navy-700); background:#fff; }
.btn--outline:hover { background: var(--navy-700); color:#fff; }
.btn--lg { padding: 1.05em 2.2em; font-size: 1.05rem; }
.btn-row { display:flex; flex-wrap:wrap; gap:.9rem; }
.btn-row--center { justify-content:center; }

/* ---------- Header ---------- */
.site-header { position: sticky; top:0; z-index: 100; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom:1px solid var(--line); }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; height: var(--header-h); width: min(100% - 2rem, 1280px); margin-inline:auto; }
.brand { display:flex; align-items:center; gap:.7rem; flex:0 0 auto; }
.brand__img { height:36px; width:auto; display:block; }
.brand__logo { width:42px; height:42px; border-radius:10px; background: linear-gradient(135deg,var(--navy-700),var(--navy-500)); color:#fff; display:grid; place-items:center; font-family:var(--font-serif); font-weight:700; font-size:1.25rem; box-shadow: var(--shadow-sm); }
.brand__name { font-weight:700; color:var(--navy-800); font-size:1.02rem; line-height:1.25; }
.brand__name small { display:block; font-weight:500; font-size:.72rem; color:var(--ink-500); letter-spacing:.02em; }
.header-nav { display:flex; align-items:center; gap:.2rem; }
.header-nav .menu { list-style:none; display:flex; gap:.05rem; margin:0; padding:0; }
.header-nav .menu > li { position: relative; }
.header-nav .menu > li > a { display:block; padding:.5rem .55rem; font-weight:700; font-size:.82rem; color:var(--navy-800); border-radius:8px; white-space:nowrap; }
.header-nav .menu > li > a:hover { background: var(--bg-navy-soft); color: var(--navy-600); }
.header-nav .sub-menu { list-style:none; margin:0; padding:.4rem; position:absolute; top:100%; left:0; min-width: 250px; background:#fff; border:1px solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow); opacity:0; visibility:hidden; transform: translateY(6px); transition:.2s; }
.header-nav .menu-item-has-children:hover > .sub-menu,
.header-nav .menu-item-has-children:focus-within > .sub-menu { opacity:1; visibility:visible; transform: translateY(0); }
.header-nav .sub-menu a { display:block; padding:.55rem .75rem; border-radius:7px; font-size:.9rem; color:var(--ink-700); font-weight:500; }
.header-nav .sub-menu a:hover { background: var(--bg-soft); color: var(--navy-600); }
/* 業務案内：カテゴリでグループ化したメガドロップダウン（2カラム） */
.header-nav .sub-menu--mega { display:grid; grid-template-columns: repeat(2, minmax(190px,1fr)); gap:.1rem .6rem; min-width:440px; padding:.7rem; }
.header-nav .sub-menu--mega .sub-menu__col { list-style:none; }
.header-nav .sub-menu--mega .sub-menu__list { list-style:none; margin:0; padding:0; }
.header-nav .sub-menu__head { display:block; padding:.35rem .55rem .25rem; font-size:.72rem; font-weight:700; letter-spacing:.03em; color:var(--navy-600); border-bottom:1px solid var(--line); margin-bottom:.1rem; }
.header-cta { display:flex; align-items:center; gap:.6rem; flex:0 0 auto; }
.header-tel { text-align:right; line-height:1.15; }
.header-tel a { font-family: var(--font-serif); font-weight:700; font-size:1.05rem; color: var(--navy-800); white-space:nowrap; }
.header-tel small { display:block; font-size:.68rem; color:var(--ink-500); white-space:nowrap; }
.nav-toggle { display:none; }

@media (max-width: 1240px){
  .header-nav, .header-tel { display:none; }
  .header-cta .btn--primary { display:none; }   /* スマホは下部フローティングCTAと重複するため非表示 */
  .brand__img { height:32px; }
  .nav-toggle { display:inline-flex; flex-direction:column; gap:5px; width:46px; height:46px; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:10px; background:#fff; cursor:pointer; }
  .nav-toggle span { width:22px; height:2px; background: var(--navy-700); transition:.25s; }
  .nav-open .nav-toggle span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .nav-open .nav-toggle span:nth-child(2){ opacity:0; }
  .nav-open .nav-toggle span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
}

/* ---------- Mobile drawer ---------- */
.mobile-nav { position: fixed; inset:0; z-index:99; background: rgba(8,47,73,.48); opacity:0; visibility:hidden; transition:.25s; }
.nav-open .mobile-nav { opacity:1; visibility:visible; }
.mobile-nav__panel { position:absolute; top:0; right:0; height:100%; width: min(86%, 360px); background:#fff; padding: 1.5rem 1.2rem; overflow-y:auto; transform: translateX(100%); transition: transform .28s; }
.nav-open .mobile-nav__panel { transform: translateX(0); }
.mobile-nav ul { list-style:none; margin:0; padding:0; }
.mobile-nav > .mobile-nav__panel > ul > li { border-bottom:1px solid var(--line-2); }
.mobile-nav a { display:block; padding:.85rem .3rem; font-weight:700; color:var(--navy-800); }
.mobile-nav .sub-menu a { padding:.55rem .3rem .55rem 1.2rem; font-weight:500; font-size:.92rem; color:var(--ink-700); }
.mobile-nav .sub-menu__list { list-style:none; margin:0; padding:0; }
.mobile-nav .sub-menu__head { display:block; padding:.6rem .3rem .2rem 1.2rem; font-size:.72rem; font-weight:700; letter-spacing:.03em; color:var(--navy-600); }
.mobile-nav__close { float:right; background:none; border:0; font-size:1.6rem; cursor:pointer; color:var(--ink-500); }
.mobile-nav__cta { margin-top:1.2rem; display:grid; gap:.6rem; }
/* CTAボタンは汎用 .mobile-nav a 指定（display:block等）が漏れて崩れるため打ち消す。
   狭い端末でも長いラベルがはみ出さないよう折り返しを許可する。 */
.mobile-nav__cta .btn { display:flex; width:100%; padding:.9em 1em; font-size:1rem; white-space:normal; text-align:center; line-height:1.35; }
.mobile-nav__cta .btn--primary { color:#053142; }
.mobile-nav__cta .btn--outline { color:var(--navy-700); }

/* ---------- Hero ---------- */
/* エントランス写真を背景に透かし、淡いグラデーションで重ねる */
.hero { position: relative; background:
  radial-gradient(120% 92% at 50% 46%, rgba(255,255,255,.80), rgba(255,255,255,.52) 68%, rgba(255,255,255,.42) 100%),
  url(../img/photos/growing-field.webp) center 60% / cover no-repeat, #eef6fb;
  color:var(--navy-900); overflow:hidden; }
.hero::after { content:""; position:absolute; inset:0; background:
    radial-gradient(700px 460px at 8% 8%, rgba(120,180,220,.10), transparent 60%); pointer-events:none; }
.hero__inner { position:relative; z-index:1; display:grid; grid-template-columns: 1fr; gap: 1.4rem; align-items:center; padding: clamp(3rem,7vw,5.5rem) 0 clamp(3rem,6vw,5rem); }
/* コピーを全体の左右中央に配置。数字カードは中央でコピーの下に */
.hero__copy { order:1; text-align:center; max-width:760px; margin-inline:auto; }
.hero__card { order:2; align-self:center; max-width:640px; width:100%; margin:1.4rem auto 0; }
.hero__eyebrow { display:inline-flex; align-items:center; gap:.5rem; font-family:var(--font-serif); letter-spacing:.12em; color: var(--navy-600); font-weight:700; font-size:.9rem; margin-bottom:1rem; }
.hero__title { font-size: clamp(1.9rem, 4.6vw, 3.2rem); color:var(--navy-900); line-height:1.32; letter-spacing:.01em; margin-bottom:1.1rem; }
.hero__title .accent { color: var(--navy-600); }
.hero__lead { font-size: clamp(1rem,1.5vw,1.15rem); color:var(--ink-700); max-width: 40ch; margin: 0 auto 1.8rem; word-break: keep-all; }
.hero__cta { display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:1.6rem; justify-content:center; }
.hero__note { font-size:.85rem; color:var(--ink-500); }
/* 創業年数・社労士数を一目瞭然にするバッジ */
.hero__badges { display:flex; flex-wrap:wrap; gap:.9rem; margin:0 0 1.7rem; justify-content:center; }
.hero__badge { display:flex; align-items:center; gap:.8rem; background:rgba(255,255,255,.78); border:1px solid rgba(19,125,166,.18); border-left:3px solid var(--gold-500); border-radius:11px; padding:.7rem 1.1rem; box-shadow:var(--shadow-sm); }
.hero__badge b { font-family:var(--font-serif); font-size:2.4rem; color:var(--navy-700); line-height:1; white-space:nowrap; }
.hero__badge b em { font-style:normal; font-size:.42em; margin-left:.12em; }
.hero__badge span { font-size:.82rem; color:var(--ink-700); line-height:1.45; }
.hero__badge span i { font-style:normal; font-size:.86em; color:var(--ink-500); }
@media (max-width:420px){ .hero__badge{ flex:1 1 100%; } }
.hero__card { background: rgba(255,255,255,.82); border:1px solid rgba(19,125,166,.18); border-radius: var(--radius-lg); padding:1.6rem; backdrop-filter: blur(4px); box-shadow:var(--shadow); }
.hero__card h2 { color:var(--navy-800); font-size:1.05rem; margin-bottom:1rem; }
.hero__stats { display:grid; grid-template-columns: repeat(2,1fr); gap:1rem; }
.hero__stat b { display:block; font-family:var(--font-serif); font-size: clamp(1.8rem,4vw,2.4rem); color: var(--navy-700); line-height:1; }
.hero__stat span { font-size:.8rem; color:var(--ink-700); }
.hero__stat em { font-style:normal; font-size:.95rem; color:var(--ink-500); }
@media (max-width: 880px){
  .hero { background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.72)),
    url(../img/photos/growing-field.webp) center 20% / cover no-repeat; }
  .hero__inner { grid-template-columns: 1fr; gap:1.8rem; align-items:stretch; }
  .hero__copy { order:1; } .hero__card { order:2; }
}

/* ---------- Soft visual blocks ---------- */
.intro-visual { display:grid; grid-template-columns: minmax(0,1fr) minmax(320px, .72fr); gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.intro-visual__copy { text-align:center; }
.intro-visual__photo { margin:0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); position:relative; }
.intro-visual__photo::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.35); border-radius:inherit; pointer-events:none; }
.intro-visual__photo img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.soft-photo-row { display:grid; grid-template-columns:1.1fr .9fr; gap:1rem; margin:0 0 1.5rem; }
.soft-photo-row img { width:100%; height:clamp(150px,22vw,230px); object-fit:cover; border-radius:var(--radius-sm); box-shadow:var(--shadow-sm); }
.side-photo { margin:0; border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); }
.side-photo img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.visual-figure { margin:0 0 1.8rem; border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); background:#fff; }
.visual-figure img { width:100%; aspect-ratio:4/3; object-fit:cover; margin:0; border-radius:0; box-shadow:none; }
.visual-figure--wide img { aspect-ratio:16/9; }
.visual-figure--compact { max-width:640px; margin-inline:auto; }
/* 報酬基準ページのエントランス写真を明るく見せる（暗く見えるため補正） */
.visual-figure--bright img { filter: brightness(1.16) saturate(1.05); }
/* 料金表全体を整える：罫線は横のみ・語中で折り返さない・上下中央（早見表と同方向） */
.prose .pricing-table th,
.prose .pricing-table td { border:0; border-bottom:1px solid var(--line-2); padding:.72rem 1rem; vertical-align:middle; word-break:keep-all; line-height:1.55; }
.pricing-table tbody tr:last-child > * { border-bottom:0; }
/* 報酬基準：対応範囲 早見表（比較マトリクス）— 折り返し・レイアウトを整える */
.plan-matrix { table-layout: fixed; min-width: 560px; }
.plan-matrix thead th:first-child { width: 32%; }
.prose .plan-matrix th,
.prose .plan-matrix td { padding:.7rem .55rem; text-align:center; vertical-align:middle; word-break:keep-all; line-height:1.3; border:0; border-bottom:1px solid var(--line-2); }
.plan-matrix thead th { font-size:.82rem; background:var(--navy-700); color:#fff; }
.prose .plan-matrix tbody th[scope="row"] { text-align:left; font-size:.92rem; background:var(--bg-soft); }
.plan-matrix tbody td { font-size:1.1rem; }
.plan-matrix td.yes { color: var(--navy-600); font-weight:800; }
.plan-matrix td.no  { color: var(--ink-500); }
.plan-matrix th[scope="row"] a { color: var(--navy-700); font-weight:700; }
.plan-matrix th[scope="row"] a:hover { color: var(--navy-900); text-decoration: underline; }
@media (max-width:900px){ .intro-visual { grid-template-columns:1fr; } .intro-visual__photo { max-width:620px; margin-inline:auto; } }
@media (max-width:600px){ .soft-photo-row { grid-template-columns:1fr; } .soft-photo-row img { height:auto; aspect-ratio:16/9; } }
/* ブランドビジュアルバンド（トップページ／名刺と同じ絵。右の白場にコピーを重ねる） */
.brand-band { padding: clamp(2.2rem,5vw,3.6rem) 0 clamp(.5rem,2vw,1.5rem); background:#fff; }
.brand-band__inner { position:relative; }
.brand-band__art { margin:0; }
.brand-band__art img { display:block; width:100%; height:auto; }
.brand-band__copy { position:absolute; top:50%; right:2.5%; transform:translateY(-50%); width:min(46%,470px); }
.brand-band__en { font-family:var(--font-serif); letter-spacing:.14em; color:var(--gold-500); font-weight:700; font-size:.9rem; margin-bottom:.6rem; }
.brand-band__copy h2 { font-size:clamp(1.15rem,2.1vw,1.7rem); color:var(--navy-800); line-height:1.62; margin-bottom:.8rem; }
.brand-band__copy p { color:var(--ink-700); line-height:1.9; }
@media (max-width:900px){
  .brand-band__copy { position:static; transform:none; width:auto; max-width:620px; margin:1.2rem auto 0; text-align:center; }
  .brand-band__copy h2 br { display:none; }
}

/* スタッフ集合写真バンド（トップページ） */
.team-band__photo { margin:1.6rem auto 0; max-width:880px; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line); background:#fff; }
.team-band__photo img { display:block; width:100%; aspect-ratio: 5 / 4; object-fit: cover; object-position: center bottom; }

/* ---------- Stat band ---------- */
.statband { background: linear-gradient(120deg, var(--bg-navy-soft), #f8fdff); color:var(--ink-900); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.statband__grid { display:grid; grid-template-columns: repeat(4,1fr); text-align:center; }
.statband__item { padding: clamp(1.4rem,3vw,2.2rem) .8rem; border-right:1px solid var(--line); }
.statband__item:last-child { border-right:0; }
.statband__item b { display:block; font-family:var(--font-serif); font-size: clamp(2rem,5vw,2.8rem); color: var(--navy-700); line-height:1; }
.statband__item b i { font-style:normal; font-size:.5em; margin-left:.15em; color:var(--ink-500); }
.statband__item span { font-size:.85rem; color:var(--ink-700); }
@media (max-width: 760px){ .statband__grid { grid-template-columns: repeat(2,1fr);} .statband__item:nth-child(2){border-right:0;} .statband__item:nth-child(1),.statband__item:nth-child(2){border-bottom:1px solid var(--line);} }

/* ---------- Answer box (AIO 要約) ---------- */
.answer-box { background: var(--bg-navy-soft); border:1px solid #d8e2f1; border-left: 5px solid var(--navy-600); border-radius: var(--radius-sm); padding: 1.3rem 1.5rem; margin: 0 0 2rem; }
.answer-box__title { font-weight:700; color: var(--navy-700); margin:0 0 .6rem; font-size:1.02rem; display:flex; align-items:center; gap:.5rem; }
.answer-box__title::before { content:"✓"; display:inline-grid; place-items:center; width:1.4em; height:1.4em; background:var(--navy-600); color:#fff; border-radius:50%; font-size:.7em; }
.answer-box__lead { margin:.2rem 0 .6rem; color:var(--ink-700); }
.answer-box__list { margin:0; padding-left:1.2em; }
.answer-box__list li { color: var(--ink-700); }

/* ---------- Cards ---------- */
.card { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:1.6rem; box-shadow: var(--shadow-sm); transition: transform .18s, box-shadow .2s, border-color .2s; height:100%; }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color:#d4ddea; }
.card__icon { width:52px; height:52px; border-radius:13px; background: var(--bg-navy-soft); color: var(--navy-600); display:grid; place-items:center; margin-bottom:1rem; }
.card__icon .icon { width:26px; height:26px; }
.card__title { font-size:1.12rem; margin-bottom:.5rem; }
.card__text { color: var(--ink-700); font-size:.95rem; margin:0; }
.card--link { display:flex; flex-direction:column; }
.card--link .card__more { margin-top:auto; padding-top:1rem; color: var(--navy-600); font-weight:700; font-size:.9rem; display:inline-flex; align-items:center; gap:.35rem; }
.card--link:hover .card__more .icon { transform: translateX(3px); }
.card__more .icon { width:1em; height:1em; transition: transform .2s; }

/* service grid index numbers */
.svc-card { position:relative; }
.svc-card__no { position:absolute; top:1.1rem; right:1.2rem; font-family:var(--font-serif); font-weight:700; color:#eef2f8; font-size:2rem; line-height:1; }
.svc-card__tag { display:inline-block; font-size:.72rem; font-weight:700; color: var(--teal-500); background:#e8f4f2; padding:.18rem .6rem; border-radius:999px; margin-bottom:.7rem; }

/* ---------- Feature rows ---------- */
.feature-list { display:grid; gap:1.2rem; }
.feature-item { display:grid; grid-template-columns: auto 1fr; gap:1.2rem; background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:1.5rem 1.6rem; box-shadow: var(--shadow-sm); }
.feature-item__no { font-family:var(--font-serif); font-weight:700; font-size:1.5rem; color: var(--gold-500); width:54px; height:54px; border-radius:50%; border:2px solid var(--gold-400); display:grid; place-items:center; }
.feature-item h3 { margin-bottom:.4rem; }
.feature-item p { margin:0; color: var(--ink-700); }

/* ---------- Pricing tables ---------- */
.pricing-block { margin-bottom: 2.4rem; }
.pricing-block__title { font-size:1.2rem; color:var(--navy-700); padding-bottom:.5rem; border-bottom:2px solid var(--gold-400); display:inline-block; }
.pricing-block__note { color: var(--ink-500); font-size:.9rem; margin:.6rem 0 1rem; }
.table-scroll { overflow-x:auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius-sm); border:1px solid var(--line); }
.pricing-table { width:100%; border-collapse: collapse; font-size:.95rem; background:#fff; min-width: 380px; }
.pricing-table th, .pricing-table td { padding:.7rem 1rem; text-align:left; border-bottom:1px solid var(--line-2); }
.pricing-table thead th { background: var(--navy-700); color:#fff; font-weight:700; position:sticky; top:0; }
.pricing-table tbody th { font-weight:600; color: var(--ink-900); background: var(--bg-soft); width: 45%; }
.pricing-table tbody td { color: var(--navy-700); font-weight:600; }
.pricing-table tbody tr:hover { background: #fbfcfe; }
/* prose 内の汎用 table 見出しスタイル（薄い背景）に上書きされ、白文字が見えなくなるのを防ぐ */
.prose .pricing-table thead th { background: var(--navy-700); color:#fff; }

/* ---------- FAQ accordion ---------- */
.faq-list { display:grid; gap:.8rem; }
.faq-item { border:1px solid var(--line); border-radius: var(--radius-sm); background:#fff; overflow:hidden; }
.faq-q { width:100%; text-align:left; background:none; border:0; padding:1.1rem 3rem 1.1rem 3.2rem; font-size:1.02rem; font-weight:700; color: var(--navy-800); cursor:pointer; position:relative; line-height:1.6; }
.faq-q::before { content:"Q"; position:absolute; left:1.1rem; top:1rem; width:1.7em; height:1.7em; background: var(--navy-700); color:#fff; border-radius:8px; display:grid; place-items:center; font-family:var(--font-serif); font-size:.85em; }
.faq-q::after { content:""; position:absolute; right:1.2rem; top:50%; width:11px; height:11px; border-right:2px solid var(--navy-500); border-bottom:2px solid var(--navy-500); transform: translateY(-60%) rotate(45deg); transition: transform .25s; }
.faq-item.is-open .faq-q::after { transform: translateY(-30%) rotate(225deg); }
.faq-a { max-height:0; overflow:hidden; transition: max-height .3s ease; }
.faq-a__inner { padding:0 1.4rem 1.2rem 3.2rem; color: var(--ink-700); position:relative; }
.faq-a__inner::before { content:"A"; position:absolute; left:1.1rem; top:0; width:1.7em; height:1.7em; background: var(--gold-500); color:#fff; border-radius:8px; display:grid; place-items:center; font-family:var(--font-serif); font-size:.85em; }

/* ---------- Page hero (下層共通) ---------- */
.page-hero { background:
  linear-gradient(120deg, rgba(232,247,251,.96), rgba(205,237,246,.90)),
  url(../img/photos/entrance.webp) center right / cover no-repeat;
  color:var(--navy-900); position:relative; overflow:hidden; }
.page-hero::after { content:""; position:absolute; inset:0; background:
  radial-gradient(700px 380px at 88% -20%, rgba(34,184,207,.20), transparent 60%),
  linear-gradient(90deg, rgba(255,255,255,.34), rgba(255,255,255,.08)); }
.page-hero__inner { position:relative; z-index:1; padding: clamp(2.4rem,6vw,4rem) 0; }
.page-hero__en { font-family:var(--font-serif); letter-spacing:.18em; color: var(--navy-600); font-weight:700; font-size:.82rem; }
.page-hero__title { font-size: clamp(1.7rem,4vw,2.6rem); color:var(--navy-900); margin:.4rem 0 .6rem; }
.page-hero__lead { color:var(--ink-700); max-width:60ch; margin:0; }

/* ---------- Breadcrumb ---------- */
.breadcrumb { font-size:.82rem; color: var(--ink-500); padding:.9rem 0; }
.breadcrumb ol { list-style:none; display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0; }
.breadcrumb li { display:flex; align-items:center; gap:.4rem; }
.breadcrumb li:not(:last-child)::after { content:"›"; color: var(--ink-300); }
.breadcrumb a { color: var(--ink-500); }
.breadcrumb a:hover { color: var(--navy-600); }
.breadcrumb [aria-current="page"] { color: var(--ink-700); }

/* ---------- Article / prose ---------- */
.prose { font-size: 1.02rem; }
.prose h2 { font-size: clamp(1.35rem,2.6vw,1.75rem); margin-top: 2.4rem; padding-left:.9rem; border-left:5px solid var(--gold-500); }
.prose h3 { font-size:1.2rem; margin-top:1.8rem; color:var(--navy-700); }
.prose h3::before { content:"●"; color: var(--gold-500); font-size:.7em; margin-right:.5em; vertical-align:middle; }
.prose h4 { font-size:1.05rem; margin:1.5rem 0 .3rem; color:var(--navy-800); font-weight:700; }
.prose h4::before { content:"▸"; color:var(--gold-500); margin-right:.4em; font-size:.9em; }
.prose ul { padding-left:0; list-style:none; }
/* 金色シェブロンは「クラスなしの本文リスト」だけに適用（industry-tags / legend 等のUIを崩さない） */
.prose ul:not([class]) > li { position:relative; padding-left:1.7em; }
.prose ul:not([class]) > li::before { content:""; position:absolute; left:.2em; top:.62em; width:9px; height:9px; border-right:2px solid var(--gold-500); border-bottom:2px solid var(--gold-500); transform: rotate(45deg); }
.prose ol { padding-left:1.4em; }
.prose blockquote { margin:1.6rem 0; padding:1.2rem 1.4rem; background: var(--bg-soft); border-left:4px solid var(--navy-500); border-radius:0 8px 8px 0; color:var(--ink-700); }
.prose table { width:100%; border-collapse:collapse; margin:1.4rem 0; }
.prose table th, .prose table td { border:1px solid var(--line); padding:.65rem .9rem; text-align:left; }
.prose table thead th { background: var(--bg-navy-soft); }
.prose img { border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); margin: 1.4rem 0; }
.prose .checklist { display:grid; gap:.6rem; padding:0; }
.prose .checklist li { position:relative; padding-left:2em; }
.prose .checklist li::before { content:"✓"; position:absolute; border:0; transform:none; left:0; top:.15em; color:#fff; background: var(--teal-500); border-radius:50%; width:1.4em; height:1.4em; display:grid; place-items:center; font-size:.8em; }

/* callout in prose */
.callout { display:flex; gap:1rem; background: var(--bg-navy-soft); border:1px solid #d8e2f1; border-radius: var(--radius-sm); padding:1.2rem 1.4rem; margin:1.6rem 0; }
.callout__icon { flex:0 0 auto; color: var(--navy-600); }
.callout strong { color: var(--navy-700); }

/* two-column content layout */
.content-wrap { display:grid; grid-template-columns: 1fr 300px; gap: clamp(1.5rem,4vw,3rem); align-items:start; }
.content-aside { position: sticky; top: calc(var(--header-h) + 1rem); display:grid; gap:1.2rem; }
@media (max-width: 980px){ .content-wrap { grid-template-columns:1fr; } .content-aside { position: static; } }

/* aside widgets */
.widget { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:1.3rem; box-shadow: var(--shadow-sm); }
.widget--cta { background: linear-gradient(150deg,var(--bg-navy-soft),#f8fdff); color:var(--ink-700); border:1px solid var(--line); }
.widget--cta h3 { color:var(--navy-800); }
.widget--cta p { color:var(--ink-700); font-size:.9rem; }
.widget__title { font-size:1rem; margin-bottom:.9rem; padding-bottom:.5rem; border-bottom:1px solid var(--line); }
.widget__nav { list-style:none; padding:0; margin:0; }
.widget__nav li { margin:0; border-bottom:1px solid var(--line-2); }
.widget__nav a { display:block; padding:.6rem .2rem; font-size:.92rem; color:var(--ink-700); font-weight:500; }
.widget__nav a:hover { color: var(--navy-600); }
.widget__nav .current a { color: var(--navy-700); font-weight:700; }

/* ---------- CTA band ---------- */
.cta-band { background: linear-gradient(120deg, var(--bg-navy-soft), #f8fdff); color:var(--ink-900); text-align:center; position:relative; overflow:hidden; border-top:1px solid var(--line); }
.cta-band::after { content:""; position:absolute; inset:0; background: radial-gradient(600px 300px at 50% -30%, rgba(103,216,232,.22), transparent 60%); }
.cta-band__inner { position:relative; z-index:1; padding: clamp(2.6rem,6vw,4rem) 0; }
.cta-band h2 { color:var(--navy-900); font-size: clamp(1.4rem,3vw,2rem); }
.cta-band p { color:var(--ink-700); max-width: 56ch; margin-inline:auto; }
.cta-band__contacts { display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; margin-top:1.6rem; }
.cta-tel { background: rgba(255,255,255,.72); border:1px solid rgba(19,125,166,.18); border-radius: var(--radius); padding:.7rem 1.4rem; text-align:left; box-shadow: var(--shadow-sm); }
.cta-tel small { display:block; font-size:.72rem; color:var(--ink-500); }
.cta-tel b { display:flex; align-items:center; gap:.45rem; font-family:var(--font-serif); font-size:1.5rem; color:var(--navy-800); }

/* ---------- Voice / testimonial ---------- */
.voice-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:1.6rem; box-shadow: var(--shadow-sm); position:relative; }
.voice-card__quote { color: var(--gold-400); position:absolute; top:1rem; right:1.2rem; }
.voice-card__cat { font-size:.74rem; font-weight:700; color: var(--navy-600); background: var(--bg-navy-soft); padding:.2rem .7rem; border-radius:999px; }
.voice-card__title { font-size:1.05rem; margin:.7rem 0 .5rem; }
.voice-card__meta { font-size:.82rem; color:var(--ink-500); margin-top:1rem; border-top:1px solid var(--line-2); padding-top:.8rem; }

/* ---------- News list ---------- */
.news-list { list-style:none; padding:0; margin:0; }
.news-list li { border-bottom:1px solid var(--line); }
.news-list a { display:grid; grid-template-columns: auto auto 1fr; gap:1rem; align-items:center; padding:1rem .3rem; color:var(--ink-900); }
.news-list a:hover { color:var(--navy-600); }
.news-date { font-size:.85rem; color:var(--ink-500); font-variant-numeric: tabular-nums; }
.news-cat { font-size:.72rem; font-weight:700; color:#fff; background: var(--navy-600); padding:.18rem .7rem; border-radius:999px; white-space:nowrap; }
.news-cat--blog { background: var(--gold-500); }
@media (max-width:600px){ .news-list a { grid-template-columns: auto 1fr; } .news-list .news-title { grid-column:1 / -1; } }

/* ---------- Access / map ---------- */
.access-grid { display:grid; grid-template-columns: 1fr 1fr; gap: var(--gap); align-items:start; }
@media (max-width: 820px){ .access-grid { grid-template-columns:1fr; } }
.info-table { width:100%; border-collapse:collapse; }
.info-table th, .info-table td { padding:.85rem 0; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.info-table th { width: 34%; color: var(--navy-700); font-weight:700; }
.map-embed { aspect-ratio: 4/3; border-radius: var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow: var(--shadow-sm); }
.map-embed iframe { width:100%; height:100%; border:0; }

/* ---------- Form ---------- */
.form-field { margin-bottom:1.2rem; }
.form-field label { display:block; font-weight:700; color: var(--navy-700); margin-bottom:.4rem; font-size:.95rem; }
.form-field .req { color:#c0392b; font-size:.78rem; margin-left:.4rem; }
.form-field input, .form-field select, .form-field textarea { width:100%; padding:.75rem .9rem; border:1px solid var(--line); border-radius: var(--radius-sm); font-family:inherit; font-size:1rem; background:#fff; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color: var(--navy-500); outline:none; box-shadow:0 0 0 3px rgba(47,74,134,.12); }
.form-note { font-size:.85rem; color: var(--ink-500); }
.form-title { margin-top:0; font-size: clamp(1.35rem,2.6vw,1.75rem); color: var(--navy-700); }
.form-alert { padding:.9rem 1rem; border-radius: var(--radius-sm); font-weight:700; }
.form-alert--success { background:#eefaf5; color:#176b54; border:1px solid #bde8d8; }
.form-alert--error { background:#fff3f1; color:#a33b2f; border:1px solid #f1c3bd; }
.contact-form .form-field .radio-group { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:.65rem 1.6rem; }
.contact-form .form-field .radio-group label { display:inline-flex; width:auto; align-items:center; gap:.45rem; margin:0; color: var(--ink-700); font-weight:600; line-height:1.5; white-space:nowrap; }
.contact-form .form-field .checkbox-label { display:inline-flex; width:auto; align-items:flex-start; gap:.55rem; margin:0; color: var(--ink-700); font-weight:600; line-height:1.7; }
.contact-form .form-field .radio-group input[type="radio"], .contact-form .form-field .checkbox-label input[type="checkbox"] { width:auto; min-width:1em; margin:.2em 0 0; padding:0; flex:0 0 auto; }

/* ---------- Process steps ---------- */
.steps { display:grid; gap:1.1rem; counter-reset: step; }
.step { display:grid; grid-template-columns:auto 1fr; gap:1.1rem; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem 1.5rem; }
.step__no { counter-increment: step; width:46px; height:46px; border-radius:50%; background: var(--navy-700); color:#fff; display:grid; place-items:center; font-family:var(--font-serif); font-weight:700; }
.step__no::before { content: counter(step); }
.step h3 { margin-bottom:.3rem; font-size:1.08rem; }
.step p { margin:0; color:var(--ink-700); font-size:.95rem; }

/* ---------- Tags / chips ---------- */
.chips { display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; padding:0; }
.chips li a, .chip { display:inline-block; padding:.35rem .9rem; background:#fff; border:1px solid var(--line); border-radius:999px; font-size:.86rem; color:var(--ink-700); }
.chips li a:hover { border-color: var(--navy-500); color: var(--navy-600); }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-900); color:#aab6cc; font-size:.92rem; }
.footer-top { padding: clamp(2.6rem,6vw,4rem) 0 2.4rem; }
.footer-grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:2rem; }
.footer-brand .brand__name { color:#fff; }
.footer-brand .brand__name small { color:#8fa0bd; }
.footer-brand .brand__img { height:46px; width:auto; max-width:100%; }
.footer-brand p { margin:1rem 0; color:#9fb0cc; font-size:.88rem; }
.footer-contact { display:grid; gap:.4rem; font-size:.9rem; }
.footer-contact b { color:#fff; font-family:var(--font-serif); font-size:1.25rem; }
.footer-col h4 { color:#fff; font-size:.95rem; margin-bottom:1rem; }
.footer-col ul { list-style:none; padding:0; margin:0; }
.footer-col li { margin-bottom:.55rem; }
.footer-col a { color:#aab6cc; }
.footer-col a:hover { color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding:1.1rem 0 1.3rem; font-size:.82rem; color:#8294b3; }
.footer-bottom__inner { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; width:min(100% - 2rem,var(--maxw)); }
.footer-trust { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1.4rem 3rem; margin-bottom:1rem; }
.footer-trust__item { display:grid; place-items:center; width:4.9rem; height:4.9rem; margin:0; padding:.35rem; border-radius:8px; background:#fff; border:1px solid rgba(255,255,255,.16); }
.footer-trust__item img { display:block; width:100%; height:100%; object-fit:contain; }
.footer-bottom a { color:#8294b3; }
.footer-bottom a:hover { color:#fff; }
@media (max-width: 880px){ .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px){ .footer-grid { grid-template-columns: 1fr; } .footer-trust { justify-content:flex-start; gap:1.1rem 1.8rem; } .footer-trust__item { width:4.4rem; height:4.4rem; } }

/* ---------- Floating contact (mobile) ---------- */
.float-cta { position: fixed; bottom:0; left:0; right:0; z-index:80; display:none; grid-template-columns:1fr 1fr; gap:1px; background: var(--line); box-shadow: 0 -4px 20px rgba(0,0,0,.1); }
.float-cta a { padding:.9rem; text-align:center; font-weight:700; font-size:.92rem; display:flex; align-items:center; justify-content:center; gap:.4rem; }
.float-cta__tel { background:#fff; color: var(--navy-700); }
.float-cta__contact { background: var(--gold-500); color:#053142; }
@media (max-width: 1080px){ .float-cta { display:grid; } body { padding-bottom: 56px; } }
/* デスクトップ用 追従お問い合わせボタン（全ページ右下に常時表示） */
.float-contact { position:fixed; right:22px; bottom:26px; z-index:80; display:none; align-items:center; gap:.6rem; padding:.85rem 1.3rem; background:var(--gold-500); color:#053142; font-weight:700; border-radius:999px; box-shadow:0 10px 26px rgba(5,49,66,.26); transition:transform .15s ease, box-shadow .15s ease, opacity .25s ease, visibility .25s ease; }
.float-contact:hover { transform:translateY(-2px); box-shadow:0 14px 32px rgba(5,49,66,.32); color:#053142; }
.float-contact span { display:flex; flex-direction:column; line-height:1.2; font-size:1rem; }
.float-contact small { font-weight:500; font-size:.72rem; opacity:.85; }
@media (min-width:1081px){
  /* 追従ボタンはDOM上は常設だが、既定は非表示。JSが .is-shown を付けた時だけフェード表示 */
  .float-contact { display:inline-flex; opacity:0; visibility:hidden; pointer-events:none; }
  .float-contact.is-shown { opacity:1; visibility:visible; pointer-events:auto; }
}

/* ---------- Utility ---------- */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}
.tag-line { width:48px; height:3px; background: var(--gold-500); border-radius:2px; margin:.6rem auto 0; }
.sec-head--left .tag-line { margin-left:0; }
.bg-pattern { background-image: radial-gradient(var(--line) 1px, transparent 1px); background-size: 22px 22px; }

/* ---------- Pagination ---------- */
.pagination { display:flex; flex-wrap:wrap; gap:.4rem; justify-content:center; }
.pagination .page-numbers { display:inline-grid; place-items:center; min-width:42px; height:42px; padding:0 .6rem; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--navy-700); font-weight:600; }
.pagination .page-numbers.current { background: var(--navy-700); color:#fff; border-color: var(--navy-700); }
.pagination a.page-numbers:hover { border-color: var(--navy-500); color: var(--navy-600); }

/* ---------- Search form ---------- */
.search-form { display:flex; gap:.5rem; }
.search-form input[type="search"] { flex:1; padding:.7rem .9rem; border:1px solid var(--line); border-radius: var(--radius-sm); font-size:1rem; }
.screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- Contact form ---------- */
.contact-form { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding: clamp(1.4rem,4vw,2.2rem); box-shadow: var(--shadow-sm); }

/* ---------- WP alignment / blocks ---------- */
.aligncenter { margin-inline:auto; }
.alignright { float:right; margin:0 0 1rem 1.5rem; }
.alignleft { float:left; margin:0 1.5rem 1rem 0; }
.wp-caption-text { font-size:.85rem; color: var(--ink-500); text-align:center; }

/* ---------- 代表挨拶（greeting） ---------- */
.greeting { display:grid; grid-template-columns: 230px 1fr; gap:2.2rem; align-items:start; margin:.5rem 0 1rem; }
.greeting__photo { margin:0; }
.greeting__photo img { width:100%; border-radius: var(--radius-sm); box-shadow: var(--shadow); margin:0; }
.greeting__role { color: var(--ink-500); font-size:.92rem; margin:0 0 .2rem; }
.greeting__name { font-family: var(--font-serif); font-size:1.6rem; color: var(--navy-800); margin:0 0 1.3rem; line-height:1.3; }
.greeting__name span { font-size:.85rem; color: var(--ink-500); margin-left:.7rem; letter-spacing:.04em; }
.greeting__body p:not(.greeting__role):not(.greeting__name) { margin:0 0 1.1em; }
@media (max-width:640px){ .greeting{ grid-template-columns:1fr; gap:1.2rem; } .greeting__photo{ max-width:210px; } }

/* ---------- 社員紹介（people） ---------- */
.people-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:1.6rem; margin:1.2rem 0 1rem; }
.people-grid--role { grid-template-columns: repeat(3,1fr); }
.person-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius-sm); overflow:hidden; box-shadow: var(--shadow-sm); }
.person-card img { width:100%; aspect-ratio:3/4; object-fit:cover; display:block; margin:0; border-radius:0; box-shadow:none; }
.person-card__body { padding:1rem 1.1rem 1.2rem; }
.person-card__role { color: var(--gold-500); font-size:.78rem; font-weight:700; letter-spacing:.04em; margin:0; }
.person-card__name { font-family:var(--font-serif); font-size:1.2rem; color:var(--navy-800); margin:.15rem 0 .55rem; }
.person-card__bio { font-size:.9rem; color: var(--ink-700); line-height:1.85; margin:0; }
@media (max-width:760px){ .people-grid--role { grid-template-columns: repeat(2,1fr);} }
@media (max-width:520px){ .people-grid, .people-grid--role { grid-template-columns: 1fr 1fr; gap:1rem; } .person-card__bio{ display:none; } }

/* ---------- 主な取引先（partner） ---------- */
.partner-stat { display:flex; align-items:baseline; gap:.6rem; justify-content:center; background:var(--bg-navy-soft); border:1px solid #d8e2f1; border-radius:var(--radius); padding:1.4rem; margin:1rem 0 2rem; }
.partner-stat b { font-family:var(--font-serif); font-size: clamp(2.4rem,6vw,3.4rem); color:var(--navy-700); line-height:1; }
.partner-stat span { color:var(--ink-600,#566); font-weight:700; }
.chart-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; margin:1rem 0 2rem; }
.chart-card { border:1px solid var(--line); border-radius:var(--radius-sm); padding:1rem 1rem 1.2rem; background:#fff; text-align:center; }
.chart-card h3 { font-size:1rem; color:var(--navy-700); margin:0 0 .8rem; }
.chart-card h3::before { content:none; }
.chart-card img { width:100%; max-width:420px; margin:0 auto; border-radius:6px; box-shadow:none; }
.donut-wrap { display:flex; align-items:center; justify-content:center; gap:1.2rem; flex-wrap:wrap; }
.donut { width:168px; height:168px; flex:0 0 auto; }
.chart-canvas-wrap { position:relative; width:184px; height:184px; flex:0 0 auto; }
.donut__num { font-family:var(--font-serif); font-size:34px; font-weight:700; fill:var(--navy-700); }
.donut__cap { font-size:13px; fill:var(--ink-500); }
.legend { list-style:none; padding:0; margin:0; text-align:left; font-size:.85rem; display:grid; gap:.4rem; min-width:170px; }
.legend li { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.5rem; color:var(--ink-700); }
.legend__sw { width:12px; height:12px; border-radius:3px; display:inline-block; }
.legend b { color:var(--navy-700); font-size:.9rem; }
.legend em { color:var(--ink-500); font-style:normal; font-size:.78rem; }
@media (max-width:640px){ .chart-grid{ grid-template-columns:1fr; } }
.bar-chart { display:grid; gap:.7rem; margin:1.2rem 0 2rem; }
.bar-row { display:grid; grid-template-columns: 9.5em 1fr auto; align-items:center; gap:.8rem; }
.bar-row__label { font-size:.9rem; color:var(--ink-700); font-weight:600; }
.bar-row__track { background:var(--bg-soft); border-radius:999px; height:1.5rem; position:relative; overflow:hidden; }
.bar-row__fill { height:100%; background:linear-gradient(90deg,var(--navy-600),var(--blue-400)); border-radius:999px; min-width:.5rem; }
.bar-row__val { font-size:.9rem; font-weight:700; color:var(--navy-700); text-align:right; min-width:3em; font-variant-numeric:tabular-nums; }
@media (max-width:640px){
	.bar-row { grid-template-columns:1fr auto; grid-template-areas:"label label" "track val"; row-gap:.35rem; column-gap:.7rem; }
	.bar-row__label { grid-area:label; }
	.bar-row__track { grid-area:track; }
	.bar-row__val { grid-area:val; }
}
.industry-tags { display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; padding:0; margin:1rem 0 2rem; }
.industry-tags li { background:#fff; border:1px solid var(--line); border-radius:999px; padding:.4rem 1rem; font-size:.88rem; color:var(--navy-700); font-weight:600; }
/* 得意分野グリッド（トップ） */
.field-grid { list-style:none; padding:0; margin:0 0 2rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.field-grid li { background:#fff; border:1px solid var(--line); border-left:3px solid var(--gold-500); border-radius:var(--radius-sm); padding:1rem 1.2rem; box-shadow:var(--shadow-sm); }
.field-grid li b { display:block; color:var(--navy-700); font-size:1.06rem; margin-bottom:.25rem; }
.field-grid li span { font-size:.88rem; color:var(--ink-500); line-height:1.7; }
.field-tags-label { font-weight:700; color:var(--navy-700); margin:0 0 .6rem; }
@media (max-width:760px){ .field-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .field-grid{ grid-template-columns:1fr; } }

/* ---------- Trust badges ---------- */
.trust-section { border-top:1px solid var(--line); }
.trust-badges { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.trust-badge { background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:1.3rem; box-shadow:var(--shadow-sm); min-height:100%; }
.trust-badge__mark { display:grid; place-items:center; width:7.2rem; height:7.2rem; padding:.45rem; margin:0 0 .9rem; border:1px solid var(--line); border-radius:8px; background:#fff; }
.trust-badge__mark img { display:block; width:100%; height:100%; object-fit:contain; }
.trust-badge b { display:block; color:var(--navy-700); margin-bottom:.35rem; }
.trust-badge p { margin:0; color:var(--ink-700); font-size:.9rem; line-height:1.75; }
@media (max-width:760px){ .trust-badges { grid-template-columns:1fr; } .trust-badge__mark { width:6.4rem; height:6.4rem; } }
/* 事務所紹介の写真ギャラリー（さりげない訴求） */
.office-gallery { margin:1.6rem 0 .5rem; display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }
.office-gallery img { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--radius-sm); margin:0; box-shadow:var(--shadow-sm); }
.office-gallery figcaption { grid-column:1/-1; text-align:center; font-size:.86rem; color:var(--ink-500); margin-top:.5rem; }
@media (max-width:600px){ .office-gallery{ grid-template-columns:1fr 1fr; } .office-gallery img:nth-child(3){ grid-column:1 / -1; aspect-ratio:16/9; } }
/* 代表メッセージ（トップ・柔らかい雰囲気の演出） */
.rep-message { display:grid; grid-template-columns:230px 1fr; gap:2.2rem; align-items:center; background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(1.5rem,4vw,2.6rem); }
.rep-message__photo { margin:0; }
.rep-message__photo img { width:100%; border-radius:var(--radius-sm); box-shadow:var(--shadow); }
.rep-message__title { font-size:clamp(1.4rem,3vw,1.9rem); margin:.2rem 0 1rem; }
.rep-message__body p { margin:0 0 1rem; }
.rep-message__sign { font-family:var(--font-serif); color:var(--navy-700); font-size:1.05rem; }
@media (max-width:680px){ .rep-message{ grid-template-columns:1fr; text-align:center; gap:1.4rem; } .rep-message__photo{ max-width:190px; margin:0 auto; } .rep-message__sign{ text-align:center; } }
.client-table th[scope="row"] { font-weight:600; }
.client-table td.is-on { color:var(--teal-500); font-weight:700; text-align:center; }

/* ---------- WP alignment / blocks ---------- */
.aligncenter { margin-inline:auto; }
.alignright { float:right; margin:0 0 1rem 1.5rem; }
.alignleft { float:left; margin:0 1.5rem 1rem 0; }
.wp-caption-text { font-size:.85rem; color: var(--ink-500); text-align:center; }

/* reduce motion */
@media (prefers-reduced-motion: reduce){ * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
