/* Dancelang B案 — 参考：kashiwasato.com（2026-11-11 大輔の AI）
   白地に墨の小さな文字。角丸なし・箱の地色なし・線なし（区切りは余白だけ）。
   差し色のオレンジは点と、いま居るページの印だけ。
   中身（HTML）は叩き台（A案）と同じで、見た目だけをこの CSS と b.js で変えている。 */
:root {
  --ink: #111111;
  --sub: #8a8a8a;
  --faint: #b9b9b9;
  --bg: #ffffff;
  --tile: #f4f4f2;
  --accent: #f28c28;
  --latin: "Jost", "Helvetica Neue", Arial, sans-serif;
  --jp: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;
  --gut: 48px;
}
* { box-sizing: border-box; border-radius: 0 !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--latin), var(--jp); font-weight: 400;
  font-size: 14.5px; line-height: 1.95; letter-spacing: .03em;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
.wrap { max-width: 1240px; margin: 0 auto; padding: 0 var(--gut); }
.sp { display: none; }

/* ---- ヘッダー：左に名前、右に小さな英字のメニュー ---- */
.site-head {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  max-width: 1240px; margin: 0 auto; padding: 30px var(--gut) 26px;
  position: sticky; top: 0; background: var(--bg); z-index: 5;
}
.logo { font-family: var(--latin); font-weight: 500; font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; display: inline-flex; align-items: center; }
.site-head .logo::before { content: ""; width: 22px; height: 6px; background: var(--accent); margin-right: 16px; transition: width .15s; }  /* 藍子さん 2026-11-13「見積もりのボタンの棒線と同じオレンジに」 */
.site-head .logo:hover::before { width: 30px; }
.site-head .logo::after { content: "EN ⇄ JA Translation"; color: var(--sub); font-weight: 400; margin-left: 18px; letter-spacing: .14em; }
.site-head nav { min-width: 0; }
.site-head ul { list-style: none; display: flex; gap: 22px; margin: 0; padding: 0; font-family: var(--latin); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; }
.site-head ul a { color: var(--sub); transition: color .15s; }
.site-head ul a:hover, .site-head ul a[aria-current] { color: var(--ink); }
.site-head .lang a { color: var(--sub); }
.site-head .lang::before { content: "LANGUAGE : "; color: var(--faint); }

/* 右上に固定のメールのアイコン（参考：liaison-jp.com）。墨の四角に白い細線の封筒、乗せるとオレンジ */
.mail-ico {
  position: fixed; top: 0; right: 0; z-index: 20; width: 64px; height: 64px;
  display: grid; place-items: center; background: var(--ink); color: #fff; transition: background .2s;
}
.mail-ico:hover, .mail-ico:focus-visible { background: var(--accent); color: #fff; outline: none; }
.site-head { padding-right: calc(var(--gut) + 64px); }

/* ---- 草原：大きな見出しではなく、細い帯 ---- */
.hero { max-width: 1240px; margin: 0 auto; padding: 0 var(--gut); }
.hero img { width: 100%; height: clamp(120px, 18vw, 220px); object-fit: cover; object-position: center 62%; }

/* メインイメージ（ひし形の構成）。見出しは画像の中の白いひし形（中心 75%・47%）に重ねる */
.hero-mv { position: relative; max-width: 1600px; padding: 0; }
.hero-mv img { width: 100%; height: auto; object-fit: initial; }
.mv-copy { position: absolute; left: 75.2%; top: 47.2%; transform: translate(-50%, -50%); width: 27%; text-align: center; }
.mv-copy h1 { margin: 0; font-size: clamp(15px, 1.75vw, 28px); line-height: 1.85; letter-spacing: .08em; font-weight: 500; }
.mv-copy .sp { display: inline; } /* 「ブランドを日本へ、」のあとで折り返して3行に（「へ。」だけが残らないように） */
.hero-mv + .intro { padding-top: 56px; }

/* ---- はじめの言葉 ---- */
.intro { padding-top: 72px; padding-bottom: 8px; display: grid; grid-template-columns: 1fr 1.2fr; column-gap: 64px; align-items: start; }
.intro > * { grid-column: 2; }
.intro .kicker { grid-column: 1; grid-row: 1 / span 4; }
.kicker { font-family: var(--latin); font-size: 11.5px; letter-spacing: .18em; color: var(--sub); margin: 0 0 14px; text-transform: uppercase; }
h1 { font-weight: 400; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.7; letter-spacing: .06em; margin: 0 0 22px; }
.role { color: var(--sub); margin: 0 0 22px; font-size: 13px; letter-spacing: .06em; }
.lead { max-width: 640px; margin: 0 0 34px; }
.btn {
  display: inline-flex; align-items: center; gap: 14px; background: none; color: var(--ink);
  padding: 0; font-family: var(--latin), var(--jp); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase;
}
.btn::before { content: ""; width: 22px; height: 6px; background: var(--accent); transition: width .15s; }
.btn:hover::before { width: 36px; }
.btn:hover { color: var(--ink); background: none; }

/* ---- 数字：箱なし、細い大きな数字だけ ---- */
.numbers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding-top: 96px; padding-bottom: 16px; }
.numbers div { background: none; padding: 0; }
.numbers b { display: block; font-family: var(--latin); font-weight: 300; font-size: clamp(34px, 4vw, 56px); line-height: 1.1; color: var(--ink); letter-spacing: .02em; }
.numbers small { font-family: var(--jp); font-size: 12px; margin-left: 4px; color: var(--sub); font-weight: 400; }
.numbers span { display: block; margin-top: 10px; font-size: 12px; color: var(--sub); letter-spacing: .08em; }

/* ---- 区切りの見出し：小さな英字だけ ---- */
.block { padding-top: 96px; padding-bottom: 0; }
.sec { font-family: var(--latin); font-weight: 500; font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); margin: 0 0 32px; display: flex; align-items: center; gap: 14px; }
.sec::before { content: ""; width: 6px; height: 6px; background: var(--accent); }
.block .list + .sec { margin-top: 56px; }

