/* ==========================================================================
   AlterSync — AI社員のドット絵スプライト（全ページ共通）
   2026-07-30：site.css と service/ai.html に二重定義されていたのを1本に集約した。
   ここを直せば全ページに効く。**ページ側に複製を作らない。**
   使う側は <link rel="stylesheet" href="/assets/px.css?v=..."> を site.css と一緒に読む。
   トークン（--color-navy 等）は各ページの :root に定義済みのものを参照する。
   ========================================================================== */
/* 仕組み：1ピクセル＝3pxのbox-shadowで描く。::before＝フレームA／::after＝フレームBを
   opacityのstep切り替えで交互に表示（2コマのタイピングアニメ）。画像ファイルは使わない。
   ⚠️ prefers-reduced-motion では全アニメを止め、フレームAの静止画だけを見せる。
   ⚠️ スケールは --px-scale で変える（transform:scale なのでドットが滲まない）。 */
.px{position:relative;display:block;width:33px;height:27px;margin:0 auto .5rem}
.px::before,.px::after{content:"";position:absolute;top:0;left:0;width:3px;height:3px;background:transparent}
/* ロボット型AI社員：紺のボディ＋コーラルのアンテナ・胸ランプ、白い目、デスクとノートPC */
.px--bot::before{box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-navy,#1B224C),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-accent,#D97757),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  9px 15px var(--color-navy,#1B224C),24px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  15px 21px var(--color-band-2,#E9E7DF),18px 21px var(--color-band-2,#E9E7DF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}
.px--bot::after{opacity:0;box-shadow:
  15px 0 var(--color-mid,#B0AEA5),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-navy,#1B224C),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-accent,#D97757),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  9px 18px var(--color-navy,#1B224C),24px 18px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  15px 21px var(--color-white,#FFFFFF),18px 21px var(--color-white,#FFFFFF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}
/* 秘書室：ヘッドセット（左右のコーラルのパッド）を追加 */
.px--sec::before{box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  9px 6px var(--color-accent,#D97757),12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),24px 6px var(--color-accent,#D97757),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-navy,#1B224C),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-accent,#D97757),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  9px 15px var(--color-navy,#1B224C),24px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  15px 21px var(--color-band-2,#E9E7DF),18px 21px var(--color-band-2,#E9E7DF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}
.px--sec::after{opacity:0;box-shadow:
  15px 0 var(--color-mid,#B0AEA5),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  9px 6px var(--color-accent,#D97757),12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),24px 6px var(--color-accent,#D97757),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-navy,#1B224C),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-accent,#D97757),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  9px 18px var(--color-navy,#1B224C),24px 18px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  15px 21px var(--color-white,#FFFFFF),18px 21px var(--color-white,#FFFFFF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}
/* 代表（人間）：黒髪＋紺のスーツ＋コーラルのネクタイ、デスクに書類とPC */
.px--ceo::before{box-shadow:
  12px 0 var(--color-ink,#141413),15px 0 var(--color-ink,#141413),18px 0 var(--color-ink,#141413),21px 0 var(--color-ink,#141413),
  12px 3px var(--color-ink,#141413),15px 3px var(--color-paper,#FAF9F5),18px 3px var(--color-paper,#FAF9F5),21px 3px var(--color-ink,#141413),
  12px 6px var(--color-paper,#FAF9F5),15px 6px var(--color-paper,#FAF9F5),18px 6px var(--color-paper,#FAF9F5),21px 6px var(--color-paper,#FAF9F5),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-accent,#D97757),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  9px 12px var(--color-navy,#1B224C),24px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  9px 21px var(--color-white,#FFFFFF),12px 21px var(--color-white,#FFFFFF),18px 21px var(--color-band-2,#E9E7DF),21px 21px var(--color-band-2,#E9E7DF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}
.px--ceo::after{opacity:0;box-shadow:
  12px 0 var(--color-ink,#141413),15px 0 var(--color-ink,#141413),18px 0 var(--color-ink,#141413),21px 0 var(--color-ink,#141413),
  12px 3px var(--color-ink,#141413),15px 3px var(--color-paper,#FAF9F5),18px 3px var(--color-paper,#FAF9F5),21px 3px var(--color-ink,#141413),
  12px 6px var(--color-paper,#FAF9F5),15px 6px var(--color-paper,#FAF9F5),18px 6px var(--color-paper,#FAF9F5),21px 6px var(--color-paper,#FAF9F5),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-accent,#D97757),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  9px 15px var(--color-navy,#1B224C),24px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C),
  9px 21px var(--color-white,#FFFFFF),12px 21px var(--color-white,#FFFFFF),18px 21px var(--color-band-2,#E9E7DF),21px 21px var(--color-band-2,#E9E7DF),
  6px 24px var(--color-hair,#DEDCD2),9px 24px var(--color-hair,#DEDCD2),12px 24px var(--color-hair,#DEDCD2),15px 24px var(--color-hair,#DEDCD2),18px 24px var(--color-hair,#DEDCD2),21px 24px var(--color-hair,#DEDCD2),24px 24px var(--color-hair,#DEDCD2),27px 24px var(--color-hair,#DEDCD2)}

/* 書類を運んで歩き回るロボット（TOPヒーローのオフィスシーンで使用。将来404等にも流用可）
   デスクなし・足あり。2コマで足を交互に出す＋書類（グレー地に白の光）を胸の前に抱えている */
.px--run::before{box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  24px 12px var(--color-band-2,#E9E7DF),27px 12px var(--color-white,#FFFFFF),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  24px 15px var(--color-white,#FFFFFF),27px 15px var(--color-band-2,#E9E7DF),
  12px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C)}
.px--run::after{opacity:0;box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFFFFF),18px 6px var(--color-white,#FFFFFF),21px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),
  12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  24px 12px var(--color-band-2,#E9E7DF),27px 12px var(--color-white,#FFFFFF),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  24px 15px var(--color-white,#FFFFFF),27px 15px var(--color-band-2,#E9E7DF),
  15px 18px var(--color-navy,#1B224C),18px 18px var(--color-navy,#1B224C)}

/* ---------- 2コマのタイピング（全スプライト共通） ---------- */
@media (prefers-reduced-motion:no-preference){
  .px::before{animation:px-a 1.1s steps(1) infinite}
  .px::after{animation:px-b 1.1s steps(1) infinite}
}
@keyframes px-a{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes px-b{0%,49%{opacity:0}50%,100%{opacity:1}}

/* ---------- 拡大縮小 ---------- */
.px{transform:scale(var(--px-scale,1));transform-origin:bottom center}

/* ---------- 働くAI社員の帯（.px-strip） ----------
   どのページにも置ける汎用パーツ。デスクの列＋床＋ラベル。
   横幅に合わせて人数が自動で減る（モバイルでも必ず1人は残る）。 */
.px-strip{
  display:flex;align-items:flex-end;justify-content:center;gap:clamp(14px,4vw,34px);
  padding:var(--space-md,1.5rem) var(--space-sm,1rem) var(--space-sm,1rem);margin:0;list-style:none;
  border-radius:var(--radius,14px);background:var(--surface,linear-gradient(158deg,rgba(33,64,128,.075),rgba(255,255,255,0) 58%),#FFFFFF);border:1px solid var(--color-hair,#DEDCD2);
  position:relative;overflow:hidden;
}
.px-strip .px{margin:0;--px-scale:1.25}
.px-strip::after{content:"";position:absolute;left:8%;right:8%;bottom:calc(var(--space-sm,1rem) - 2px);height:1px;background:var(--color-hair,#DEDCD2)}
.px-strip--teal{background:var(--surface-teal,linear-gradient(158deg,rgba(42,138,149,.13),rgba(255,255,255,0) 60%),#FFFFFF)}
.px-strip--coral{background:var(--surface-coral,linear-gradient(158deg,rgba(217,119,87,.12),rgba(255,255,255,0) 60%),#FFFFFF)}
/* 3人目・4人目は狭い画面で降りる（1人目は常に残す） */
@media (max-width:520px){.px-strip li:nth-child(n+4){display:none}}
@media (max-width:380px){.px-strip li:nth-child(n+3){display:none}}
/* 全員が同時に打たないようずらす */
.px-strip li:nth-child(2) .px::before,.px-strip li:nth-child(2) .px::after{animation-delay:.35s}
.px-strip li:nth-child(3) .px::before,.px-strip li:nth-child(3) .px::after{animation-delay:.7s}
.px-strip li:nth-child(4) .px::before,.px-strip li:nth-child(4) .px::after{animation-delay:.2s}

/* 帯に添えるキャプション */
.px-cap{display:block;text-align:center;font-family:var(--font-mono,"IBM Plex Mono","Courier New",monospace);font-size:var(--text-cap,.78rem);color:var(--color-gray,#6B6960);margin-top:.6rem}
.px-cap i{font-style:normal;color:var(--color-accent,#D97757);margin-right:.35rem}
@media (prefers-reduced-motion:no-preference){.px-cap i{animation:px-led 1.1s steps(1) infinite}}
@keyframes px-led{0%,60%{opacity:1}61%,100%{opacity:.2}}

/* ---------- 文中に置く1体（.px-inline） ---------- */
.px-inline{display:inline-block;vertical-align:-.35em;margin:0 .2rem}
.px-inline .px{margin:0;--px-scale:.85}

/* 帯を置くブロックの共通余白（各ページで style 指定せずに済ませたいときに使う） */
.px-block{margin:var(--space-lg,2.5rem) auto 0;max-width:520px}

/* ---------- 箱なしで散らばせる部品（2026-07-30 竹下：オフィスの箱は作らなくていい、色んなところに） ---------- */
/* 帯の箱チュームを外す（床線だけ残す） */
.px-strip--bare{background:none;border:0;padding:var(--space-sm,1rem) 0 var(--space-sm,1rem)}
.px-strip--bare::after{left:18%;right:18%}

/* 要素の縁に立たせる／座らせる。親に .px-host（position:relative）を付ける */
.px-host{position:relative}
.px-sit{position:absolute;margin:0;pointer-events:none}
.px-sit--tr{top:-27px;right:22px}
.px-sit--tl{top:-27px;left:22px}
.px-sit--br{bottom:-1px;right:8px}
.px-sit--bl{bottom:-1px;left:8px}

/* セクションの継ぎ目をのんびり往復する1体（.wrap の末尾に置く） */
.px-stroll{position:relative;height:0;pointer-events:none}
.px-stroll .px{position:absolute;bottom:-6px;left:2%;margin:0}
@media (prefers-reduced-motion:no-preference){
  .px-stroll .px{animation:px-stroll 38s linear infinite}
}
@keyframes px-stroll{
  0%{left:2%;transform:scale(var(--px-scale,1)) scaleX(1)}
  46%{left:calc(98% - 33px);transform:scale(var(--px-scale,1)) scaleX(1)}
  50%{left:calc(98% - 33px);transform:scale(var(--px-scale,1)) scaleX(-1)}
  96%{left:2%;transform:scale(var(--px-scale,1)) scaleX(-1)}
  100%{left:2%;transform:scale(var(--px-scale,1)) scaleX(1)}
}

/* ---------- 名前と挨拶（2026-07-30 竹下：名前をつけて可愛く、CTAにも） ----------
   AI社員8人の名前（部署の役割にちなむ。勝手に改名しない。CLAUDE.mdにも一覧あり）：
   ツムギ=秘書室（紡いで繋ぐ）／カケル=営業（駆ける）／ミッケ=開拓（見っけ！）／ツクル=制作／
   フデ=マーケティング（筆）／ニコ=カスタマーサクセス（にこにこ伴走）／タマ=財務経理（そろばんの玉）／タネ=新規事業（種まき）。
   ⚠️ 書類を運ぶ .px--run は「誰か」のままにする（名前を付けると9人目になり「AI社員8人」の実数と矛盾する） */
.px-name{display:inline-block;font-family:var(--font-mono,monospace);font-style:normal;font-size:.55rem;font-weight:700;letter-spacing:.06em;line-height:1.5;color:var(--color-accent-deep,#C05F3E);border:1px solid var(--color-accent-deep,#C05F3E);border-radius:999px;padding:0 .45rem;background:var(--color-white,#FFF)}

/* 手を振る立ちポーズ（CTA用。2コマで手を振る） */
.px--wave::before{box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFF),18px 6px var(--color-white,#FFF),21px 6px var(--color-navy,#1B224C),27px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),24px 9px var(--color-navy,#1B224C),
  9px 12px var(--color-navy,#1B224C),12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C)}
.px--wave::after{opacity:0;box-shadow:
  15px 0 var(--color-accent,#D97757),
  12px 3px var(--color-navy,#1B224C),15px 3px var(--color-navy,#1B224C),18px 3px var(--color-navy,#1B224C),21px 3px var(--color-navy,#1B224C),
  12px 6px var(--color-navy,#1B224C),15px 6px var(--color-white,#FFF),18px 6px var(--color-white,#FFF),21px 6px var(--color-navy,#1B224C),
  12px 9px var(--color-navy,#1B224C),15px 9px var(--color-navy,#1B224C),18px 9px var(--color-navy,#1B224C),21px 9px var(--color-navy,#1B224C),27px 9px var(--color-navy,#1B224C),
  9px 12px var(--color-navy,#1B224C),12px 12px var(--color-navy,#1B224C),15px 12px var(--color-accent,#D97757),18px 12px var(--color-navy,#1B224C),21px 12px var(--color-navy,#1B224C),24px 12px var(--color-navy,#1B224C),
  12px 15px var(--color-navy,#1B224C),15px 15px var(--color-navy,#1B224C),18px 15px var(--color-navy,#1B224C),21px 15px var(--color-navy,#1B224C),
  12px 18px var(--color-navy,#1B224C),21px 18px var(--color-navy,#1B224C)}

/* CTA前の「お見送り隊」：箱なし・名札つき */
.px-crew{display:flex;justify-content:center;align-items:flex-end;gap:clamp(16px,4vw,34px);margin:0 0 var(--space-md,1.5rem);padding:0;list-style:none;pointer-events:none}
.px-crew figure{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin:0}
.px-crew .px{margin:0}
.px-crew figure:nth-child(2) .px::before,.px-crew figure:nth-child(2) .px::after{animation-delay:.35s}
.px-crew figure:nth-child(3) .px::before,.px-crew figure:nth-child(3) .px::after{animation-delay:.65s}
@media (max-width:380px){.px-crew figure:nth-child(n+3){display:none}}

/* 組織図セル内の名札 */
.org-cell .px-name,.org-sec .px-name,.org-ceo .px-name{margin:-2px 0 .25rem}

/* ---------- ボタンにちょこんと乗る1体（.px-perch） ----------
   2026-07-30 竹下：「サービスを見る」等のボタンのところにも付けて。
   使い方：ボタンに px-host を足し、中に <i class="px px--wave px-perch" aria-hidden="true"></i>。
   立ちポーズ（--wave／--run：足がy=18〜21px）専用に top:-21px。デスク付きスプライトには使わない（.px-sit を使う）。
   2体目が同じ行に並ぶときは .px-perch--l で左肩に乗せる */
.px-perch{position:absolute;top:-21px;right:14px;margin:0;pointer-events:none}
.px-perch--l{right:auto;left:14px}
.px-perch--l::before,.px-perch--l::after{animation-delay:.45s}
/* ボタンが縦積みになる幅では2体目が上のボタンに食い込むので降ろす（1体目は残す＝消さず減らす） */
@media (max-width:560px){.px-perch--l{display:none}}