/* 立方体の場面（試作 2026-10-06）：本番 /service の柱の絵（cube-scene.js が描く）
 * 層の置き方は brand-scene.css の .bg-scene と同じ（節の最初の子・文字は z-index:1）。.bg-scene の基本の形は brand-scene.css にあるので、両方読む
 * 下は「柱の見出し」の文字の形（本番の .svc-head / .svc-name / .svc-en / .svc-desc / .svc-lp-links の明るい版）
 */
/* 静止（動きを減らす設定・WebGL なし）：左右に濃い青と淡い青の四角、中央に細い輪 */
.bg-scene[data-bg-scene="cubes"].is-static{
  background:
    radial-gradient(circle at 50% 50%,transparent 0 calc(min(34vh,260px) - 1px),rgba(28,42,68,.12) min(34vh,260px) calc(min(34vh,260px) + 1px),transparent calc(min(34vh,260px) + 2px)) no-repeat;
}
.bg-scene[data-bg-scene="cubes"][data-ring="0"].is-static{background:none}
.bg-scene[data-bg-scene="cubes"].is-static::before,
.bg-scene[data-bg-scene="cubes"].is-static::after{content:"";position:absolute;width:44px;height:44px;border-radius:7px;transform:rotate(18deg)}
.bg-scene[data-bg-scene="cubes"].is-static::before{left:7%;top:22%;background:linear-gradient(135deg,#1c2a44,#1c2a44);box-shadow:64px 150px 0 -10px #1c2a44}
.bg-scene[data-bg-scene="cubes"].is-static::after{right:8%;top:30%;background:rgba(161,176,204,.32);box-shadow:-80px 120px 0 -14px rgba(161,176,204,.28)}
@media(max-width:760px){.bg-scene[data-bg-scene="cubes"].is-static::before,.bg-scene[data-bg-scene="cubes"].is-static::after{display:none}}

/* ===== 柱の見出し（本番の柱の場面の並び：番号＋キーワードの小さな丸枠 → 大きな明朝の題 → 英語の斜体 → 中央のリード → サービスへのチップ） ===== */
.pillar-scene{position:relative;overflow:clip;padding:96px 0 72px;text-align:center}
.pillar-scene > .wrap{position:relative;z-index:1}
.pillar-txt{max-width:760px;margin:0 auto;position:relative;isolation:isolate}
/* 文字の下の薄い幕（立方体は文字を避けて置くが、星と輪が文字の後ろを通るので） */
.pillar-txt::before{content:"";position:absolute;z-index:-1;inset:-40px -64px;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(252,251,250,.9),rgba(252,251,250,.62) 50%,transparent 74%)}
.bg-alt .pillar-txt::before{background:radial-gradient(ellipse at center,rgba(248,244,239,.92),rgba(248,244,239,.62) 50%,transparent 74%)}
.bg-surface .pillar-txt::before{background:radial-gradient(ellipse at center,rgba(255,255,255,.92),rgba(255,255,255,.62) 50%,transparent 74%)}
.pillar-key{display:inline-flex;align-items:center;gap:12px;margin:0}
.pillar-key .no{font-family:"Inter","Inter Fallback","Inter Fallback 2",sans-serif;font-size:12px;font-weight:600;letter-spacing:.2em;color:var(--brand-ink,#1c2a44)}
.pillar-key .kw{font-family:"Inter","Inter Fallback","Inter Fallback 2",sans-serif;font-size:10px;font-weight:600;letter-spacing:.26em;color:var(--ink-faint,#687386);border:1px solid var(--line,rgba(32,40,56,.16));border-radius:100px;padding:3px 12px;background:rgba(255,255,255,.7)}
.pillar-title{margin-top:16px;font-family:var(--font-serif,"Noto Serif JP",serif);font-weight:600;font-size:clamp(2.2rem,5.4vw,4rem);line-height:1.3;letter-spacing:.02em;color:var(--ink,#202838)}
.pillar-title small{display:block;margin-top:10px;font-family:var(--font-sans,sans-serif);font-size:clamp(.92rem,1.3vw,1.02rem);font-weight:500;line-height:1.7;letter-spacing:.04em;color:var(--ink-muted,#586375)}
.pillar-en{margin-top:10px;font-family:"Inter","Inter Fallback","Inter Fallback 2",sans-serif;font-style:italic;font-weight:400;font-size:clamp(13px,1.5vw,16px);letter-spacing:.02em;color:var(--brand-ink,#1c2a44)}
.pillar-lead{margin:22px auto 0;max-width:40em;font-size:clamp(.95rem,1.4vw,1.05rem);line-height:2.05;color:var(--ink-muted,#586375)}
.pillar-chips{margin:28px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;padding:0;max-width:720px}
.pillar-chips a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 18px;border-radius:100px;background:#fff;border:1px solid var(--line,rgba(32,40,56,.16));font-size:14px;font-weight:600;color:var(--ink,#202838);text-decoration:none;transition:border-color .25s,color .25s,transform .25s}
.pillar-chips a::after{content:"↗";font-size:12px;color:var(--brand,#1c2a44)}
.pillar-chips a:hover{border-color:var(--brand,#1c2a44);color:var(--brand,#1c2a44);transform:translateY(-1px)}
@media(max-width:760px){
  .pillar-scene{padding:64px 0 40px}
  .pillar-txt::before{inset:-24px -16px}
  .pillar-title{font-size:clamp(28px,8vw,38px);line-height:1.45}
  .pillar-lead{font-size:15px;line-height:1.95}
  .pillar-chips{gap:8px}
  .pillar-chips a{font-size:14px;padding:8px 14px}
  /* スマホ特化（2026-10-06）：札の英字・番号も 13px 以上、リードは本文と同じ大きさ */
  .pillar-key .no,.pillar-key .kw{font-size:var(--m-fs-cap,13px)}
  .pillar-key .kw{letter-spacing:.18em}
  .pillar-lead{font-size:var(--m-fs-lead,16px);line-height:var(--m-lh-lead,1.9)}
}
/* 柱の見出しを節の頭に置くとき：節の上の余白は見出しの側で持つ */
.sec-pillar{padding-top:0}
.sec-pillar > .pillar-scene + .wrap{margin-top:8px}