/* サービス：4つの列。箱なし */
.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.card { display: block; background: none; padding: 0; }
.card h3 { font-size: 14.5px; font-weight: 500; margin: 0 0 10px; letter-spacing: .06em; }
.card p { font-size: 12.5px; color: var(--sub); margin: 0; line-height: 1.9; }
.card:hover h3 { color: var(--ink); }
.card .svc { display: block; font-size: 11px; letter-spacing: .16em; color: var(--sub); margin-bottom: 14px; }
.card .svc::before { content: ""; display: inline-block; width: 14px; height: 4px; background: var(--accent); margin-right: 10px; vertical-align: 3px; transition: width .15s; }
.card:hover .svc::before { width: 26px; }
.card h3 { font-size: 16.5px; line-height: 1.65; margin-bottom: 12px; word-break: keep-all; }
.card p { font-size: 12.5px; }
/* 出版翻訳 */
.pub-lead { max-width: 640px; margin: 0 0 28px; }
.books { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.books li { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, .8fr); gap: 4px 32px; align-items: baseline; }
.books .who { font-weight: 500; font-size: 15px; }
.books .what, .books .pub { font-size: 12.5px; color: var(--sub); }
@media (max-width: 640px) { .books li { grid-template-columns: 1fr; } }
/* これまでの翻訳量：1つだけ大きく */
.total { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px 28px; margin: 0 0 56px; }
.total-num { margin: 0; line-height: 1; }
.total-num b { font-family: var(--latin); font-weight: 300; font-size: clamp(64px, 9vw, 128px); letter-spacing: -.01em; }
.total-num small { font-size: 15px; margin-left: 8px; letter-spacing: .08em; }
.total-cap { margin: 0 0 10px; color: var(--sub); font-size: 13px; max-width: 520px; }

/* 分野：丸い札ではなく、点で区切った1行 */
.chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 0; margin: 0; padding: 0; font-size: 13px; }
.chips li { background: none; color: var(--ink); padding: 0; }
.chips li:not(:last-child)::after { content: "・"; color: var(--faint); margin: 0 .6em; }

/* 続いている案件：作品の一覧のようなマス目。1件ずつ同じ書き方（クレジット） */
.projects { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px 32px; }
.projects li { display: flex; flex-direction: column; gap: 0; background: none; padding: 0; min-width: 0; }
.projects li::before {
  content: ""; display: block; aspect-ratio: 1 / 1; background: var(--tile); margin-bottom: 18px;
  background-image: linear-gradient(var(--accent), var(--accent)); background-size: 22px 6px; background-repeat: no-repeat; background-position: 18px 18px;
  transition: background-size .25s;
}
.projects li:hover::before { background-size: 44px 6px; }
.projects li.has-img::before { display: none; }
.projects li img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; margin-bottom: 18px; background: var(--tile); transition: opacity .3s; }
.projects li:hover img { opacity: .85; }
.projects .who { font-family: var(--latin), var(--jp); font-weight: 500; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 10px; }
.projects .what, .projects .how { font-size: 11.5px; color: var(--sub); line-height: 1.8; text-align: left; }
.projects .what::before { content: "Work : "; color: var(--faint); }
.projects .how::before { content: "Volume : "; color: var(--faint); }
.more { margin: 40px 0 0; }
.more a, .site-foot a { transition: color .15s; }
.more a { font-family: var(--latin), var(--jp); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
.more a:hover { color: var(--accent); }
.list { margin: 0 0 8px; padding-left: 1.2em; }
.list li { margin: 6px 0; }
.list b { font-weight: 500; margin-right: .6em; }
.note { color: var(--sub); font-size: 13px; }

/* よくある質問：箱なし、行だけ */
.faq details { background: none; padding: 0; margin: 0 0 18px; max-width: 760px; }
.faq summary { cursor: pointer; padding: 0; font-weight: 400; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before { content: "Q."; font-family: var(--latin); color: var(--sub); margin-right: 14px; }
.faq details[open] summary::before { color: var(--accent); }
.faq details p { margin: 8px 0 0 30px; color: var(--sub); font-size: 13px; }

/* ご相談：地色の箱ではなく、余白の中の一文 */
.cta { max-width: 1240px; margin: 120px auto 0; background: none; padding: 0 var(--gut); text-align: left; display: grid; grid-template-columns: 1fr 1.2fr; column-gap: 64px; }
.cta > * { grid-column: 2; }
.cta h2 { grid-column: 1; grid-row: 1 / span 3; font-family: var(--latin), var(--jp); font-weight: 500; font-size: 11.5px; letter-spacing: .2em; margin: 14px 0 0; display: flex; align-items: center; gap: 14px; }
.cta h2::before { content: ""; width: 6px; height: 6px; background: var(--accent); }
.cta p { color: var(--ink); margin: 0 0 36px; font-size: clamp(20px, 2.2vw, 28px); font-weight: 300; line-height: 1.7; letter-spacing: .06em; text-wrap: balance; }
.cta .btn { font-size: 13px; }
.cta .btn::before { width: 36px; }
.cta .btn:hover::before { width: 56px; }

/* 下層ページ */
.page-head { padding-top: 72px; padding-bottom: 8px; }
.about { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; padding-top: 32px; align-items: start; }
.portrait { margin: 0; }
.portrait img { aspect-ratio: 1 / 1; object-fit: cover; object-position: 60% 50%; }
.prose p { margin: 0 0 1.3em; }
.timeline { margin: 0; display: grid; gap: 14px; }
.timeline div { display: grid; grid-template-columns: 200px 1fr; gap: 24px; background: none; padding: 0; }
.timeline dt { color: var(--sub); font-size: 12.5px; letter-spacing: .06em; }
.timeline dd { margin: 0; }
.service h2 { font-size: 18px; font-weight: 500; margin: 0 0 12px; letter-spacing: .06em; }
.service h3 { font-size: 12px; font-weight: 500; margin: 26px 0 6px; color: var(--sub); letter-spacing: .14em; text-transform: uppercase; }
.service p { max-width: 720px; margin: 0 0 10px; }
.table-scroll { overflow-x: auto; }
.volume { border-collapse: separate; border-spacing: 0 14px; width: 100%; font-size: 13.5px; }
.volume th, .volume td { background: none; padding: 0 24px 0 0; text-align: left; vertical-align: top; font-weight: 400; }
.volume th { font-weight: 500; white-space: nowrap; }
.volume td:last-child { color: var(--sub); }
.volume .num { color: var(--ink); white-space: nowrap; font-family: var(--latin), var(--jp); }

/* ブログ：写真のマス目（作品の一覧と同じ並べ方） */
.post-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px 32px; }
.post-card { display: block; }
.post-card img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; margin-bottom: 16px; background: var(--tile); transition: opacity .3s; }
.post-card:hover img { opacity: .82; }
.post-card .kicker { display: block; margin: 0 0 6px; font-size: 11px; }
.post-card .t { font-weight: 500; line-height: 1.7; font-size: 13px; }
.tag { color: var(--sub); margin-left: 8px; text-transform: none; letter-spacing: .04em; }
.post { max-width: 760px; padding-top: 72px; }
.post h1 { font-size: clamp(22px, 2.6vw, 30px); }
.post-body img { margin: 22px 0; max-height: 560px; width: auto; }
.post-hero { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; margin: 8px 0 48px; }
.post-body { font-size: 15px; line-height: 2.05; }
.post-body h2 { font-size: 19px; font-weight: 500; margin: 64px 0 18px; letter-spacing: .06em; display: flex; align-items: center; gap: 14px; }
.post-body h2::before { content: ""; width: 6px; height: 6px; background: var(--accent); flex: none; }
.post-body h3 { font-size: 15.5px; font-weight: 500; margin: 40px 0 10px; }
.post-body ul { padding-left: 1.2em; margin: 0 0 1.3em; }
.post-body li { margin: 6px 0; }
.post-body li::marker { color: var(--faint); }
.post-body strong { font-weight: 500; }
.post-body a { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }

