/* ============================================================
   MUKIAI v2 下層ページ（サービス／事例／会社概要／特商法）の部品
   top.css の上に重ねて読む。色・文字・動きの定義は top.css のものを使う
   ============================================================ */

/* ---------------- ページ遷移（全ページ共通。top.css を読むページはすべて対象） ---------------- */

/* ---------------- 下層ページの最初の画面（夜空） ---------------- */
.page-hero{position:relative;z-index:1;min-height:78vh;display:flex;align-items:flex-end;padding:calc(var(--header-h) + 72px) 0 clamp(96px,10vw,150px);color:#fff;overflow:clip;
  background:radial-gradient(70% 90% at 85% 10%,#1B3470 0%,rgba(18,33,74,0) 60%),radial-gradient(120% 90% at 20% 100%,#12214A 0%,#0B1736 55%,#060D22 100%)}
.page-hero--short{min-height:56vh}
.page-hero .stars{position:absolute;inset:0;pointer-events:none;opacity:.8;
  background-image:radial-gradient(1px 1px at 12% 22%,#fff,transparent),radial-gradient(1px 1px at 32% 68%,#dfe8ff,transparent),radial-gradient(1.5px 1.5px at 58% 18%,#fff,transparent),radial-gradient(1px 1px at 74% 52%,#cfe0ff,transparent),radial-gradient(1px 1px at 88% 30%,#fff,transparent),radial-gradient(1px 1px at 46% 40%,#b8ccff,transparent),radial-gradient(1.2px 1.2px at 6% 80%,#fff,transparent),radial-gradient(1px 1px at 94% 84%,#dfe8ff,transparent),radial-gradient(1px 1px at 66% 88%,#fff,transparent),radial-gradient(1px 1px at 24% 50%,#cfe0ff,transparent)}
.page-hero .orbit-deco{top:auto;bottom:-6%;right:-14%;opacity:.6}
.page-hero .wrap{width:min(var(--wrap),100% - var(--gutter)*2)}
.page-tag{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:700;color:var(--on-dark-muted)}
.page-tag::before{content:"";width:26px;height:2px;background:var(--grad)}
.page-title{margin-top:22px;font-size:clamp(34px,5.4vw,88px);line-height:1.12;letter-spacing:-.03em;font-weight:900;max-width:16em;text-shadow:0 4px 30px rgba(3,8,24,.6)}
.page-hero--short .page-title{font-size:clamp(34px,4.6vw,72px)}
.page-lead{margin-top:clamp(20px,2.6vw,34px);max-width:34em;font-size:var(--fs-lead);line-height:2;color:#DCE3F4}
.page-hero .btn-row{margin-top:34px}
.page-hero .btn-note{color:var(--on-dark-muted)}
.page-hero .btn--solid{background:#fff;color:var(--navy)}
.page-hero .btn--solid:hover{color:#fff}
.conclusion{margin-top:34px;max-width:46em;padding:22px 26px;border-radius:18px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px var(--on-dark-line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.conclusion b{display:block;font-size:12px;letter-spacing:.14em;color:#8DB8FF;margin-bottom:6px}
.conclusion p{font-size:15px;line-height:1.9;color:#DCE3F4}
/* 入ってきたページの見出しは、紺の面が抜けるのを待ってから出る */
.pt-in-go .page-hero .rv .ch{transition-delay:calc(380ms + var(--i) * var(--stagger-char))}

/* ---------------- 共通の小部品 ---------------- */
.sec-head{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end}
.sec-head .lead{grid-column:1/-1}
.checks{display:grid;gap:12px;margin-top:40px;max-width:54em}
.checks li{display:flex;align-items:center;gap:18px;padding:20px 24px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-weight:700;font-size:clamp(16px,1.3vw,19px);line-height:1.6}
.checks li::before{content:"";flex:none;width:26px;height:26px;border-radius:50%;background:var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.fit-note{margin-top:20px;font-size:14px;color:var(--ink-muted)}
.inline-cta{margin-top:clamp(40px,5vw,64px)}
.fill-in{}

/* ---------------- サービス：7つの工程（ピン留め） ---------------- */
#program{padding-block:0}
#program .process-pin{height:340vh}
#program .h2{font-size:clamp(30px,3.9vw,60px)}
.bands{display:grid;grid-template-columns:repeat(7,1fr);gap:8px 12px;margin-top:clamp(24px,3vw,40px)}
.band{position:relative;padding:10px 16px;border-radius:12px;font-size:13px;font-weight:800;letter-spacing:.06em;line-height:1.5;display:flex;align-items:center;gap:10px}
.band small{font-weight:700;letter-spacing:0;font-size:12.5px;opacity:.85}
.band--all{grid-column:1/-1;background:var(--navy);color:#fff}
.band--split{grid-column:span 4;background:#DCE6FA;color:var(--navy)}
.band--make{grid-column:span 1;background:#CFE9F7;color:var(--navy)}
.band--grad{grid-column:span 2;background:linear-gradient(100deg,#DCE6FA,#CFF1F6);color:var(--navy)}
.band--rule{grid-column:1/-1;background:transparent;color:var(--ink-muted);box-shadow:inset 0 0 0 1px var(--line);font-weight:700}
.steps--7{grid-template-columns:repeat(7,1fr);gap:12px;margin-top:12px}
.steps--7 .step{padding:18px 16px 18px}
.steps--7 .step h3{font-size:clamp(15px,1.15vw,18px);line-height:1.5;margin-top:4px}
.steps--7 .step p:not(.step-k){font-size:13px;line-height:1.75;margin-top:8px}
.steps--7 .phase{width:40px;height:40px;margin-bottom:12px}
.steps--7 .steps-line{top:38px;left:36px;right:36px}
.step-out{margin-top:10px;font-size:11.5px;font-weight:700;color:var(--blue-deep);line-height:1.5}
.step .ex{display:inline-block;margin-top:8px;font-size:12px;font-weight:700;color:var(--blue-deep);text-decoration:none;border-bottom:1px solid currentColor}
@media (max-height:860px) and (min-width:861px){
  .steps--7 .step p:not(.step-k){font-size:12.5px;line-height:1.65}
  #program .h2{font-size:clamp(28px,3.2vw,48px)}
  .bands{margin-top:18px}
}

/* ---------------- サービス：料金 ---------------- */
.price-wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin-top:clamp(40px,5vw,64px)}
.price-card{padding:clamp(28px,3.4vw,48px);border-radius:var(--r-lg);background:linear-gradient(150deg,#122356,#1A2B5F 55%,#1C3F8C);color:#fff;box-shadow:0 50px 100px -50px rgba(26,43,95,.8)}
.price-name{font-size:14px;font-weight:800;letter-spacing:.08em;color:#8DB8FF}
.price-nums{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:22px}
.price-num{display:flex;align-items:baseline;gap:6px;font-size:clamp(64px,7.4vw,120px);line-height:1;letter-spacing:-.03em}
.price-num .pre,.price-num .post{font-size:clamp(16px,1.4vw,22px);font-weight:900;letter-spacing:0}
.price-tax{margin-top:14px;font-size:13px;color:var(--on-dark-muted)}
.price-card p.note{margin-top:20px;font-size:15px;line-height:1.9;color:#DCE3F4}
.payback{padding:clamp(28px,3.4vw,44px);border-radius:var(--r-lg);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.payback h3{font-size:clamp(20px,1.8vw,26px);font-weight:900;line-height:1.4}
.payback ol{margin-top:20px;display:grid;gap:10px;counter-reset:pb}
.payback li{position:relative;padding:14px 16px 14px 56px;border-radius:14px;background:var(--paper);font-size:15px;line-height:1.7;font-weight:500;counter-increment:pb}
.payback li::before{content:counter(pb);position:absolute;left:14px;top:13px;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-family:var(--font-en);font-weight:800;font-size:13px}
.payback .pb-note{margin-top:16px;font-size:13.5px;line-height:1.8;color:var(--ink-muted)}
.payback .pb-ex{margin-top:16px;padding:14px 16px;border-radius:14px;box-shadow:inset 0 0 0 1px #BFD0F0;font-size:14px;line-height:1.8}
.payback .pb-ex b{font-weight:900;color:var(--navy)}

/* ---------------- サービス：お受けしていない仕事・ほかのサービス・FAQ ---------------- */
.nots{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:32px}
.nots li{padding:20px 22px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);font-weight:700;font-size:15px;line-height:1.6;display:flex;gap:12px;align-items:flex-start;background:#fff}
.nots li::before{content:"";flex:none;margin-top:6px;width:14px;height:2px;background:var(--ink-muted)}
.nots-foot{margin-top:18px;font-size:14px;color:var(--ink-muted)}
.opts{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-top:clamp(36px,4vw,56px)}
.opt{padding:clamp(26px,3vw,40px);border-radius:var(--r);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.opt h3{font-size:clamp(22px,2vw,30px);font-weight:900;margin-top:8px}
.opt p{margin-top:12px;color:var(--ink-muted);font-size:15px;line-height:1.85}
.opt .svc-price{margin-top:16px}
.opt--min{background:transparent}
.faq{margin-top:36px;display:grid;gap:12px;max-width:60em}
.faq details{border-radius:16px;box-shadow:inset 0 0 0 1px var(--on-dark-line);background:rgba(255,255,255,.04);overflow:hidden}
.faq summary{list-style:none;cursor:pointer;padding:22px 60px 22px 24px;font-weight:700;font-size:clamp(16px,1.3vw,19px);position:relative;line-height:1.6}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:24px;top:50%;width:14px;height:14px;margin-top:-7px;
  background:linear-gradient(#fff,#fff) center/14px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 14px no-repeat;transition:transform 390ms var(--ease-reveal)}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq .faq-a{padding:0 24px 22px;color:var(--on-dark-muted);font-size:15px;line-height:1.9}

/* ---------------- 事例：場面の物語 ---------------- */
.story{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start}
.stage-wrap{position:sticky;top:calc(var(--header-h) + 24px);height:calc(100vh - var(--header-h) - 48px);display:flex;align-items:center}
.stage{position:relative;width:100%;aspect-ratio:1/1;max-height:100%;border-radius:var(--r-lg);overflow:hidden;color:#fff;
  background:radial-gradient(90% 80% at 70% 20%,#1B3470 0%,#0E1B3D 55%,#070F26 100%);box-shadow:0 60px 120px -60px rgba(7,15,38,.9),inset 0 0 0 1px rgba(255,255,255,.06)}
.stage::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.7;
  background-image:radial-gradient(1px 1px at 12% 22%,#fff,transparent),radial-gradient(1px 1px at 82% 68%,#dfe8ff,transparent),radial-gradient(1.5px 1.5px at 58% 12%,#fff,transparent),radial-gradient(1px 1px at 34% 82%,#cfe0ff,transparent),radial-gradient(1px 1px at 90% 30%,#fff,transparent)}
.stage-top{position:absolute;left:24px;right:24px;top:20px;display:flex;align-items:center;gap:14px;z-index:3}
.stage-ticks{display:flex;gap:4px;flex:1}
.stage-ticks i{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.16);transition:background-color 600ms var(--ease-reveal)}
.stage-ticks i[data-st="plan"]{background:repeating-linear-gradient(90deg,rgba(141,184,255,.45) 0 3px,transparent 3px 6px)}
.stage-ticks i.past{background:rgba(255,255,255,.55)}
.stage-ticks i.now{background:var(--grad);box-shadow:0 0 10px rgba(59,130,246,.9)}
.stage-label{font-family:var(--font-en);font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--on-dark-muted);white-space:nowrap}
.sv{position:absolute;inset:56px 28px 28px;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transform:translateY(24px) scale(.98);
  transition:opacity 600ms var(--ease-reveal),transform 800ms var(--ease-reveal),visibility 0s 600ms}
.sv.on{opacity:1;visibility:visible;transform:none;transition:opacity 700ms var(--ease-reveal) 120ms,transform 900ms var(--ease-reveal) 120ms,visibility 0s}
.sv-cap{margin-top:auto;font-size:13px;line-height:1.7;color:var(--on-dark-muted);padding-top:14px}
.sv-big{font-family:var(--font-en);font-weight:800;font-size:clamp(56px,6vw,96px);line-height:1;letter-spacing:-.03em}
.sv-big small{font-family:var(--font-ja);font-size:18px;font-weight:900;margin-left:6px;letter-spacing:0}
.sv-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.sv-chip{font-size:12.5px;font-weight:700;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.sv-chip b{font-family:var(--font-en);font-weight:800;margin-left:4px}
/* 場面1：散らばった箱 */
.scatter{position:relative;flex:1;min-height:0}
.scatter i{position:absolute;width:9%;aspect-ratio:1;border-radius:6px;opacity:.85;transition:transform 1.2s var(--ease-reveal)}
.scatter .q{position:absolute;font-family:var(--font-en);font-weight:800;font-size:22px;color:#8DB8FF}
.scatter .out{position:absolute;height:0;border-top:1.5px dashed rgba(201,210,234,.6);transform-origin:left}
.sv.on .scatter i{animation:drift 6s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(6px,-8px) rotate(8deg)}}
/* 場面2：毎週の点 */
.weeks{display:flex;gap:10px;align-items:center;margin-top:12px}
.weeks i{flex:1;height:14px;border-radius:50%;max-width:14px;background:rgba(255,255,255,.14);transition:background-color 400ms,box-shadow 400ms;transition-delay:calc(var(--k) * 140ms)}
.sv.on .weeks i{background:#EAF1FF;box-shadow:0 0 10px rgba(160,200,255,.8)}
.weeks-line{position:relative;height:120px;margin-top:10px}
.weeks-line svg{width:100%;height:100%}
.weeks-line path{fill:none;stroke:#8DB8FF;stroke-width:2;stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset 1.8s var(--ease-reveal) .2s}
.sv.on .weeks-line path{stroke-dashoffset:0}
/* 場面3：研修3回 */
.train{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:end;flex:1;min-height:0}
.train-long{height:26px;border-radius:6px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 18px,rgba(255,255,255,.1) 18px 36px);align-self:center}
.train-long+p{font-size:12px;color:var(--on-dark-muted);grid-column:1;align-self:start;margin-top:-10px}
.train-stack{display:flex;flex-direction:column-reverse;gap:8px}
.train-stack div{padding:12px 14px;border-radius:12px;background:linear-gradient(120deg,#2B4A8C,#3B82F6);font-size:13px;font-weight:700;transform:translateY(-40px);opacity:0;transition:transform 800ms var(--ease-reveal),opacity 600ms;transition-delay:calc(var(--k) * 220ms + 200ms)}
.sv.on .train-stack div{transform:none;opacity:1}
.train-stack b{font-family:var(--font-en);margin-right:8px;color:#CFE0FF}
/* 場面4：87のマス */
.cells{display:grid;grid-template-columns:repeat(15,1fr);gap:4px;margin-top:16px}
.cells i{aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,.1);transition:background-color 300ms;transition-delay:calc(var(--k) * 14ms)}
.sv.on .cells i{background:#2B4A8C}
.sv.on .cells i.hi{background:#6EA6FF;transition-delay:calc(var(--k) * 14ms + 900ms)}
/* 場面5：積み上げ棒 */
.stackbar{display:flex;height:46px;border-radius:10px;overflow:hidden;margin-top:18px;background:rgba(255,255,255,.08)}
.stackbar i{height:100%;transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease-reveal);transition-delay:calc(var(--k) * 160ms + 200ms)}
.sv.on .stackbar i{transform:none}
.legend{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin-top:16px;font-size:13px}
.legend span{display:flex;align-items:center;gap:8px}
.legend span::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--c)}
.sum{margin-top:18px;font-size:clamp(20px,2vw,28px);font-weight:900}
.sum small{display:block;font-size:12px;font-weight:700;color:var(--on-dark-muted);margin-top:4px}
/* 場面6：13人のうち7人 */
.people{display:grid;grid-template-columns:repeat(7,1fr);gap:14px 10px;margin-top:10px}
.people i{position:relative;aspect-ratio:3/4;border-radius:40% 40% 10px 10px;background:rgba(255,255,255,.12);transition:background-color 600ms var(--ease-reveal),opacity 600ms;transition-delay:calc(var(--k) * 60ms)}
.people i::before{content:"";position:absolute;left:30%;right:30%;top:-34%;aspect-ratio:1;border-radius:50%;background:inherit}
.sv.on .people i.pick{background:#EAF1FF}
.sv.on .people i:not(.pick){opacity:.35}
.people i.pick::after{content:"";position:absolute;left:18%;right:18%;top:-110%;aspect-ratio:1;border-radius:var(--sh,6px);border:1.5px dashed rgba(141,184,255,.9);opacity:0;transform:translateY(-10px);transition:opacity 600ms,transform 800ms var(--ease-reveal);transition-delay:calc(var(--k) * 90ms + 800ms)}
.sv.on .people i.pick::after{opacity:1;transform:none}
.people-gap{height:46px}
/* 場面7：3重の枠 */
.rings{position:relative;flex:1;min-height:0;display:grid;place-items:center}
.rings i{position:absolute;border-radius:50%;border:1.5px solid rgba(141,184,255,.8);transform:scale(.4);opacity:0;transition:transform 900ms var(--ease-reveal),opacity 600ms;transition-delay:calc(var(--k) * 300ms + 300ms)}
.sv.on .rings i{transform:none;opacity:1}
.rings .core{width:22%;aspect-ratio:1;border-radius:18px;background:linear-gradient(135deg,#2B4A8C,#3B82F6);display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:8px}
.rings .core b{border-radius:3px;background:rgba(255,255,255,.7)}
.rings .tag{position:absolute;font-size:11.5px;font-weight:700;color:#CFE0FF;white-space:nowrap}
/* 場面8：浮いた時間の行き先 */
.flow8{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin-top:10px}
.flow8 .bar{height:40px;border-radius:10px;background:linear-gradient(90deg,#2B4A8C 0 68%,rgba(141,184,255,.95) 68% 100%);position:relative}
.flow8 .bar span{position:absolute;right:6px;top:-24px;font-size:11.5px;font-weight:700;color:#CFE0FF}
.flow8 .arrow{font-family:var(--font-en);font-size:22px;color:#8DB8FF}
.flow8 .boxes{display:grid;gap:8px}
.flow8 .boxes div{padding:12px;border-radius:12px;border:1.5px dashed rgba(141,184,255,.7);font-size:12.5px;font-weight:700;line-height:1.5}
.flow8 .boxes small{display:block;color:var(--on-dark-muted);font-weight:500}
.chip-grey{margin-top:20px;align-self:flex-start;font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.1);color:var(--on-dark-muted)}
/* 場面9：空のチェック */
.checks9{display:grid;gap:8px}
.checks9 li{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;background:rgba(255,255,255,.06);font-size:13px;font-weight:700;line-height:1.5;transform:translateX(20px);opacity:0;transition:transform 700ms var(--ease-reveal),opacity 600ms;transition-delay:calc(var(--k) * 120ms + 200ms)}
.sv.on .checks9 li{transform:none;opacity:1}
.checks9 li::before{content:"";flex:none;width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1.5px rgba(201,210,234,.7)}
/* 場面10：いまの位置 */
.now10{position:relative;margin-top:18px;height:6px;border-radius:4px;background:repeating-linear-gradient(90deg,rgba(141,184,255,.5) 0 6px,transparent 6px 12px)}
.now10 i{position:absolute;left:0;top:0;bottom:0;width:60%;border-radius:4px;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease-reveal) .2s}
.sv.on .now10 i{transform:none}
.now10 b{position:absolute;left:60%;top:-22px;width:2px;height:48px;background:#8DB8FF;box-shadow:0 0 10px #8DB8FF}
.now10 b::after{content:"今日";position:absolute;left:8px;top:-4px;font-size:11px;font-weight:800;white-space:nowrap;color:#CFE0FF}
.now10-items{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:18px;font-size:11.5px;line-height:1.5;font-weight:700}
.now10-items span:nth-child(n+4){color:var(--on-dark-muted)}
.zeros10{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:24px}
.zeros10 div{padding:12px;border-radius:12px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font-size:12px;font-weight:700;line-height:1.5}
.zeros10 b{display:block;font-family:var(--font-en);font-size:34px;line-height:1;margin-bottom:6px}

/* 場面の文章 */
.scenes{display:grid}
.scene{min-height:92vh;display:flex;flex-direction:column;justify-content:center;padding:8vh 0;scroll-margin-top:var(--header-h)}
.scene-k{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:12px;font-weight:800;letter-spacing:.1em}
.scene-k .num{font-family:var(--font-en);color:var(--blue-deep)}
.badge{font-size:12px;font-weight:800;letter-spacing:.04em;padding:4px 12px;border-radius:999px}
.badge--done{background:var(--navy);color:#fff}
.badge--doing{background:#DCE6FA;color:var(--navy)}
.badge--plan{box-shadow:inset 0 0 0 1.5px #8FA6D8;color:var(--blue-deep);background:#fff}
.scene h2{margin-top:16px;font-size:clamp(28px,3vw,46px);line-height:1.25;letter-spacing:-.02em;font-weight:900}
.scene .body{margin-top:18px;font-size:16px;line-height:2;color:var(--ink)}
.scene .state{margin-top:14px;font-size:14px;font-weight:700;color:var(--blue-deep);line-height:1.7}
.scene .note{margin-top:10px;font-size:13px;color:var(--ink-muted)}
.why-box{margin-top:22px;padding:18px 20px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);border-left:3px solid var(--blue)}
.why-box b{display:block;font-size:12px;letter-spacing:.12em;color:var(--blue-deep);margin-bottom:4px}
.why-box p{font-size:15px;line-height:1.9}
.exp{margin-top:14px;font-size:14px;line-height:1.8;color:var(--ink-muted)}
.scene{opacity:.35;transition:opacity 600ms var(--ease-reveal)}
.scene.is-active{opacity:1}
.story-intro{padding-bottom:0}

/* ---------------- 会社概要 ---------------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:clamp(40px,5vw,64px)}
.pillar{position:relative;padding:clamp(26px,3vw,36px);border-radius:var(--r);background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:inset 0 0 0 1px var(--on-dark-line);overflow:hidden}
.pillar .moon-ic{width:44px;height:44px;border-radius:50%;position:relative;overflow:hidden;background:#1B2A57;box-shadow:0 0 0 1px rgba(201,210,234,.4),0 0 22px rgba(160,200,255,.35)}
.pillar .moon-ic::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#C9D6F2);clip-path:inset(0 calc((1 - var(--ph)) * 100%) 0 0 round 50%)}
.pillar h3{margin-top:18px;font-size:clamp(22px,2vw,30px);font-weight:900}
.pillar .sky{margin-top:6px;font-size:12px;font-weight:800;letter-spacing:.1em;color:#8DB8FF}
.pillar p:last-child{margin-top:12px;font-size:15px;line-height:1.9;color:var(--on-dark-muted)}
.values{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,4vw,64px);align-items:center}
.values figure{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;box-shadow:0 40px 80px -40px rgba(0,0,0,.9)}
.values figure img{width:100%;height:100%;object-fit:cover}
.values p{font-size:var(--fs-lead);line-height:2.05;color:#DCE3F4}
.info{margin-top:clamp(36px,4vw,56px);display:grid;border-top:1px solid var(--line)}
.info div{display:grid;grid-template-columns:12em 1fr;gap:24px;padding:20px 4px;border-bottom:1px solid var(--line);font-size:16px;line-height:1.8}
.info dt{font-weight:800;color:var(--ink-muted);font-size:14px;padding-top:2px}
.info dd{font-weight:500}
.info a{color:var(--blue-deep);word-break:break-all}
.info small{display:block;font-size:13px;color:var(--ink-muted);margin-top:4px}
.privacy{margin-top:36px;display:grid;gap:14px;max-width:52em}
.privacy article{padding:24px 26px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.privacy h3{font-size:17px;font-weight:900}
.privacy p,.privacy li{margin-top:8px;font-size:15px;line-height:1.9;color:var(--ink-muted)}
.privacy ul{list-style:disc;padding-left:1.4em}
.legal-foot{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center}
.legal-foot p{font-size:14px;color:var(--ink-muted)}

/* ---------------- レスポンシブ ---------------- */
@media (max-width:1080px){
  .price-wrap,.opts,.values{grid-template-columns:1fr}
  .pillars,.nots{grid-template-columns:1fr}
}
@media (max-width:860px){
  .sec-head{grid-template-columns:1fr}
  #program .process-pin{height:auto}
  .bands{grid-template-columns:1fr;gap:8px}
  .band--split,.band--make,.band--grad{grid-column:auto}
  .steps--7{grid-template-columns:1fr}
  .steps--7 .step{padding:18px 18px 18px 84px;min-height:84px}
  .steps--7 .phase{left:22px;top:18px}
  .steps--7 .steps-line{left:41px;top:40px;bottom:40px}
  .story{grid-template-columns:1fr;gap:0}
  .stage-wrap{top:var(--header-h);height:auto;z-index:4;padding:10px 0 8px;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);background:linear-gradient(180deg,var(--paper) 88%,rgba(244,246,251,0))}
  .stage{aspect-ratio:auto;height:min(40vh,330px)}
  .sv{inset:44px 18px 16px}
  .stage-top{top:14px;left:18px;right:18px}
  .sv-big{font-size:48px}
  .sv-cap{display:none}
  .scene{min-height:70vh;padding:4vh 0 10vh}
  .scene h2{font-size:clamp(24px,6.6vw,32px)}
  .info div{grid-template-columns:1fr;gap:2px;padding:16px 2px}
  .legend{grid-template-columns:1fr 1fr;font-size:11.5px}
  .now10-items{font-size:10.5px}
  .zeros10 b{font-size:26px}
  .cells{gap:3px}
  .people{gap:10px 8px}
}
@media (max-width:760px){
  .page-hero{min-height:auto;padding-top:calc(var(--header-h) + 56px)}
  .page-hero .btn-row .btn{width:100%}
  .price-num{font-size:clamp(56px,16vw,80px)}
}
@media (prefers-reduced-motion:reduce){
  .sv{transition:none}
  .scene{opacity:1}
}

/* 追補：サービスの「向いている会社」の図、会社概要の月のアイコン */
.fit-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,80px);align-items:center}
.fit-fig{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;box-shadow:0 40px 80px -40px rgba(7,15,38,.7)}
.fit-fig img{width:100%;height:100%;object-fit:cover}
.pillar .moon-ic{display:block}
@media (max-width:860px){.fit-grid{grid-template-columns:1fr}}