/* フッター：地色なし。小さな英字 */
.site-foot { background: none; margin-top: 140px; padding: 0 var(--gut) 36px; max-width: 1240px; margin-left: auto; margin-right: auto; }
.foot-in { display: flex; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.site-foot .logo { font-size: 12px; }
.foot-in p { margin: 8px 0 0; color: var(--sub); font-size: 12px; }
/* SNS のアイコン（2026-11-13 藍子さん「上のオレンジの点線にかぶっているので1mmぐらい空けて下に」）。書き込みモードの点線は文字の 3px 外側に出るので、10px 空ける */
.site-foot .sns { display: flex; gap: 14px; margin-top: 10px; }
.site-foot .sns a { color: var(--sub); display: inline-flex; }
.site-foot .sns a:hover, .site-foot .sns a:focus-visible { color: var(--accent); }
.foot-links { display: flex; gap: 22px; flex-wrap: wrap; font-family: var(--latin); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; }
.foot-links a { color: var(--sub); }
.foot-links a:hover, .site-foot p a:hover { color: var(--ink); }
.copy { margin: 40px 0 0; color: var(--faint); font-size: 10.5px; font-family: var(--latin); letter-spacing: .16em; text-transform: uppercase; }

/* ---- 動き（b.js）：はじめの NOW LOADING と、文字のシャッフル ---- */
.dl-loading {
  position: fixed; inset: 0; background: var(--bg); z-index: 50; display: grid; place-items: center;
  font-family: var(--latin); font-size: 11px; letter-spacing: .24em; color: var(--sub); transition: opacity .5s;
}
.dl-loading.out { opacity: 0; pointer-events: none; }
.dl-in { opacity: 0; transform: translateY(14px); transition: opacity .8s, transform .8s; }
.dl-in.on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .dl-loading { display: none; }
  .dl-in { opacity: 1; transform: none; transition: none; }
}
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* タブレット */
@media (max-width: 1000px) {
  :root { --gut: 32px; }
  .cards { grid-template-columns: repeat(2, 1fr); }
  .projects, .post-grid { grid-template-columns: repeat(2, 1fr); }
  .intro, .cta, .about { grid-template-columns: 1fr; }
  .intro > *, .intro .kicker, .cta > *, .cta h2 { grid-column: 1; grid-row: auto; }
  .cta h2 { margin-bottom: 16px; }
  .site-head .logo::after { display: none; }
}
/* スマホ */
@media (max-width: 640px) {
  :root { --gut: 20px; }
  body { font-size: 14px; }
  .sp { display: inline; }
  .site-head { flex-direction: column; align-items: flex-start; padding: 18px calc(var(--gut) + 48px) 12px var(--gut); gap: 10px; }
  .mail-ico { width: 48px; height: 48px; }
  /* スマホでは画像が小さく、ひし形の中の文字が読めないので、見出しは画像の下に出す */
  .mv-copy { position: static; transform: none; width: auto; text-align: left; padding: 32px var(--gut) 0; }
  .mv-copy h1 { font-size: 24px; }
  .hero-mv + .intro { padding-top: 16px; }
  .mail-ico svg { width: 22px; height: 15px; }
  .site-head nav { width: 100%; }
  .site-head ul { flex-wrap: wrap; gap: 6px 18px; }
  .site-head .lang::before { content: ""; }
  .intro { padding-top: 48px; }
  .numbers { grid-template-columns: 1fr 1fr; gap: 32px 16px; padding-top: 64px; }
  .cards { grid-template-columns: 1fr; gap: 28px; }
  .projects { gap: 40px 16px; }
  .post-grid { gap: 36px 16px; }
  .block { padding-top: 72px; }
  .cta { margin-top: 88px; }
  .timeline div { grid-template-columns: 1fr; gap: 0; }
  .site-foot { margin-top: 96px; }
}

/* ===== 2026-11-11 夕方の直し（大輔）===== */
/* メインイメージ：画面いっぱいの写真をゆっくり切り替え、太い白の見出し（参考：KRO のコーポレートサイト） */
.hero.hero-kv { max-width: none; padding: 0; position: relative; height: clamp(520px, 82vh, 860px); overflow: hidden; background: var(--ink); }
.kv-slides img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.6s ease, transform 7s linear; transform: scale(1.04); }
.kv-slides img.on { opacity: 1; transform: scale(1); }
.hero-kv::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 55%, rgba(0,0,0,.1) 100%); }
.kv-copy { position: absolute; z-index: 2; left: max(var(--gut), calc((100vw - 1240px) / 2 + var(--gut))); right: var(--gut); top: 50%; transform: translateY(-50%); color: #fff; }
.kv-copy h1 { margin: 0 0 22px; font-weight: 700; font-size: clamp(34px, 5.4vw, 80px); line-height: 1.32; letter-spacing: .04em; text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.kv-copy h1 em { font-style: normal; padding-bottom: .06em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 24' preserveAspectRatio='none'%3E%3Cpath d='M4 16 C 60 6, 120 20, 180 11 S 270 8, 296 13' fill='none' stroke='%23F28C28' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% .32em; }
.kv-sub { margin: 0; font-size: clamp(15px, 1.5vw, 20px); font-weight: 500; letter-spacing: .1em; }
.hero-kv + .intro { padding-top: 72px; }
/* サービスのページ：写真と文を左右交互に */
.service.has-img { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding-top: 88px; }
.service.has-img:nth-of-type(even) .svc-img { order: 2; }
.svc-img { margin: 0; }
.svc-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.svc-text { min-width: 0; }
/* トップのサービスのカードの写真 */
.card-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 18px; transition: opacity .3s; }
.card:hover .card-img { opacity: .85; }
@media (max-width: 1000px) {
  .service.has-img { grid-template-columns: 1fr; gap: 24px; padding-top: 64px; }
  .service.has-img:nth-of-type(even) .svc-img { order: 0; }
}
@media (max-width: 640px) {
  .hero.hero-kv { height: 72vh; min-height: 460px; }
  .kv-copy h1 { font-size: 30px; }
  .kv-sub { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .kv-slides img { transition: opacity 1.6s ease; transform: none; } }
/* 世界をまたにかける仕事：白地の世界地図の画像を全幅で、左の余白に文字 */
.world { position: relative; margin-top: 96px; }
.world img { width: 100%; height: auto; }
.world-copy { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); }
.world-copy > * { max-width: 420px; }
.world-lead { font-size: clamp(28px, 3.6vw, 52px); font-weight: 700; line-height: 1.3; letter-spacing: .04em; margin: 0 0 18px; }
.world-copy p:last-child { color: var(--sub); font-size: 13.5px; }
@media (max-width: 760px) {
  .world-copy { position: static; transform: none; padding-top: 8px; }
  .world-copy > * { max-width: none; }
}
/* 記事の最後の「この記事を書いた人」 */
.author { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 28px; margin: 72px 0 0; padding-top: 40px; position: relative; }
.author::before { content: ""; position: absolute; top: 0; left: 0; width: 36px; height: 6px; background: var(--accent); }
.author-img { width: 120px; height: 120px; object-fit: cover; }
.author-label { margin: 0 0 6px; font-size: 11px; letter-spacing: .18em; color: var(--sub); }
.author-name { margin: 0 0 14px; font-family: "Bodoni Moda", Didot, "Bodoni 72", serif; font-size: 24px; letter-spacing: .04em; }
.author-name span { display: block; font-family: var(--latin), var(--jp); font-size: 12px; color: var(--sub); letter-spacing: .08em; margin-top: 2px; }
.author-body p { font-size: 13.5px; line-height: 2; margin: 0 0 12px; }
.author-hello { color: var(--ink); }
.author-links { display: flex; gap: 22px; font-size: 12px !important; letter-spacing: .14em; }
.author-links a::before { content: "→ "; color: var(--accent); }
@media (max-width: 640px) { .author { grid-template-columns: 72px minmax(0, 1fr); gap: 16px; } .author-img { width: 72px; height: 72px; } }
/* 名前（ロゴの文字）は Bodoni（大輔 2026-11-11「ロゴのフォントは Bodoni とかどうか。優雅さ・軽やかさ」） */
.logo { font-family: "Bodoni Moda", Didot, "Bodoni 72", serif !important; font-weight: 500 !important; font-size: 17px !important; letter-spacing: .2em !important; }
.site-head .logo::after { font-family: var(--latin); font-size: 11.5px; font-weight: 400; }
/* 出版翻訳の書影（2026-11-11） */
.books li { grid-template-columns: 140px minmax(0, 1fr) !important; gap: 0 32px !important; align-items: end !important; }
.book-cover { width: 140px; height: auto; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.book-text { display: flex; flex-direction: column; gap: 6px; padding-bottom: 6px; }
.book-text .who { font-size: 17px; }
@media (max-width: 640px) { .books li { grid-template-columns: 96px minmax(0, 1fr) !important; gap: 0 18px !important; } .book-cover { width: 96px; } .book-text .who { font-size: 15px; } }
/* 2026-11-11 大輔：アニメーションはやめるが、ロゴだけは佐藤可士和のサイトを参考にした「名前の左の黒い帯」にする */
.site-head .logo::before { display: block; }  /* 乗せると少し伸びる（22→30px・0.15秒）は上の元の指定のまま（大輔 2026-11-11「hover でちょっと伸びるのを入れよう」） */
/* 実績のページ（2026-11-11）：名前を出してよいお仕事を絵で／分野別の翻訳量を横棒で */
.showcase { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 48px; align-items: end; }
.showcase figure { margin: 0; min-width: 0; }
.showcase .book-cover { width: 200px; }
.showcase .site-shot { width: 100%; height: auto; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.showcase figcaption { margin-top: 16px; font-size: 12.5px; color: var(--sub); line-height: 1.9; }
.showcase figcaption b { display: block; color: var(--ink); font-weight: 500; font-size: 13.5px; }
.bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.bars li { display: grid; grid-template-columns: 170px minmax(0, 1fr) 76px; gap: 4px 20px; align-items: center; }
.bar-name { font-size: 13.5px; font-weight: 500; }
.bar { height: 10px; background: var(--tile); }
.bar i { display: block; height: 100%; background: var(--accent); }
.bar-num { font-family: var(--latin), var(--jp); font-size: 15px; text-align: right; font-variant-numeric: tabular-nums; }
.bar-note { grid-column: 2 / 4; font-size: 11.5px; color: var(--sub); line-height: 1.7; }
@media (max-width: 640px) {
  .showcase { grid-template-columns: 1fr; gap: 32px; }
  .showcase .book-cover { width: 140px; }
  .bars li { grid-template-columns: minmax(0, 1fr) 64px; }
  .bar-name { grid-column: 1 / 3; }
  .bar-note { grid-column: 1 / 3; }
}
/* 実績のページ：山治の画面をやめたので、書影と文の2列に（2026-11-11） */
.showcase-text { padding-bottom: 6px; }
.showcase-text .showcase-title { font-size: 17px; font-weight: 500; margin: 0 0 8px; }
.showcase-text p { margin: 0; font-size: 13px; color: var(--sub); }
.showcase-text .showcase-title { color: var(--ink); }
/* 問い合わせフォーム（2026-11-11） */
.cform { max-width: 760px; display: grid; gap: 26px; }
.cform label, .cform legend { display: grid; gap: 8px; font-size: 13px; font-weight: 500; letter-spacing: .04em; }
.cform em { font-style: normal; font-size: 10.5px; color: var(--accent); margin-left: 8px; letter-spacing: .1em; }
.cform input[type=text], .cform input[type=email], .cform input[type=url], .cform input[type=tel], .cform textarea {
  width: 100%; font: inherit; font-size: 16px; font-weight: 400; color: var(--ink); background: var(--tile);
  border: 0; border-bottom: 1.5px solid transparent; padding: 12px 14px; transition: border-color .2s, background .2s; }
.cform input:focus, .cform textarea:focus { outline: none; border-bottom-color: var(--accent); background: #fff; box-shadow: 0 0 0 1px var(--tile) inset; }
.cform textarea { resize: vertical; min-height: 150px; line-height: 1.8; }
.cform .row.two { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.cform fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.cform legend { margin-bottom: 10px; padding: 0; }
.chips-in { display: flex; flex-wrap: wrap; gap: 10px; }
.chips-in label { display: block; cursor: pointer; }
.chips-in input { position: absolute; opacity: 0; pointer-events: none; }
.chips-in span { display: inline-block; padding: 9px 16px; background: var(--tile); font-size: 13px; font-weight: 400; transition: background .2s, color .2s; }
.chips-in input:checked + span { background: var(--ink); color: #fff; }
.chips-in input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cform-note { margin: 0; font-size: 12.5px; color: var(--sub); }
.cform-send { justify-self: start; border: 0; cursor: pointer; font-size: 13px; padding: 4px 0; }
.cform-send::before { width: 36px; }
.cform-send:hover::before { width: 56px; }
.cform-send:disabled { opacity: .5; cursor: default; }
.cform-msg { margin: 0; min-height: 1.6em; font-size: 14px; }
.cform-msg.ok { color: var(--ink); font-weight: 500; }
.cform-msg.err { color: #c0392b; }
.contact-alt { margin-top: 40px; }
@media (max-width: 640px) { .cform .row.two { grid-template-columns: 1fr; } }
/* 「必須」を項目名の横に（2026-11-11） */
.cform > label, .cform .row.two > label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 0; }
.cform > label > input, .cform > label > textarea, .cform .row.two > label > input { flex-basis: 100%; }
.cform-send { font-size: 14.5px; padding: 8px 0; }
/* reCAPTCHA：文で知らせるので、右下の印は隠す（Google の決まりで認められている形） */
.grecaptcha-badge { visibility: hidden; }
.cform-recaptcha { margin: 0; font-size: 11px; color: var(--faint); line-height: 1.8; }
.cform-recaptcha a { color: var(--sub); text-decoration: underline; }
/* よくある質問のページ（2026-11-11） */
.faq-page { padding-top: 24px; }
.faq-cats { display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 8px 0 56px; }
.faq-cats a { padding: 9px 16px; background: var(--tile); font-size: 13px; }
.faq-cats a:first-child { background: var(--ink); color: #fff; }
.faq-cats a:hover { background: var(--accent); color: #fff; }
.faq-ai { background: var(--ink); color: #fff; padding: clamp(32px, 5vw, 64px); margin: 0 0 32px; scroll-margin-top: 90px; }
.faq-ai-kicker { font-family: var(--latin); font-size: 11px; letter-spacing: .24em; color: var(--accent); margin: 0 0 10px; }
.faq-ai h2 { font-size: clamp(24px, 3vw, 36px); font-weight: 700; margin: 0 0 12px; letter-spacing: .04em; }
.faq-ai-lead { font-size: 15px; margin: 0 0 32px; color: #ddd; }
.faq-ai-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 24px; }
.faq-ai-grid h3 { font-size: 13px; letter-spacing: .12em; margin: 0 0 10px; color: var(--accent); }
.faq-ai-grid ul { margin: 0; padding-left: 1.2em; font-size: 13.5px; line-height: 1.9; color: #e8e8e8; }
.faq-ai-more { margin: 0 0 28px; }
.faq-ai-more a { color: #fff; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 4px; font-size: 13.5px; }
.faq-ai .faq details { border-top: 1px solid rgba(255,255,255,.18); padding-top: 16px; margin: 0 0 16px; max-width: none; }
.faq-ai .faq details p { color: #ccc; }
.faq-ai .faq summary::before { color: var(--accent); }
.faq-group { padding-top: 64px; scroll-margin-top: 90px; }
.faq-group .faq details { max-width: 820px; margin-bottom: 22px; }
.faq-group .faq details p a, .faq-ai .faq details p a { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
@media (max-width: 760px) { .faq-ai-grid { grid-template-columns: 1fr; gap: 20px; } }
.faq-list { margin: 8px 0 8px 30px; padding-left: 1.1em; font-size: 13px; color: var(--sub); }
.faq-list li { margin: 4px 0; }
/* ===== チャッピーの採点（1回目）を受けた直し（2026-11-11 夜） ===== */
/* ご相談の入口 */
.ent-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.ent-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ent { display: flex; flex-direction: column; background: var(--tile); padding: 26px 22px 22px; transition: background .2s, color .2s; }
.ent:hover { background: var(--ink); color: #fff; }
.ent-for { font-size: 11px; letter-spacing: .1em; color: var(--accent); margin-bottom: 10px; }
.ent h3 { font-size: 16px; font-weight: 600; margin: 0 0 10px; line-height: 1.6; word-break: keep-all; }
.ent p { font-size: 12.5px; line-height: 1.85; margin: 0 0 18px; color: inherit; opacity: .78; flex: 1; }
.ent-go { font-size: 12px; letter-spacing: .12em; display: inline-flex; align-items: center; gap: 10px; }
.ent-go::before { content: ""; width: 18px; height: 4px; background: var(--accent); transition: width .15s; }
.ent:hover .ent-go::before { width: 30px; }
@media (max-width: 1000px) { .ent-grid, .ent-grid.three { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ent-grid, .ent-grid.three { grid-template-columns: 1fr; gap: 12px; } }
/* フォームの上の案内・記事とFAQの終わりの頼み方 */
.cform-lead { max-width: 760px; margin: 0 0 32px; font-size: 14.5px; line-height: 1.9; }
.post-cta { margin-top: 32px; padding: 22px 24px; background: var(--tile); font-size: 14px; }
.post-cta .btn { margin-top: 10px; text-decoration: none !important; }
.faq-ai-cta { margin: 0 0 28px; padding: 20px 22px; background: rgba(255,255,255,.08); font-size: 13.5px; line-height: 1.9; color: #eee; }
.faq-ai-cta .btn { display: inline-flex; margin-top: 10px; color: #fff; }
/* サービスのページのはじめと、関連サービスの区切り */
.svc-intro p { font-size: 16px; line-height: 1.9; max-width: 760px; margin: 8px 0 0; }
.svc-intro b { font-weight: 600; }
.svc-sub { padding-top: 104px; }
/* スマホの画面の下に固定の「相談する」 */
.sp-cta { display: none; }
@media (max-width: 640px) {
  .sp-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; justify-content: center; align-items: center; gap: 12px;
    padding: 14px max(16px, env(safe-area-inset-right, 0px)) calc(14px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
    background: var(--ink); color: #fff; font-size: 14px; letter-spacing: .12em; }
  .sp-cta::before { content: ""; width: 22px; height: 4px; background: var(--accent); }
  body { padding-bottom: 56px; }
}
/* ===== 2回目の採点を受けた直し（2026-11-11 夜） ===== */
.lead-for { display: block; font-weight: 600; margin-bottom: 6px; }
.ent-note { margin: 18px 0 0; font-size: 12.5px; color: var(--sub); }
.en-japan { max-width: 820px; margin: 0 0 28px; font-size: 15px; line-height: 1.9; }
.en-japan b { font-weight: 600; }
.svc-steps { display: inline-block; margin-top: 6px !important; padding: 8px 14px; background: var(--tile); font-size: 12.5px; }
.cflow { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; max-width: 760px; }
.cflow li { background: var(--tile); padding: 14px 16px; font-size: 12.5px; line-height: 1.7; }
.cflow b { display: block; font-family: var(--latin); font-weight: 400; font-size: 20px; color: var(--accent); margin-bottom: 2px; }
@media (max-width: 640px) { .cflow { grid-template-columns: 1fr; } }
/* スマホのメニュー */
.menu-btn { display: none; }
@media (max-width: 640px) {
  .site-head { flex-direction: row !important; align-items: center !important; flex-wrap: wrap; }
  .menu-btn { display: block; margin-left: auto; margin-right: 52px; background: none; border: 0; padding: 8px 4px; font: 500 12px/1 var(--latin); letter-spacing: .2em; color: var(--ink); cursor: pointer; }
  .site-head nav { display: none; width: 100%; }
  body.menu-open .site-head nav { display: block; padding: 8px 0 6px; }
  body.menu-open .site-head ul { flex-direction: column; gap: 14px; font-size: 13px; }
}
/* ===== 3回目の採点を受けた直し（2026-11-11 夜）：読みやすさ・余白・スマホ ===== */
:root { --sub: #6b6b6b; --faint: #9a9a9a; }
body { font-size: 15px; }
.block { padding-top: 72px; }
.card p, .ent p, .projects .what, .projects .how { font-size: 13px; }
.prof-sum p { max-width: 760px; margin: 18px 0 0; font-size: 16px; line-height: 1.9; font-weight: 500; }
.en-proof { margin: 20px 0 0; font-size: 13px; font-weight: 500; letter-spacing: .02em; }
@media (max-width: 640px) {
  .hero.hero-kv { height: 62vh; min-height: 420px; }
  .sp-cta { transform: translateY(110%); transition: transform .25s; padding-top: 11px; padding-bottom: calc(11px + env(safe-area-inset-bottom, 0px)); }
  .sp-cta.show { transform: none; }
  .block { padding-top: 60px; }
}
/* 見出しの下の証拠の一行（4回目の採点を受けて） */
.kv-proof { margin: 18px 0 0; font-size: clamp(12px, 1.05vw, 14px); letter-spacing: .06em; opacity: .92; }
@media (max-width: 640px) { .kv-proof { font-size: 11.5px; line-height: 1.8; } }
.ent-go { white-space: nowrap; }
/* ===== 2026-11-12 朝の直し ===== */
/* 日本語は句の切れ目（<wbr>）だけで折り返す。長すぎる語ははみ出さないように折る */
main, .site-foot, .kv-copy { word-break: keep-all; overflow-wrap: anywhere; }
/* ブログの蛍光ペン（薄いオレンジ） */
mark { background: linear-gradient(transparent 58%, rgba(242,140,40,.32) 58%, rgba(242,140,40,.32) 92%, transparent 92%); color: inherit; padding: 0 1px; }
/* 記事の中の写真 */
.post-fig { margin: 8px 0 28px; }
.post-fig img { width: 100%; height: auto; max-height: none !important; margin: 0 !important; }
.post-fig figcaption { margin-top: 8px; font-size: 12.5px; color: var(--sub); }
/* トップのサービスのカード：分類名→写真→見出し→文。スマホではカードの間を広く */
.card .svc { margin-bottom: 12px; }
.card-img { margin-bottom: 14px; }
@media (max-width: 640px) { .cards { gap: 56px; } }
/* トップの FAQ：分類の札 */
.faq-top details { margin-bottom: 26px; }
.faq-cat { display: inline-block; font-size: 11px; letter-spacing: .08em; color: var(--accent); border: 1px solid var(--accent); padding: 0 8px; margin-right: 10px; vertical-align: 2px; }
/* FAQ のページの AI の枠：黒をやめて、読みやすい明るい地に */
.faq-ai { background: #fbf2ea; color: var(--ink); }
.faq-ai-lead { color: var(--ink); }
.faq-ai-grid ul { color: var(--ink); }
.faq-ai-more a { color: var(--ink); }
.faq-ai-cta { background: #fff; color: var(--ink); }
.faq-ai-cta .btn { color: var(--ink); }
.faq-ai .faq details { border-top-color: rgba(0,0,0,.1); }
.faq-ai .faq details p { color: var(--sub); }
.faq-cats a:first-child { background: #fbf2ea; color: var(--ink); }
/* ハンバーガーのメニュー */
@media (max-width: 640px) {
  .menu-btn { width: 40px; height: 40px; padding: 11px 8px; display: flex; flex-direction: column; justify-content: space-between; }
  .menu-btn span { display: block; height: 2px; background: var(--ink); transition: transform .2s, opacity .2s; }
  body.menu-open .menu-btn span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  body.menu-open .menu-btn span:nth-child(2) { opacity: 0; }
  body.menu-open .menu-btn span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}
.nw { white-space: nowrap; }
br.pc { display: inline; }
@media (max-width: 640px) { br.pc { display: none; } }
/* 今いるページのメニューに、極細のオレンジの線（大輔 2026-11-12） */
.site-head ul a[aria-current] { color: var(--ink); box-shadow: inset 0 -1px 0 var(--accent); padding-bottom: 4px; }
@media (max-width: 640px) { body.menu-open .site-head ul a[aria-current] { padding-bottom: 2px; } }
/* トップの FAQ の分類の札は、質問の上に1行で */
.faq-top summary { display: block; }
.faq-top .faq-cat { display: block; width: fit-content; margin: 0 0 8px 30px; }
.faq-top summary::before { float: left; }
.pub-lead { max-width: 900px; }
.projects .how { margin-top: 6px; }  /* Volume の上だけ少し空ける（大輔 2026-11-12） */
/* 名前の横の言葉：絵の矢印を文字にそろえる（::after の文字の矢印はやめる） */
.site-head .logo::after { content: none !important; }
.logo-sub { font-family: var(--latin); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--sub); margin-left: 18px; display: inline-flex; align-items: center; gap: .5em; white-space: nowrap; }
.pair-arrow { width: 1.55em; height: .85em; display: block; }
.site-foot .logo-sub { display: none; }
@media (max-width: 1000px) { .logo-sub { display: none; } }
.site-head { flex-wrap: nowrap; }
.site-head > .logo { flex: none; }
/* ===== 2026-11-12 昼 ===== */
/* メールのアイコンは画面の角ではなく、ヘッダーの並びの右端に（大輔「ブラウザ幅が広いとメールアイコンが遠い」） */
.mail-ico { position: static; flex: none; width: 44px; height: 44px; margin-left: 4px; }
.mail-ico svg { width: 20px; height: 14px; }
.site-head { padding-right: var(--gut); }
.site-head nav { margin-left: auto; }
@media (max-width: 640px) {
  .site-head { padding: 12px var(--gut) !important; gap: 12px; }
  .menu-btn { margin-right: 0 !important; }
  .mail-ico { width: 40px; height: 40px; margin-left: 0; }
  .site-head nav { order: 10; margin-left: 0; }
  .site-head { flex-wrap: wrap; }  /* 2026-11-13 大輔の AI：上の nowrap でスマホのメニューがロゴの横に押し込まれていた */
}
/* 送信のボタン：ほかの「→ リンク」と見分けがつく、塗りのボタンに（大輔「送信するボタンのことなの？分かりにくい」） */
.cform-send { justify-self: start; display: inline-flex; align-items: center; gap: 12px; background: var(--ink) !important; color: #fff !important;
  border: 0; padding: 16px 44px !important; font: 500 15px/1 var(--latin), var(--jp) !important; letter-spacing: .12em; cursor: pointer; transition: background .2s; }
.cform-send::before { content: none !important; }
.cform-send:hover, .cform-send:focus-visible { background: var(--accent) !important; outline: none; }
.cform-send:disabled { opacity: .5; cursor: default; }
@media (max-width: 640px) { .cform-send { justify-self: stretch; justify-content: center; } }
/* 3段の流れに、さりげない矢印（大輔「矢印を入れてフローが分かるように」）。PCは右向き、スマホは下向き */
.cflow { gap: 28px; }
.cflow li { position: relative; }
.cflow li + li::before { content: ""; position: absolute; left: -18px; top: 50%; width: 8px; height: 8px;
  border-top: 1px solid var(--accent); border-right: 1px solid var(--accent); transform: translateY(-50%) rotate(45deg); }
@media (max-width: 640px) {
  .cflow { gap: 22px; }
  .cflow li + li::before { left: 50%; top: -15px; transform: translateX(-50%) rotate(135deg); }
}
/* 入口のカードの hover：黒はいかついので、柔らかいオレンジに（大輔 2026-11-12） */
.ent:hover { background: #fcebdc; color: var(--ink); }
/* 数え上げの間、数字の幅で横の「万ワード以上」が揺れないように */
.total-num b { font-variant-numeric: tabular-nums; display: inline-block; min-width: 3ch; }
/* FAQ の AI の枠と見出しの札も、ほかの分類と同じ薄い灰色に（大輔「おすすめで」2026-11-12） */
.faq-ai { background: var(--tile); }
.faq-cats a:first-child { background: var(--tile); color: var(--ink); }
.faq-cats a:first-child:hover { background: var(--accent); color: #fff; }
/* メインイメージの下に、Bodoni の細い斜体の英文と「Scroll」（大輔 2026-11-12「かっこいい英文を下に入れてスクロールを促す」） */
.kv-foot { position: absolute; z-index: 2; left: max(var(--gut), calc((100vw - 1240px) / 2 + var(--gut))); right: var(--gut); bottom: 28px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; color: #fff; pointer-events: none; }
.kv-en { margin: 0; font-family: "Bodoni Moda", Didot, "Bodoni 72", serif; font-style: italic; font-weight: 400;
  font-size: clamp(22px, 2.6vw, 38px); letter-spacing: .02em; line-height: 1.2; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.kv-scroll { position: relative; flex: none; font-family: var(--latin); font-size: 10px; letter-spacing: .3em; padding-bottom: 64px; writing-mode: vertical-rl; }
.kv-scroll::before, .kv-scroll::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 1px; height: 52px; }
.kv-scroll::before { background: rgba(255,255,255,.35); }
.kv-scroll::after { background: var(--accent); transform-origin: top; animation: kvScroll 2.2s ease-in-out infinite; }
@keyframes kvScroll { 0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; }
  50.1% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 640px) {
  .kv-foot { bottom: 18px; }
  .kv-en { font-size: 19px; }
  .kv-scroll { padding-bottom: 44px; } .kv-scroll::before, .kv-scroll::after { height: 36px; }
}
@media (prefers-reduced-motion: reduce) { .kv-scroll::after { animation: none; } }
/* 英語版の見出し：英語は日本語より横に長いので一回り小さく、ダッシュをやめて2行の長さをそろえる（大輔「1行目が横長」） */
.kv-copy h1.kv-h1-en { font-size: clamp(30px, 4.4vw, 64px); line-height: 1.22; letter-spacing: .01em; }
/* 下の英文と重ならないよう、見出しのかたまりを少し上へ */
@media (min-width: 641px) { .kv-copy { top: calc(50% - 40px); } }
/* FAQ の「AI翻訳との違い」も、ほかの分類と同じ見出し・白地に（大輔「なんで AI だけ背景が灰色？」2026-11-12）。
   まとめ（苦手なこと・使い分け）はそのまま残し、相談の案内だけ薄い灰色の箱に */
.faq-ai { background: none !important; padding: 0 !important; color: var(--ink); }
.faq-ai .sec { margin-bottom: 24px; }
.faq-ai-cta { background: var(--tile) !important; }
.faq-ai .faq details { max-width: 820px; }
/* 下の英文はやめ、右下の Scroll だけ残す（大輔 2026-11-12） */
.kv-foot { justify-content: flex-end; }
/* AI の見出しは大きいまま（大輔「見出しは大きい方が良かった」2026-11-12） */
/* FAQ の分類の見出しを、どれも AI と同じ大きさに（大輔「それでお願い」2026-11-12） */
.faq-group h2.sec { font-size: clamp(24px, 3vw, 36px); font-weight: 700; letter-spacing: .04em; margin: 0 0 28px; }
/* AI の分類の質問も、ほかの分類と同じ形に（線なし・灰色の Q.） */
.faq-ai .faq details { border-top: 0; padding-top: 0; margin: 0 0 22px; }
.faq-ai .faq summary::before { color: var(--sub); }
.faq-ai .faq { margin-top: 40px; }
/* 質問が2行になったとき、2行目を「Q.」の下にもぐらせず、質問の文の頭にそろえる */
.faq summary { display: block; position: relative; padding-left: 30px; }
.faq summary::before { position: absolute; left: 0; top: 0; margin-right: 0; }
.faq summary::-webkit-details-marker { display: none; }
/* ===== 2026-11-12 本文は普通に折り返す（大輔「見出し以外は改行なしでいい」）。句の切れ目で折るのは見出しと質問だけ ===== */
main, .site-foot, .kv-copy { word-break: normal; overflow-wrap: anywhere; line-break: strict; }
main :is(h1, h2, h3, h4, summary), .kv-copy :is(h1, h2), .cta h2 { word-break: keep-all; }
main :is(p, li, dd, td, th, figcaption) .nw { white-space: normal; }
main :is(h1, h2, h3, h4, summary) .nw { white-space: nowrap; }
/* メインイメージの証拠の一行：スマホでは「翻訳量」から2行目に（行末に ｜ を残さない） */
@media (max-width: 640px) { .kvp-sep { display: none; } }
/* C案（1ページにまとめた版）：実績の一覧のすぐ下にプロフィールが詰まらないように */
#profile, #contact { margin-top: clamp(64px, 8vw, 112px); }