:root{
  --bg:#0A1220;
  --bg-2:#0E1930;
  --panel:#111F3A;
  --ivory:#F1ECDF;
  --ivory-2:#E9E2D1;
  --ink:#101A2C;
  --tx:#EDEAE0;
  --tx-dim:rgba(237,234,224,.55);
  --tx-faint:rgba(237,234,224,.32);
  --line:rgba(237,234,224,.1);
  --line-ink:rgba(16,26,44,.14);
  --blue:#6E97FF;
  --navy-logo:#16233F;
  --en:'Inter Tight',sans-serif;
  --jp:'Noto Sans JP',sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.83,0,.17,1);
  --nav-h:64px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  font-family:var(--jp);
  background:var(--bg);
  color:var(--tx);
  font-size:14px;
  line-height:2;
  letter-spacing:.03em;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
::selection{background:var(--blue);color:#0A1220}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
svg{display:block}
.en{font-family:var(--en)}
h1,h2,h3{font-weight:800;line-height:1.35}

/* subtle film grain over everything */
body::after{content:'';position:fixed;inset:-60%;z-index:96;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* 低カロリー化: グレインは静止テクスチャに(常時アニメを削減) */

/* ---------- reveal primitives ---------- */
.r{opacity:0;transform:translateY(30px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.r.on{opacity:1;transform:none}
.rl{display:block;overflow:hidden}
.rl>span{display:block;transform:translateY(112%);transition:transform 1.15s var(--ease)}
.on .rl>span,.rl.on>span{transform:none}
.on .rl:nth-child(2)>span{transition-delay:.1s}
.on .rl:nth-child(3)>span{transition-delay:.2s}
.dd1{transition-delay:.1s}.dd2{transition-delay:.2s}.dd3{transition-delay:.3s}.dd4{transition-delay:.4s}.dd5{transition-delay:.55s}

/* ---------- progress + dots + floating CTA ---------- */
#prog{position:fixed;top:0;left:0;height:2px;width:100%;background:linear-gradient(90deg,var(--blue),#9db9ff);
  transform-origin:left;transform:scaleX(0);z-index:130}
#dots{position:fixed;right:26px;top:50%;transform:translateY(-50%);z-index:120;display:flex;flex-direction:column;gap:18px}
#dots a{display:flex;align-items:center;gap:10px;flex-direction:row-reverse}
#dots .d{width:7px;height:7px;border-radius:50%;background:var(--tx-faint);transition:background .4s,transform .4s}
#dots .lb{font-family:var(--en);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--tx-dim);
  opacity:0;transform:translateX(6px);transition:opacity .35s,transform .35s;white-space:nowrap}
#dots a:hover .lb,#dots a.act .lb{opacity:1;transform:none}
#dots a.act .d{background:var(--blue);transform:scale(1.5)}
#dots.on-light .d{background:rgba(16,26,44,.3)}
#dots.on-light .lb{color:rgba(16,26,44,.6)}
#dots.on-light a.act .d{background:var(--ink)}
@media(max-width:920px){#dots{display:none}}

#fab{position:fixed;right:22px;bottom:22px;z-index:125;display:flex;align-items:center;gap:10px;
  background:var(--ivory);color:var(--ink);border-radius:999px;padding:14px 24px;
  font-weight:700;font-size:12.5px;letter-spacing:.1em;box-shadow:0 18px 50px -18px rgba(0,0,0,.6);
  transform:translateY(140%);transition:transform .7s var(--ease);cursor:pointer}
#fab .pulse{width:8px;height:8px;border-radius:50%;background:#2FA36B;position:relative}
/* 低カロリー化: パルスはFAB表示時に4回だけ再生し、常時点滅させない */
#fab .pulse::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid #2FA36B;opacity:0}
#fab.show .pulse::after{animation:pulse 2s ease-out 4}
@keyframes pulse{from{transform:scale(1);opacity:.6}to{transform:scale(2.2);opacity:0}}
#fab.show{transform:none}
#fab:hover{background:#fff}

/* ---------- nav ---------- */
nav#top-nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:128;
  display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,3.4vw,44px);
  transition:background .5s,backdrop-filter .5s,border-color .5s;border-bottom:1px solid transparent}
nav#top-nav.solid{background:rgba(10,18,32,.72);backdrop-filter:blur(20px) saturate(1.4);border-color:var(--line)}
.n-brand{display:flex;align-items:center;gap:10px;cursor:pointer}
.n-brand svg{width:20px}
.n-brand b{font-family:var(--en);font-weight:600;font-size:15.5px;letter-spacing:.14em}
.n-links{display:flex;gap:30px;align-items:center}
.n-links a{font-family:var(--en);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-dim);
  transition:color .3s;position:relative;padding:6px 0}
.n-links a::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--tx);
  transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.n-links a:hover{color:var(--tx)}
.n-links a:hover::after{transform:scaleX(1);transform-origin:left}
.n-cta{background:var(--tx);color:var(--ink)!important;border-radius:999px;padding:9px 20px!important;
  font-weight:600;transition:transform .4s var(--ease),background .3s}
.n-cta::after{display:none!important}
.n-cta:hover{transform:scale(1.05);background:#fff}
#burger{display:none;width:40px;height:40px;position:relative}
#burger i{position:absolute;left:9px;right:9px;height:1.5px;background:var(--tx);transition:all .5s var(--ease)}
#burger i:nth-child(1){top:15px}#burger i:nth-child(2){top:24px}
body.m-open #burger i:nth-child(1){top:19.5px;transform:rotate(20deg)}
body.m-open #burger i:nth-child(2){top:19.5px;transform:rotate(-20deg)}
@media(max-width:920px){.n-links{display:none}#burger{display:block}}

#m-ov{position:fixed;inset:0;z-index:127;background:rgba(10,18,32,.97);backdrop-filter:blur(24px);
  clip-path:circle(0 at calc(100% - 40px) 40px);transition:clip-path .9s var(--ease-io);
  display:flex;align-items:center;padding:0 clamp(28px,9vw,110px)}
body.m-open #m-ov{clip-path:circle(150% at calc(100% - 40px) 40px)}
#m-ov ul{list-style:none;width:100%}
#m-ov li{overflow:hidden;border-bottom:1px solid var(--line)}
#m-ov a{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;
  font-family:var(--en);font-weight:700;font-size:clamp(24px,6.4vw,40px);letter-spacing:.02em;
  transform:translateY(110%);transition:transform .8s var(--ease)}
body.m-open #m-ov a{transform:none}
#m-ov li:nth-child(1) a{transition-delay:.15s}#m-ov li:nth-child(2) a{transition-delay:.21s}
#m-ov li:nth-child(3) a{transition-delay:.27s}#m-ov li:nth-child(4) a{transition-delay:.33s}
#m-ov li:nth-child(5) a{transition-delay:.39s}#m-ov li:nth-child(6) a{transition-delay:.45s}
#m-ov li:nth-child(7) a{transition-delay:.51s}
#m-ov a small{font-family:var(--jp);font-weight:400;font-size:11px;letter-spacing:.2em;color:var(--tx-dim)}

/* ====================================================== */

/* ---------- shared section chrome ---------- */
.sec{position:relative;padding:clamp(110px,15vh,180px) clamp(22px,6vw,96px)}
.light{background:var(--ivory);color:var(--ink)}
.light ::selection{background:var(--ink);color:var(--ivory)}
.kick{display:flex;align-items:center;gap:14px;font-family:var(--en);font-size:11px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--blue);margin-bottom:clamp(22px,4vh,36px)}
.kick::before{content:'';width:26px;height:1px;background:var(--blue)}
.light .kick{color:#3B5EC9}.light .kick::before{background:#3B5EC9}
.h-xl{font-family:var(--en);font-weight:800;font-size:clamp(34px,6.4vw,84px);letter-spacing:-.025em;line-height:1.06}
.h-lg{font-family:var(--en);font-weight:800;font-size:clamp(28px,4.6vw,58px);letter-spacing:-.02em;line-height:1.12}
.jp-big{font-weight:900;font-size:clamp(22px,3.8vw,44px);line-height:1.7;letter-spacing:.04em}
.sub{margin-top:clamp(20px,3.4vh,32px);max-width:34em;color:var(--tx-dim);font-size:clamp(13px,1.4vw,15px)}
.light .sub{color:rgba(16,26,44,.65)}
/* 改行品質: balance=行長を均等化 / auto-phrase=和文の文節改行(Chrome以外は無視されるだけで無害) */
h1,h2,h3,.jp-big,.lp-h1,#promise .pm-line,#stay .verdict,.qt{text-wrap:balance;word-break:auto-phrase}
p,.sub{text-wrap:pretty}
.sub{word-break:auto-phrase}
.lp-hero-tx .sub b{white-space:nowrap}
.wrap{max-width:1240px;margin:0 auto}

/* buttons */
.btn-p{display:inline-flex;align-items:center;gap:12px;background:var(--tx);color:var(--ink);
  border-radius:999px;padding:16px 34px;font-weight:700;font-size:13px;letter-spacing:.08em;
  transition:transform .45s var(--ease),box-shadow .45s;will-change:transform}
.btn-p:hover{transform:scale(1.045);box-shadow:0 20px 50px -18px rgba(237,234,224,.35)}
.btn-p .ar{font-family:var(--en);transition:transform .4s var(--ease)}
.btn-p:hover .ar{transform:translateX(5px)}
.light .btn-p{background:var(--ink);color:var(--ivory)}
.light .btn-p:hover{box-shadow:0 20px 50px -18px rgba(16,26,44,.45)}
.btn-g{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:999px;
  padding:15px 30px;font-weight:600;font-size:12.5px;letter-spacing:.08em;color:var(--tx-dim);
  transition:border-color .4s,color .4s,transform .45s var(--ease)}
.btn-g:hover{border-color:var(--tx);color:var(--tx);transform:scale(1.04)}

/* ---------- HERO ---------- */
#top{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;position:relative;overflow:hidden;
  background:
    radial-gradient(1100px 560px at 50% -10%,rgba(110,151,255,.13),transparent 62%),
    radial-gradient(800px 480px at 85% 100%,rgba(110,151,255,.06),transparent 60%),
    var(--bg)}
#top .aur{position:absolute;inset:0;pointer-events:none;
  background:conic-gradient(from 180deg at 50% 46%,transparent 0deg,rgba(110,151,255,.05) 90deg,transparent 160deg,rgba(237,234,224,.03) 250deg,transparent 360deg);
  animation:aur 56s linear infinite;filter:blur(40px)}
/* 低カロリー化: オーロラは半分以下の速度に(画面外では JS が一時停止) */
@keyframes aur{to{transform:rotate(360deg)}}
#logo-hero{width:clamp(120px,15vw,196px);margin-bottom:clamp(28px,5vh,44px);will-change:transform}
#logo-hero polygon{fill:var(--tx);opacity:0;transform:translateY(-40px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
#logo-hero .p2{transform:translate(-46px,20px)}
#logo-hero .p3{transform:translate(-20px,44px)}
#logo-hero.set polygon{opacity:1;transform:none}
#logo-hero.set .p1{transition-delay:.15s}#logo-hero.set .p2{transition-delay:.4s}#logo-hero.set .p3{transition-delay:.65s}
#top .word{font-family:var(--en);font-weight:600;font-size:clamp(17px,2vw,24px);letter-spacing:.42em;text-indent:.42em;
  color:var(--tx);margin-bottom:clamp(26px,4.6vh,40px)}
#top .word span{display:inline-block;opacity:0;filter:blur(8px);transform:translateY(10px)}
#top.set .word span{animation:crisp .9s var(--ease) forwards}
@keyframes crisp{to{opacity:1;filter:blur(0);transform:none}}
#top h1{position:relative;z-index:2}
#top .h1-en{font-family:var(--en);font-weight:800;font-size:clamp(34px,7vw,88px);letter-spacing:-.03em;line-height:1.02}
#top .h1-en em{font-style:italic;font-weight:400;letter-spacing:-.01em}
/* 日本語ヒーロー見出し(AI人材育成): 和文900+palt、"AI"のみ欧文で銘柄感を残す */
#top .h1-en.ja{font-family:var(--jp);font-weight:900;letter-spacing:.04em;font-feature-settings:"palt";line-height:1.1}
#top .h1-en.ja .lat{font-family:var(--en);font-weight:800;letter-spacing:-.02em;margin-right:.06em}
#top .h1-jp{margin-top:clamp(18px,3vh,28px);font-size:clamp(13px,1.7vw,17px);font-weight:500;letter-spacing:.3em;text-indent:.3em;color:var(--tx-dim)}
#top .h-cta{margin-top:clamp(34px,5.4vh,52px);display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
#top .h-base{position:absolute;bottom:26px;left:0;right:0;display:flex;justify-content:space-between;
  padding:0 clamp(22px,6vw,96px);font-family:var(--en);font-size:9.5px;letter-spacing:.22em;color:var(--tx-faint);text-transform:uppercase}
#top .mouse{width:20px;height:32px;border:1.5px solid var(--tx-faint);border-radius:12px;position:relative;margin:0 auto}
#top .mouse::after{content:'';position:absolute;left:50%;top:6px;width:2px;height:6px;background:var(--tx-dim);
  border-radius:2px;transform:translateX(-50%);animation:wheel 1.8s ease-in-out infinite}
@keyframes wheel{0%{opacity:1;transform:translate(-50%,0)}70%{opacity:0;transform:translate(-50%,10px)}100%{opacity:0}}

/* logo ticker under hero */
.tick{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;position:relative;background:var(--bg-2)}
.tick .in{display:flex;gap:0;width:max-content;animation:tk 60s linear infinite}
.tick .it{display:flex;align-items:center;gap:14px;padding:0 34px;font-family:var(--en);font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--tx-faint);white-space:nowrap}
.tick .it svg{width:12px;opacity:.5}
.tick .it svg polygon{fill:var(--tx)}
@keyframes tk{to{transform:translateX(-50%)}}

/* ---------- PROBLEM scrollytelling ---------- */
#problem{height:380vh;position:relative}
#problem .pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;padding:0 clamp(22px,6vw,96px)}
#problem .pq{position:absolute;left:clamp(22px,6vw,96px);right:clamp(22px,6vw,96px);top:50%;transform:translateY(-40%);
  opacity:0;will-change:opacity,transform}
#problem .pq .qn{font-family:var(--en);font-weight:300;font-size:clamp(60px,11vw,150px);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(237,234,224,.25)}
#problem .pq .qt{font-weight:900;font-size:clamp(24px,4.6vw,52px);line-height:1.6;margin-top:10px;max-width:20em}
#problem .pq .qs{margin-top:16px;color:var(--tx-dim);font-size:clamp(12px,1.4vw,14.5px);max-width:34em}
#problem .fin{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  padding:0 clamp(22px,6vw,96px);opacity:0;will-change:opacity,transform}
#problem .fin .jp-big em{font-style:normal;color:var(--blue)}
#problem .p-prog{position:absolute;left:clamp(22px,6vw,96px);bottom:12vh;display:flex;gap:8px}
#problem .p-prog i{width:34px;height:2px;background:var(--line);position:relative;overflow:hidden}
#problem .p-prog i::after{content:'';position:absolute;inset:0;background:var(--blue);transform:scaleX(0);transform-origin:left}
#problem .p-prog i.f::after{transform:scaleX(1);transition:transform .5s var(--ease)}

/* ====================================================== */

/* ---------- PROMISE + stats ---------- */
#promise{background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%)}
#promise .pm-line{font-weight:900;font-size:clamp(26px,5.2vw,60px);line-height:1.6}
#promise .pm-line .hl{position:relative;white-space:nowrap}
#promise .pm-line .hl i{font-style:normal;position:relative;z-index:2}
#promise .pm-line .hl::before{content:'';position:absolute;left:-2%;right:-2%;bottom:.08em;height:.46em;
  background:var(--blue);opacity:.28;transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .5s}
#promise .on .hl::before,#promise .hl.on::before{transform:scaleX(1)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:clamp(50px,8vh,80px);border-radius:18px;overflow:hidden}
.stat{background:var(--bg);padding:clamp(28px,4.6vh,46px) clamp(18px,2.4vw,34px)}
.stat .sn{font-family:var(--en);font-weight:800;font-size:clamp(34px,5.4vw,62px);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.stat .sn small{font-size:.36em;font-weight:600;letter-spacing:0;color:var(--tx-dim);margin-left:4px}
.stat .sl{margin-top:12px;font-size:11.5px;letter-spacing:.14em;color:var(--tx-dim)}
@media(max-width:760px){.stats{grid-template-columns:1fr}}

/* ---------- BEFORE/AFTER drag slider ---------- */
#shift .cmp{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line-ink);
  user-select:none;-webkit-user-select:none;touch-action:pan-y;margin-top:clamp(40px,6vh,60px);
  box-shadow:0 40px 90px -50px rgba(16,26,44,.5)}
.cmp .side{padding:clamp(30px,5vh,54px) clamp(22px,4vw,54px);min-height:clamp(380px,52vh,480px);display:flex;flex-direction:column}
.cmp .before-l{background:var(--ivory-2);color:var(--ink)}
.cmp .after-l{position:absolute;inset:0;background:var(--navy-logo);color:var(--tx);
  clip-path:inset(0 0 0 var(--cut,50%));will-change:clip-path}
.cmp .tagb{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.26em;text-transform:uppercase;opacity:.5}
.cmp h3{font-size:clamp(19px,2.6vw,28px);font-weight:900;margin-top:12px}
.cmp ul{list-style:none;margin-top:auto;padding-top:26px}
.cmp li{display:flex;gap:14px;align-items:baseline;padding:12px 0;border-top:1px solid rgba(16,26,44,.12);font-size:clamp(12px,1.4vw,14px)}
.cmp .after-l li{border-color:rgba(237,234,224,.14)}
.cmp li .t{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.08em;min-width:74px;opacity:.55}
.cmp .handle{position:absolute;top:0;bottom:0;left:var(--cut,50%);width:2px;background:var(--tx);cursor:ew-resize;z-index:5}
.cmp .handle::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;background:var(--tx);box-shadow:0 10px 30px rgba(0,0,0,.35)}

.cmp .hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:6;
  font-family:var(--en);font-size:10px;letter-spacing:.24em;text-transform:uppercase;
  background:rgba(16,26,44,.75);color:var(--tx);padding:7px 16px;border-radius:999px;backdrop-filter:blur(6px);
  animation:hintN 2.4s ease-in-out infinite;pointer-events:none;transition:opacity .5s}
.cmp.used .hint{opacity:0}
@keyframes hintN{0%,100%{transform:translateX(-50%)}50%{transform:translateX(calc(-50% + 10px))}}
/* ---------- pinned 訴求 sections (shift / pricing) ----------
   JS が「コンテンツが1画面に収まる」時だけ .js-pin を付与。
   reduced-motion・低背丈画面では通常フローのまま(スクロールジャックしない) */
#shift.js-pin{padding:0;height:240vh}
#shift.js-pin .s-pin{position:sticky;top:0;min-height:100svh;
  display:flex;align-items:center;
  /* 固定ヘッダー(64px)の裏にコンテンツ上端が食い込まないよう、上パディングにヘッダー分を足す */
  padding:calc(64px + clamp(8px,1.5vh,20px)) clamp(22px,6vw,96px) clamp(24px,4vh,52px)}
#shift.js-pin .wrap{width:100%}
#shift.js-pin .cmp .side{min-height:clamp(300px,40vh,420px);padding:clamp(24px,3.5vh,38px) clamp(22px,4vw,54px)}
#shift.js-pin .cmp .side .sp{width:clamp(140px,17vw,180px);margin-top:14px}
#shift.js-pin .cmp ul{padding-top:16px}
#shift.js-pin .cmp li{padding:9px 0}
#shift.js-pin .jp-big{margin-bottom:8px}
/* モバイル: DRAGピルが表の最終行に被らない下余白 + ハンドル円縮小(終端でラベルに被らない)。
   js-pin の padding ショートハンドより後に置き上書きする */
@media(max-width:680px){
  .cmp .side,#shift.js-pin .cmp .side{padding-bottom:64px}
  .cmp .handle::before{width:44px;height:44px}
  /* イラストの存在感を上げる(カード幅に対して小さすぎた) */
  .cmp .side .sp,#shift.js-pin .cmp .side .sp{width:min(210px,58vw)}
}
/* カウント中(0→40)も桁数で幅が揺れないように */
#pricing .big{min-width:2ch;font-variant-numeric:tabular-nums}

/* ---------- PROGRAM horizontal ---------- */
#program{position:relative}
#program .h-pin{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
#program .h-head{padding:0 clamp(22px,6vw,96px);margin-bottom:clamp(26px,4vh,40px)}
#program .track{display:flex;gap:clamp(16px,2vw,28px);padding:0 clamp(22px,6vw,96px);will-change:transform;width:max-content}
.pcard{width:clamp(280px,32vw,430px);flex-shrink:0;background:var(--panel);border:1px solid var(--line);
  border-radius:22px;padding:clamp(26px,3.6vh,40px);display:flex;flex-direction:column;min-height:clamp(340px,46vh,430px);
  transition:transform .6s var(--ease),border-color .5s;position:relative;overflow:hidden}
.pcard:hover{transform:translateY(-8px);border-color:rgba(237,234,224,.3)}
.pcard .pc-no{font-family:var(--en);font-weight:300;font-size:clamp(48px,6vw,76px);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(237,234,224,.3)}
.pcard h3{font-size:clamp(17px,2vw,22px);font-weight:900;margin-top:auto}
.pcard p{margin-top:12px;color:var(--tx-dim);font-size:12.5px}
.pcard .pc-en{font-family:var(--en);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--blue);margin-top:16px}
.pcard.last{background:linear-gradient(140deg,#1B2F58,#14243F);border-color:rgba(110,151,255,.35)}
#program .h-bar{margin:clamp(26px,4vh,40px) clamp(22px,6vw,96px) 0;height:2px;background:var(--line);position:relative;max-width:420px}
#program .h-bar i{position:absolute;inset:0;background:var(--blue);transform-origin:left;transform:scaleX(0)}
@media(max-width:899px){
  #program{height:auto!important}
  #program .h-pin{position:static;height:auto;padding:clamp(90px,12vh,140px) 0}
  #program .track{flex-direction:column;width:auto;padding:0 clamp(22px,6vw,96px)}
  .pcard{width:100%;min-height:0}
  #program .h-bar{display:none}
}

/* ---------- STAY (goal gradient) ---------- */
#stay .path-wrap{margin-top:clamp(46px,8vh,80px);position:relative}
#stay .line{position:absolute;left:0;right:0;top:11px;height:2px;background:var(--line-ink)}
#stay .line i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(var(--sp,0))}
#stay .nodes{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(10px,1.6vw,20px);position:relative}
#stay .node .dot{width:24px;height:24px;border-radius:50%;border:2px solid rgba(16,26,44,.25);background:var(--ivory);
  display:flex;align-items:center;justify-content:center;transition:border-color .5s,background .5s}
#stay .node .dot::after{content:'';width:8px;height:8px;border-radius:50%;background:transparent;transition:background .5s}
#stay .node.on .dot{border-color:var(--ink)}
#stay .node.on .dot::after{background:var(--ink)}
#stay .node .nt{font-family:var(--en);font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(16,26,44,.4);margin-top:16px}
#stay .node h3{font-size:clamp(14px,1.7vw,18px);font-weight:900;margin-top:4px;opacity:.35;transition:opacity .5s}
#stay .node p{font-size:11px;color:rgba(16,26,44,.55);margin-top:8px;line-height:1.9;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
#stay .node.on h3{opacity:1}
#stay .node.on p{opacity:1;transform:none}
#stay .node .mk{display:inline-block;margin-top:10px;font-size:10px;font-weight:700;letter-spacing:.14em;
  color:#B33A2B;opacity:0;transition:opacity .5s .2s}
#stay .node.on .mk{opacity:1}
#stay .verdict{margin-top:clamp(50px,8vh,80px);font-weight:900;font-size:clamp(20px,3.4vw,38px);line-height:1.8}
#stay .verdict em{font-style:normal;color:#B33A2B}
@media(max-width:820px){
  #stay .line{left:11px;right:auto;top:0;bottom:0;width:2px;height:auto}
  #stay .line i{transform-origin:top;transform:scaleY(var(--sp,0))}
  #stay .nodes{grid-template-columns:1fr;gap:26px}
  #stay .node{display:grid;grid-template-columns:24px 1fr;gap:0 18px}
  #stay .node .nt{margin-top:2px;grid-column:2}
  #stay .node h3,#stay .node p,#stay .node .mk{grid-column:2}
}

/* ====================================================== */

/* ---------- PRICING ---------- */
#pricing{background:linear-gradient(180deg,var(--bg-2),var(--bg))}
#pricing .pr-flex{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(30px,6vw,90px);align-items:end;margin-top:clamp(30px,5vh,50px)}
/* line-height<1 + background-clip:text は字形の上端がクリップされる(実機で「40」が見切れた)。
   box を字形より広く取り(inline-block + lh1.22)、詰めは負マージンで行う */
#pricing .big{display:inline-block;font-family:var(--en);font-weight:800;font-size:clamp(108px,19vw,240px);letter-spacing:-.05em;line-height:1.22;margin:-.16em 0;
  background:linear-gradient(180deg,#fff 16%,rgba(237,234,224,.55) 84%);-webkit-background-clip:text;background-clip:text;color:transparent}
#pricing .unit{font-weight:900;font-size:clamp(16px,2.4vw,26px);letter-spacing:.1em}
#pricing .pr-note{max-width:30em;color:var(--tx-dim);font-size:13px;padding-bottom:10px}
#pricing .pr-note b{display:block;color:var(--tx);font-size:15px;margin-bottom:10px;letter-spacing:.14em}
@media(max-width:760px){#pricing .pr-flex{grid-template-columns:1fr}}

/* pricing: 稟議用の具体化(人数別概算+投資回収の試算) */
.pr-sim{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(26px,4.5vw,64px);
  margin-top:clamp(34px,5.5vh,54px);padding-top:clamp(26px,4vh,38px);border-top:1px solid var(--line)}
.pr-sim .ps-t{display:block;font-size:11px;font-weight:700;letter-spacing:.2em;color:var(--blue);margin-bottom:14px}
.ps-tiers{list-style:none}
.ps-tiers li{display:grid;grid-template-columns:3.2em 1fr auto;gap:12px;align-items:baseline;
  padding:11px 0;border-bottom:1px dashed var(--line)}
.ps-tiers b{font-size:15px;font-weight:900}
.ps-tiers span{font-size:11.5px;color:var(--tx-dim)}
.ps-tiers i{font-style:normal;font-size:14px;font-weight:800;letter-spacing:.02em}
.ps-lead{font-size:12.5px;color:var(--tx-dim);line-height:2}
.ps-calc{list-style:none;margin-top:12px;display:grid;gap:8px}
.ps-calc li{display:flex;gap:12px;align-items:baseline;font-size:12.5px;color:var(--tx-dim)}
.ps-calc li::before{content:'';flex-shrink:0;width:9px;height:1.6px;background:var(--blue);transform:translateY(-3px)}
.ps-calc b{font-weight:900;color:var(--tx)}
.ps-sub{margin-top:12px;font-size:11.5px;color:var(--tx-dim);line-height:1.9}
.ps-note{grid-column:1/-1;font-size:10.5px;color:var(--tx-faint);line-height:1.9;margin-top:4px}
.light .pr-sim{border-color:var(--line-ink)}
.light .pr-sim .ps-t{color:#3B5EC9}
.light .ps-tiers li{border-color:var(--line-ink)}
.light .ps-tiers span,.light .ps-lead,.light .ps-calc li,.light .ps-sub{color:rgba(16,26,44,.62)}
.light .ps-calc li::before{background:#3B5EC9}
.light .ps-calc b{color:var(--ink)}
.light .ps-note{color:rgba(16,26,44,.42)}
@media(max-width:760px){.pr-sim{grid-template-columns:1fr}}

/* ---------- AI VILLAGE ---------- */
#village{background:
  radial-gradient(900px 500px at 88% 0%,rgba(110,151,255,.14),transparent 60%),
  linear-gradient(180deg,#0A1220 0%,#0D1B36 70%,#0A1220 100%);overflow:clip}
#village .v-head{display:grid;grid-template-columns:1fr auto;gap:26px;align-items:end}
#village .v-badge{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:999px;
  padding:8px 18px;font-family:var(--en);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-dim);margin-bottom:22px}
#village .v-badge b{color:var(--tx)}
/* AI VILLAGE 公式ロゴ: SVGをマスクに使い、サイトトークン色の単色シルエットで枠なし直置き */
#village .v-logo{display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
#village .v-logo:hover{transform:translateY(-3px)}
#village .v-logo:hover .v-mark{opacity:1}
#village .v-mark{display:block;width:clamp(220px,24vw,320px);aspect-ratio:2217/385;
  background:var(--tx);opacity:.9;
  -webkit-mask:url('../assets/ai-village-logo.svg') center/contain no-repeat;
  mask:url('../assets/ai-village-logo.svg') center/contain no-repeat;
  transition:opacity .5s}
@media(max-width:760px){
  #village .v-head{grid-template-columns:1fr}
  #village .v-logo{justify-self:start}
}
#village .skyline{margin:clamp(40px,7vh,70px) calc(clamp(22px,6vw,96px) * -1) 0;opacity:.5}
#village .skyline path{fill:none;stroke:rgba(237,234,224,.5);stroke-width:1.2}
#village .skyline .rp{stroke:var(--blue);stroke-width:2}
#village .skyline .sl-glow{fill:rgba(110,151,255,.6)}
.v-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px);margin-top:clamp(40px,7vh,70px)}
.v-spec{border:1px solid var(--line);border-radius:18px;padding:clamp(22px,3.4vh,34px);background:rgba(17,31,58,.5);backdrop-filter:blur(8px)}
.v-spec .vn{font-family:var(--en);font-weight:800;font-size:clamp(30px,4.4vw,50px);letter-spacing:-.03em;line-height:1}
.v-spec .vn small{font-size:.38em;font-weight:600;color:var(--tx-dim)}
.v-spec .vl{margin-top:10px;font-size:11.5px;color:var(--tx-dim);letter-spacing:.1em}
.v-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px);margin-top:clamp(46px,8vh,80px);perspective:1200px}
.v-plan{border:1px solid var(--line);border-radius:22px;padding:clamp(26px,3.8vh,40px);background:var(--panel);
  display:flex;flex-direction:column;transform-style:preserve-3d;transition:border-color .5s;will-change:transform}
.v-plan.mid{background:linear-gradient(160deg,#F1ECDF,#E4DCC8);color:var(--ink);border-color:transparent}
.v-plan:hover{border-color:rgba(237,234,224,.3)}
.v-plan .vp-k{font-family:var(--en);font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--blue)}
.v-plan.mid .vp-k{color:#3B5EC9}
.v-plan h3{font-size:18px;font-weight:900;margin-top:10px}
.v-plan .vp-p{font-family:var(--en);font-weight:800;font-size:clamp(30px,3.6vw,44px);letter-spacing:-.03em;margin:18px 0 2px}
.v-plan .vp-p small{font-size:.4em;font-weight:600}
.v-plan .vp-u{font-size:10.5px;letter-spacing:.16em;color:var(--tx-dim)}
.v-plan.mid .vp-u{color:rgba(16,26,44,.55)}
.v-plan ul{list-style:none;margin-top:20px}
.v-plan li{font-size:12px;padding:8px 0 8px 20px;position:relative;color:var(--tx-dim)}
.v-plan.mid li{color:rgba(16,26,44,.7)}
.v-plan li::before{content:'—';position:absolute;left:0;opacity:.5}
.v-foot{display:flex;gap:16px;flex-wrap:wrap;margin-top:clamp(40px,6vh,60px);align-items:center}
.v-foot .adr{font-size:11.5px;color:var(--tx-dim);line-height:2;margin-left:auto;text-align:right}
@media(max-width:860px){.v-specs,.v-plans{grid-template-columns:1fr}.v-foot .adr{margin-left:0;text-align:left}}

/* ---------- FAQ ---------- */
#faq .fq{border-bottom:1px solid var(--line-ink)}
#faq .fq:first-of-type{border-top:1px solid var(--line-ink)}
#faq summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:clamp(14px,3vw,30px);
  padding:clamp(22px,3.6vh,32px) 0;font-weight:900;font-size:clamp(15px,2vw,20px)}
#faq summary::-webkit-details-marker{display:none}
#faq summary .no{font-family:var(--en);font-weight:400;font-size:12px;color:rgba(16,26,44,.4);min-width:36px}
#faq summary .pm{margin-left:auto;width:34px;height:34px;border:1px solid rgba(16,26,44,.25);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-family:var(--en);font-weight:400;font-size:16px;
  transition:transform .5s var(--ease),background .4s,color .4s;flex-shrink:0}
#faq details[open] .pm{transform:rotate(45deg);background:var(--ink);color:var(--ivory);border-color:var(--ink)}
#faq .fa{padding:0 0 clamp(22px,3.6vh,32px) clamp(50px,7vw,66px);color:rgba(16,26,44,.7);font-size:13px;max-width:46em}

/* ---------- CONTACT ---------- */
#contact{min-height:92svh;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
#contact .c-mark{position:absolute;right:-6vw;bottom:-8vh;width:clamp(280px,34vw,520px);opacity:.05;pointer-events:none}
#contact .c-mark polygon{fill:var(--tx)}
#contact .big-mail{display:inline-flex;align-items:center;gap:18px;margin-top:clamp(30px,5vh,50px);
  font-family:var(--en);font-weight:700;font-size:clamp(24px,5.6vw,64px);letter-spacing:-.02em;width:fit-content;position:relative}
#contact .big-mail::after{content:'';position:absolute;left:0;bottom:-8px;height:2px;width:100%;background:var(--tx);
  transform:scaleX(.25);transform-origin:left;transition:transform .7s var(--ease);opacity:.6}
#contact .big-mail:hover::after{transform:scaleX(1);opacity:1}
#contact .big-mail .ar{font-weight:400;transition:transform .5s var(--ease)}
#contact .big-mail:hover .ar{transform:translate(8px,-4px)}
#contact .c-steps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,30px);margin-top:clamp(46px,7vh,70px);max-width:900px}
#contact .c-step{border:1px solid var(--line);border-radius:18px;padding:clamp(22px,3.6vh,34px);background:rgba(17,31,58,.4)}
#contact .c-step .cn{font-family:var(--en);font-size:10.5px;font-weight:700;letter-spacing:.22em;color:var(--blue);text-transform:uppercase}
#contact .c-step h3{font-size:16px;font-weight:900;margin-top:10px}
#contact .c-step p{font-size:12px;color:var(--tx-dim);margin-top:8px}
@media(max-width:680px){#contact .c-steps{grid-template-columns:1fr}}
/* contact: 左=説明+ステップ / 右=問い合わせフォーム */
#contact .c-g{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,5vw,70px);align-items:start;position:relative;z-index:2}
#contact .c-g .c-steps{grid-template-columns:1fr;margin-top:clamp(30px,4.6vh,44px);max-width:none}
#contact .c-g .big-mail{font-size:clamp(18px,2vw,26px);margin-top:clamp(26px,4vh,38px)}
@media(max-width:860px){#contact .c-g{grid-template-columns:1fr}}
.ld-done{font-size:13.5px;line-height:2.1;color:var(--tx-dim)}
.ld-done b{display:block;font-size:16px;font-weight:900;color:var(--tx);margin-bottom:8px}
.ld-done a{color:var(--tx);border-bottom:1px solid var(--tx-faint)}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:clamp(44px,7vh,70px) clamp(22px,6vw,96px) 28px;background:var(--bg)}
.f-g{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(26px,4vw,60px);max-width:1240px;margin:0 auto}
.f-brand svg{width:30px;margin-bottom:16px}
.f-brand svg polygon{fill:var(--tx)}
.f-brand b{font-family:var(--en);font-weight:600;font-size:16px;letter-spacing:.14em}
.f-brand p{font-size:11px;color:var(--tx-faint);margin-top:12px;line-height:2}
.f-c h4{font-family:var(--en);font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:14px}
.f-c a{display:block;font-size:12.5px;color:var(--tx-dim);padding:5px 0;transition:color .3s}
.f-c a:hover{color:var(--tx)}
.f-b{max-width:1240px;margin:clamp(36px,6vh,56px) auto 0;padding-top:20px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-family:var(--en);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-faint)}
@media(max-width:720px){.f-g{grid-template-columns:1fr;gap:30px}}


/* icons */
.ic{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ar{display:inline-flex;align-items:center}
.cmp .handle .hs{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:16px;
  fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;z-index:2}
#faq summary .pm{position:relative}
#faq summary .pm::before,#faq summary .pm::after{content:'';position:absolute;top:50%;left:50%;background:currentColor;transition:transform .5s var(--ease)}
#faq summary .pm::before{width:12px;height:1.5px;transform:translate(-50%,-50%)}
#faq summary .pm::after{width:1.5px;height:12px;transform:translate(-50%,-50%)}
#faq details[open] .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
/* illustrations */
.ill .s{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ill .b{fill:none;stroke:var(--blue);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ill .dsh{stroke-dasharray:2 6}
.ill .fA{fill:currentColor}
.light .ill .b{stroke:#3B5EC9}
/* promise layout with illustration */
#promise .pm-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(30px,5vw,70px);align-items:center}
#promise .pm-ill{max-width:420px;margin:0 auto;width:100%}
@media(max-width:860px){#promise .pm-grid{grid-template-columns:1fr}#promise .pm-ill{max-width:320px}}
/* program card illustrations */
.pcard .pc-ill{position:absolute;top:clamp(22px,3vh,34px);right:clamp(22px,3vh,34px);width:clamp(72px,8vw,104px);opacity:.9}
/* stay flag */
#stay .node .flag{width:20px;height:20px;margin-top:10px;opacity:0;transform:translateY(6px);transition:opacity .5s .25s,transform .5s .25s}
#stay .node.on .flag{opacity:1;transform:none}
/* village seats */
.v-seats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,20px);margin-top:clamp(40px,7vh,70px)}
.v-seat{border:1px solid var(--line);border-radius:18px;padding:clamp(20px,3vh,30px);background:rgba(17,31,58,.35);text-align:left;
  transition:border-color .4s,transform .5s var(--ease)}
.v-seat:hover{border-color:rgba(237,234,224,.3);transform:translateY(-4px)}
.v-seat svg{width:52px;margin-bottom:16px}
.v-seat h4{font-size:13.5px;font-weight:700}
.v-seat p{font-size:11px;color:var(--tx-dim);margin-top:6px;line-height:1.9}
@media(max-width:860px){.v-seats{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.v-seats{grid-template-columns:1fr}}
/* contact illustration */
#contact .c-ill{width:clamp(120px,14vw,180px);margin-bottom:clamp(20px,3vh,30px)}

/* ====================================================== */
/* ===== v2 — bespoke scene illustrations & editorial details ===== */

/* faint supporting lines inside illustrations */
.ill .fn{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.35}

/* soft accent fill / soft body fill / glow — richness layers under the line art */
.ill .fS{fill:var(--blue);stroke:none}
.ill .fW{fill:currentColor;stroke:none}
.ill .gl{fill:var(--blue);stroke:none;filter:blur(7px)}
.light .ill .fS,.light .ill .gl{fill:#3B5EC9}
.cmp .before-l .ill .fS,.cmp .before-l .ill .gl{fill:#3B5EC9}

/* dashed / filled parts fade in after the strokes draw */
svg.draw .dsh,svg.draw .fA{opacity:0;transition:opacity .9s var(--ease) .55s}
svg.draw .fS,svg.draw .fW,svg.draw .gl{opacity:0;transition:opacity 1.2s var(--ease) .7s}
svg.draw.go .dsh{opacity:1}
svg.draw.go .fA{opacity:1}
svg.draw.go .fS{opacity:.14}
svg.draw.go .fW{opacity:.07}
svg.draw.go .gl{opacity:.32}

/* editorial figure captions */
.fig{margin-top:14px;font-family:var(--en);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--tx-faint);display:flex;gap:10px;align-items:center}
.fig::before{content:'';width:18px;height:1px;background:currentColor;opacity:.6;flex-shrink:0}
.light .fig{color:rgba(16,26,44,.45)}

/* japanese display type — proportional kerning */
.jp-big,.qt,#promise .pm-line,#stay .verdict,#top .h1-jp{font-feature-settings:"palt"}

/* problem — scene illustration beside each quote */
#problem .pq-g{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4.5vw,80px);align-items:center}
#problem .q-ill{width:100%;max-width:400px;justify-self:end}
@media(max-width:899px){#problem .q-ill{display:none}#problem .pq-g{grid-template-columns:1fr}}

/* hand-drawn red circle around 「あと」 */
.scrib{position:relative;display:inline-block}
.scrib svg{position:absolute;top:-34%;left:-10%;width:120%;height:168%;pointer-events:none;overflow:visible}
.scrib svg path{fill:none;stroke:#C8503A;stroke-width:2.6;stroke-linecap:round}

/* before/after — spot illustrations */
.cmp .side .sp{width:clamp(160px,22vw,220px);margin-top:20px;opacity:.92}
.cmp .before-l .ill .b{stroke:#3B5EC9}
@media(max-height:700px){.cmp .side .sp{display:none}}

/* promise illustration wrapper */
.pm-illwrap{max-width:420px;margin:0 auto;width:100%}
.pm-illwrap .pm-ill{max-width:none;margin:0}

/* stay — verdict + walking scene */
#stay .verdict-g{display:grid;grid-template-columns:1fr auto;align-items:center;gap:clamp(24px,5vw,70px);margin-top:clamp(50px,8vh,80px)}
#stay .verdict{margin-top:0}
#stay .walk{width:clamp(190px,24vw,290px)}
@media(max-width:760px){#stay .verdict-g{grid-template-columns:1fr}#stay .walk{justify-self:start}}

/* pricing — scale illustration */
.pr-illwrap{justify-self:end;align-self:center}
.pr-ill{width:clamp(150px,15vw,215px);opacity:.92}
@media(max-width:980px){.pr-illwrap{display:none}}
@media(max-width:760px){#pricing .pr-flex{grid-template-columns:1fr}}

/* village — floor scene panel */
.v-floor{margin-top:clamp(40px,7vh,70px);border:1px solid var(--line);border-radius:22px;
  padding:clamp(18px,2.6vw,34px) clamp(16px,3vw,40px) 0;background:rgba(17,31,58,.35);overflow:hidden}
.v-floor .fig{margin:0 0 14px}
.v-floor svg{width:100%}

/* village — shibuya train crossing the skyline */
#village .skyline .tr rect,#village .skyline .tr path{fill:none;stroke:rgba(110,151,255,.55);stroke-width:1.4}
#village .skyline .tr{animation:train 17s linear infinite}
@keyframes train{from{transform:translateX(-140px)}to{transform:translateX(1340px)}}
#village .skyline .sl-glow{animation:glow 4.5s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:1}50%{opacity:.5}}

/* faq — speech bubbles */
.faq-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px}
.faq-ill{width:clamp(120px,13vw,168px)}
/* モバイルでも吹き出しイラストは消さず、見出しの下に小さく添える */
@media(max-width:680px){.faq-head{grid-template-columns:1fr}.faq-ill{width:136px;justify-self:end;margin-top:-6px}}

/* company table */
.co-tbl{margin-top:clamp(30px,5vh,50px);border-top:1px solid var(--line)}
.co-tbl>div{display:grid;grid-template-columns:clamp(100px,15vw,170px) 1fr;gap:20px;
  padding:18px 4px;border-bottom:1px solid var(--line)}
.co-tbl dt{font-size:11.5px;font-weight:700;letter-spacing:.2em;color:var(--tx-dim);padding-top:2px}
.co-tbl dd{font-size:13px;line-height:2}
.co-mail{border-bottom:1px solid var(--tx-faint);transition:border-color .3s,color .3s}
.co-mail:hover{color:#fff;border-color:var(--tx)}

/* ============ legal page (privacy.html) ============ */
body.legal{background:var(--bg)}
.lg-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(20px,4vw,48px);background:rgba(10,18,32,.82);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.lg-nav .n-brand{display:flex;align-items:center;gap:10px;cursor:pointer}
.lg-nav .n-brand svg{width:17px}
.lg-nav .n-brand b{font-family:var(--en);font-weight:700;letter-spacing:.14em;font-size:14px}
.lg-back{display:flex;align-items:center;gap:8px;font-family:var(--en);font-size:11px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--tx-dim);transition:color .3s}
.lg-back:hover{color:var(--tx)}
.lg-back .ic{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lg-main{max-width:840px;margin:0 auto;padding:clamp(60px,10vh,110px) clamp(20px,4vw,48px) clamp(60px,9vh,100px)}
.lg-head .jp-big{margin-top:18px}
.lg-pre{margin-top:clamp(26px,4vh,40px);font-size:13.5px;line-height:2.2;color:var(--tx-dim)}
.lg-art{margin-top:clamp(44px,7vh,64px);padding-top:clamp(30px,4vh,40px);border-top:1px solid var(--line)}
.lg-art h2{display:flex;align-items:baseline;gap:16px;font-size:clamp(16px,2vw,19px);font-weight:900;letter-spacing:.02em}
.lg-art h2 .en{font-family:var(--en);font-weight:400;font-size:.85em;color:var(--blue);letter-spacing:.08em}
.lg-art p{margin-top:16px;font-size:13.5px;line-height:2.2;color:var(--tx-dim)}
.lg-art ul{margin-top:16px;display:grid;gap:10px;list-style:none}
.lg-art li{position:relative;padding-left:20px;font-size:13.5px;line-height:2;color:var(--tx-dim)}
.lg-art li::before{content:'';position:absolute;left:2px;top:13px;width:8px;height:1.5px;background:var(--blue)}
.lg-art li b{color:var(--tx);font-weight:700}
.lg-panel{margin-top:20px;border:1px solid var(--line);border-radius:16px;padding:24px 26px;background:var(--panel)}
.lg-panel b{font-size:13.5px}
.lg-panel p{margin-top:10px}
.lg-date{margin-top:clamp(50px,8vh,70px);padding-top:26px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:10px 30px;font-size:12.5px;color:var(--tx-dim)}
.lg-foot{border-top:1px solid var(--line);padding:0 clamp(20px,4vw,48px)}
.lg-foot .f-b a{color:var(--tx-dim);transition:color .3s}
.lg-foot .f-b a:hover{color:var(--tx)}

/* ============ ad landing page (lp.html) ============ */
/* LPは明色テーマ: トークンをbody.lpスコープで反転(色は必ずトークン経由) */
body.lp{
  --bg:#FBFAF6;--bg-2:#F3EFE3;--panel:#FFFFFF;
  --tx:#101A2C;--tx-dim:rgba(16,26,44,.6);--tx-faint:rgba(16,26,44,.36);
  --line:rgba(16,26,44,.12);--blue:#3B5EC9;
  background:var(--bg);color:var(--tx)}
.lp-nav{position:sticky;top:0;z-index:90;display:flex;align-items:center;justify-content:space-between;
  padding:13px clamp(18px,4vw,48px);background:rgba(10,18,32,.84);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.lp-nav .n-brand svg{width:17px}
.lp-nav .n-brand b{font-family:var(--en);font-weight:700;letter-spacing:.14em;font-size:14px}
.lp-nav .n-tag{font-size:10px;letter-spacing:.14em;color:var(--tx-faint);margin-left:14px;padding-left:14px;border-left:1px solid var(--line)}
.lp-nav .n-cta{font-size:11px;letter-spacing:.1em}
@media(max-width:640px){.lp-nav .n-tag{display:none}}

.lp-center .kick{justify-content:center}
.lp-center .kick::after{content:'';width:26px;height:1px;background:var(--blue)}
.light .lp-center .kick::after{background:#3B5EC9}
.lp-sec-head{max-width:800px}
.lp-center .lp-sec-head{margin:0 auto;text-align:center}
.lp-center .sub{margin-left:auto;margin-right:auto}

/* hero */
.lp-hero{position:relative;overflow:hidden;text-align:center;
  padding:clamp(76px,13vh,140px) clamp(22px,6vw,96px) clamp(64px,10vh,110px);
  background:
    radial-gradient(1000px 520px at 50% -12%,rgba(110,151,255,.14),transparent 62%),
    radial-gradient(700px 420px at 88% 108%,rgba(110,151,255,.07),transparent 60%),
    var(--bg)}
.lp-h1{font-weight:900;font-size:clamp(29px,5.4vw,56px);line-height:1.55;letter-spacing:.03em;font-feature-settings:"palt"}
.lp-h1 em{font-style:normal;color:var(--blue)}
.lp-proof{display:flex;justify-content:center;gap:clamp(10px,1.8vw,16px);flex-wrap:wrap;margin-top:clamp(30px,5vh,46px)}
.lp-proof .pf{min-width:168px;padding:16px 24px 14px;border:1px solid var(--line);border-radius:16px;
  background:rgba(17,31,58,.5);text-align:center}
.pf b{display:block;font-family:var(--en);font-weight:800;font-size:clamp(24px,3vw,32px);letter-spacing:-.02em;line-height:1.15}
.pf b small{font-size:.42em;font-weight:600;letter-spacing:.04em;color:var(--tx-dim);margin-left:3px}
.pf span{display:block;margin-top:5px;font-size:10.5px;letter-spacing:.14em;color:var(--tx-dim)}
.lp-cta{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin-top:clamp(30px,5vh,46px)}
.lp-note{margin-top:18px;font-size:11px;letter-spacing:.12em;color:var(--tx-faint)}

/* worry (light) */
.wr-list{display:grid;gap:12px;max-width:800px;margin:clamp(30px,5vh,46px) auto 0}
.wr{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--line-ink);border-radius:16px;
  padding:18px 22px;background:rgba(255,255,255,.55)}
.wr .ck{flex-shrink:0;width:22px;height:22px;margin-top:6px}
.wr .ck circle{fill:none;stroke:#3B5EC9;stroke-width:1.6}
.wr .ck path{fill:none;stroke:#3B5EC9;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.wr b{display:block;font-size:14px;font-weight:900;letter-spacing:.03em}
.wr p{font-size:11.5px;color:rgba(16,26,44,.6);margin-top:2px}
.wr-core{margin-top:clamp(40px,7vh,60px);text-align:center}
.wr-core .jp-big{font-size:clamp(20px,3.2vw,36px)}

/* before / after (dark) */
.ba-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2.4vw,24px);margin-top:clamp(34px,6vh,52px)}
.ba{border:1px solid var(--line);border-radius:20px;padding:clamp(24px,4vh,38px);background:var(--panel)}
.ba.af{background:linear-gradient(150deg,#1B2F58,#14243F);border-color:rgba(110,151,255,.35)}
.ba .tag{font-family:var(--en);font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tx-dim)}
.ba.af .tag{color:var(--blue)}
.ba h3{margin-top:12px;font-size:clamp(16px,2vw,20px);font-weight:900}
.ba ul{list-style:none;margin-top:20px}
.ba li{display:grid;grid-template-columns:70px 1fr;gap:14px;align-items:baseline;
  padding:13px 0;border-top:1px solid var(--line);font-size:12.5px;color:var(--tx-dim)}
.ba li .t{font-size:10.5px;font-weight:700;letter-spacing:.16em;color:var(--tx-faint)}
.ba.af li{color:var(--tx)}
@media(max-width:760px){.ba-g{grid-template-columns:1fr}}

/* features (light) */
.ft-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.4vw,24px);margin-top:clamp(34px,6vh,52px)}
.ft{border:1px solid var(--line-ink);border-radius:20px;padding:clamp(24px,4vh,36px);background:rgba(255,255,255,.55)}
.ft .no{font-family:var(--en);font-weight:300;font-size:clamp(38px,4.4vw,54px);line-height:1;color:rgba(16,26,44,.22)}
.ft svg{width:clamp(60px,6vw,76px);margin:20px 0 18px}
.ft h3{font-size:16px;font-weight:900;letter-spacing:.03em}
.ft p{font-size:12px;color:rgba(16,26,44,.65);margin-top:10px}
@media(max-width:860px){.ft-g{grid-template-columns:1fr}}

/* program steps (dark) */
.st-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:clamp(34px,6vh,52px)}
.st{background:var(--bg-2);padding:clamp(22px,3.6vh,32px)}
.st svg{width:clamp(58px,5.6vw,78px)}
.st .no{font-family:var(--en);font-weight:300;font-size:clamp(30px,3.4vw,42px);line-height:1;color:var(--tx-faint);margin-top:16px}
.st h3{font-size:14.5px;font-weight:900;margin-top:10px;letter-spacing:.03em}
.st p{font-size:11.5px;color:var(--tx-dim);margin-top:8px}
@media(max-width:980px){.st-g{grid-template-columns:1fr 1fr}}
@media(max-width:580px){.st-g{grid-template-columns:1fr}}

/* price (light) */
.prc{display:grid;grid-template-columns:auto 1fr;gap:clamp(28px,6vw,80px);align-items:center;margin-top:clamp(34px,6vh,52px)}
.prc .num{font-family:var(--en);font-weight:800;font-size:clamp(72px,11vw,140px);letter-spacing:-.04em;line-height:1;
  /* カウント中(0→40)も桁数で幅が揺れないように */
  display:inline-block;min-width:2ch;font-variant-numeric:tabular-nums}
.prc .unit{font-family:var(--jp);font-weight:900;font-size:clamp(15px,1.8vw,20px);letter-spacing:.06em;margin-left:8px}
.prc-inc{border-left:1px solid var(--line-ink);padding-left:clamp(24px,4vw,54px)}
.prc-inc b{font-size:12px;font-weight:700;letter-spacing:.2em;color:rgba(16,26,44,.55)}
.prc-inc ul{list-style:none;margin-top:14px;display:grid;gap:9px}
.prc-inc li{display:flex;gap:12px;align-items:baseline;font-size:13px}
.prc-inc li::before{content:'';flex-shrink:0;width:9px;height:1.6px;background:#3B5EC9;transform:translateY(-3px)}
@media(max-width:760px){.prc{grid-template-columns:1fr}.prc-inc{border-left:none;padding-left:0;border-top:1px solid var(--line-ink);padding-top:26px}}

/* flow (dark) */
.fl-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.4vw,24px);margin-top:clamp(34px,6vh,52px)}
.fl{position:relative;border:1px solid var(--line);border-radius:18px;padding:clamp(22px,3.6vh,32px);background:rgba(17,31,58,.4)}
.fl .cn{font-family:var(--en);font-size:10.5px;font-weight:700;letter-spacing:.22em;color:var(--blue);text-transform:uppercase}
.fl h3{font-size:15.5px;font-weight:900;margin-top:10px}
.fl p{font-size:11.5px;color:var(--tx-dim);margin-top:8px}
.fl .fl-ar{position:absolute;top:50%;right:-19px;transform:translateY(-50%);z-index:2;width:14px;height:14px;
  stroke:var(--tx-faint);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.fl-g{grid-template-columns:1fr}.fl .fl-ar{display:none}}

/* lead form (dark) */
.ld-g{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,70px);margin-top:clamp(34px,6vh,52px);align-items:start}
.ld-pts{list-style:none;margin-top:clamp(22px,3.6vh,32px);display:grid;gap:10px}
.ld-pts li{display:flex;gap:12px;align-items:baseline;font-size:13px;color:var(--tx-dim)}
.ld-pts li::before{content:'';flex-shrink:0;width:9px;height:1.6px;background:var(--blue);transform:translateY(-3px)}
.ld-alt{margin-top:clamp(26px,4vh,38px);font-size:12px;color:var(--tx-dim)}
.ld-alt a{color:var(--tx);border-bottom:1px solid var(--tx-faint);transition:border-color .3s}
.ld-alt a:hover{border-color:var(--tx)}
.ld-form{border:1px solid var(--line);border-radius:22px;padding:clamp(24px,4vh,40px);background:var(--panel)}
/* honeypot: 人間には見えない bot 対策フィールド */
.ld-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.ld-form label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;margin:18px 0 8px}
.ld-form label:first-child{margin-top:0}
.ld-form .req{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.1em;color:#E2836E;
  border:1px solid rgba(226,131,110,.5);border-radius:4px;padding:1px 7px;margin-left:8px;vertical-align:1px}
.ld-form input[type=text],.ld-form input[type=email],.ld-form input[type=tel],.ld-form textarea{
  width:100%;background:rgba(10,18,32,.6);border:1px solid var(--line);border-radius:12px;
  padding:13px 16px;color:var(--tx);font:inherit;font-size:13px;line-height:1.7;transition:border-color .3s}
.ld-form input:focus,.ld-form textarea:focus{outline:none;border-color:var(--blue)}
.ld-form ::placeholder{color:var(--tx-faint)}
.ld-form textarea{min-height:96px;resize:vertical}
.ld-consent{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-size:11.5px;line-height:1.9;color:var(--tx-dim)}
.ld-consent input{width:15px;height:15px;margin-top:5px;accent-color:var(--blue);flex-shrink:0}
.ld-consent a{color:var(--tx);border-bottom:1px solid var(--tx-faint)}
.ld-err{display:none;margin-top:14px;font-size:11.5px;color:#E2836E;line-height:1.9}
.ld-err.on{display:block}
.ld-form .btn-p{width:100%;justify-content:center;margin-top:22px}
.ld-hint{margin-top:12px;font-size:10.5px;letter-spacing:.08em;color:var(--tx-faint);text-align:center}
@media(max-width:860px){.ld-g{grid-template-columns:1fr}}

/* sticky bottom cta bar */
#lp-bar{position:fixed;left:0;right:0;bottom:0;z-index:95;display:flex;align-items:center;justify-content:center;gap:20px;
  padding:12px clamp(16px,4vw,32px);background:rgba(10,18,32,.88);backdrop-filter:blur(16px);
  border-top:1px solid var(--line);transform:translateY(110%);transition:transform .6s var(--ease)}
#lp-bar.show{transform:none}
#lp-bar .t{font-size:11.5px;letter-spacing:.1em;color:var(--tx-dim)}
#lp-bar .btn-p{padding:11px 28px;font-size:12px}
@media(max-width:560px){#lp-bar .t{display:none}#lp-bar .btn-p{width:100%;justify-content:center}}

/* lp footer */
.lp-foot{border-top:1px solid var(--line);padding:clamp(30px,5vh,44px) clamp(20px,4vw,48px) 24px}
.lp-foot .row{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.lp-foot .n-brand svg{width:16px}
.lp-foot .n-brand b{font-family:var(--en);font-weight:700;letter-spacing:.14em;font-size:13px}
.lp-foot .lks{display:flex;gap:24px;font-size:11px;color:var(--tx-dim)}
.lp-foot .lks a{transition:color .3s}
.lp-foot .lks a:hover{color:var(--tx)}
.lp-foot .f-b{margin-top:22px}

/* ---- lp bright theme overrides (ハードコード色の面だけ個別反転) ---- */
body.lp ::selection{background:var(--ink);color:var(--ivory)}
body.lp .lp-nav{background:rgba(251,250,246,.86)}
body.lp .n-cta{background:var(--ink);color:var(--ivory)!important}
body.lp .n-cta:hover{background:#1F2F55}
body.lp .btn-p{background:var(--ink);color:var(--ivory)}
body.lp .btn-p:hover{box-shadow:0 20px 50px -18px rgba(16,26,44,.4)}
body.lp .ba{box-shadow:0 14px 44px -26px rgba(16,26,44,.2)}
body.lp .ba.af{background:linear-gradient(150deg,#17284E,#0E1930);border-color:rgba(59,94,201,.4);color:#EDEAE0}
body.lp .ba.af .tag{color:#6E97FF}
body.lp .ba.af li{color:#EDEAE0;border-top-color:rgba(237,234,224,.14)}
body.lp .ba.af li .t{color:rgba(237,234,224,.45)}
body.lp .fl{background:#fff;box-shadow:0 14px 44px -26px rgba(16,26,44,.18)}
body.lp .ld-form{box-shadow:0 24px 70px -32px rgba(16,26,44,.28)}
body.lp .ld-form input[type=text],body.lp .ld-form input[type=email],body.lp .ld-form input[type=tel],body.lp .ld-form textarea{background:rgba(16,26,44,.035)}
body.lp #lp-bar{background:rgba(251,250,246,.92)}

/* ---- lp hero: 2カラム アイキャッチ ---- */
body.lp .lp-hero{padding:clamp(64px,9vh,110px) clamp(22px,6vw,96px) clamp(70px,11vh,120px);
  background:
    radial-gradient(820px 480px at 14% -12%,rgba(59,94,201,.14),transparent 62%),
    radial-gradient(700px 520px at 94% 12%,rgba(110,151,255,.22),transparent 64%),
    radial-gradient(560px 380px at 78% 96%,rgba(59,94,201,.08),transparent 60%),
    var(--bg)}
.lp-aur{position:absolute;inset:-22%;pointer-events:none;filter:blur(54px);
  background:conic-gradient(from 210deg at 62% 38%,transparent 0deg,rgba(59,94,201,.10) 70deg,transparent 150deg,rgba(110,151,255,.13) 240deg,transparent 330deg);
  animation:aur 64s linear infinite}
.lp-hero-g{position:relative;z-index:2;max-width:1240px;margin:0 auto;display:grid;
  grid-template-columns:1.02fr .98fr;gap:clamp(34px,5.5vw,80px);align-items:center;text-align:left}
.lp-hero-g .lp-h1{font-size:clamp(28px,3.9vw,46px);line-height:1.5}
.lp-hero-tx .kick{justify-content:flex-start}
.lp-hero-tx .sub{margin-left:0}
.lp-hero-tx .lp-cta{justify-content:flex-start}
.lp-hero-vis{position:relative}
.lp-hero-vis>svg{width:100%;height:auto}
.lp-hero-vis .pf{position:absolute;min-width:0;padding:12px 20px 10px;border-radius:14px;
  background:rgba(255,255,255,.8);backdrop-filter:blur(10px);border:1px solid rgba(16,26,44,.1);
  box-shadow:0 16px 44px -20px rgba(16,26,44,.3);text-align:left}
.lp-hero-vis .pf b{font-size:22px}
.lp-hero-vis .pf span{margin-top:2px;font-size:9.5px}
.pf-1{top:4%;left:-3%;animation:pff 7s ease-in-out infinite alternate}
.pf-2{top:8%;right:-5%;animation:pff 8s ease-in-out -2s infinite alternate}
.pf-3{bottom:2%;left:8%;animation:pff 6.5s ease-in-out -4s infinite alternate}
@keyframes pff{from{transform:translateY(4px)}to{transform:translateY(-8px)}}
@media(max-width:900px){
  .lp-hero-g{grid-template-columns:1fr;text-align:center;gap:44px}
  .lp-hero-tx .kick,.lp-hero-tx .lp-cta{justify-content:center}
  .lp-hero-tx .sub{margin-left:auto;margin-right:auto}
  .lp-hero-vis{max-width:520px;margin:0 auto;width:100%}
}

/* ---------- mobile typography (≤560px): 下限サイズの底上げと字間の最適化 ---------- */
@media(max-width:560px){
  .kick{font-size:10px;letter-spacing:.2em;gap:11px}
  .kick::before{width:20px}
  .lp-hero-tx .kick{font-size:9.5px;letter-spacing:.15em}
  #top .word{font-size:15px;letter-spacing:.34em;text-indent:.34em}
  #top .h1-en{font-size:clamp(37px,10.5vw,42px)}
  #top .h1-jp{font-size:14px;letter-spacing:.26em;text-indent:.26em}
  .h-xl{font-size:clamp(36px,9.6vw,42px)}
  .h-lg{font-size:clamp(30px,8vw,34px)}
  .jp-big{font-size:clamp(23px,6.2vw,26px);line-height:1.75}
  .sub{font-size:13.5px;line-height:2.05}
  .stat .sn{font-size:clamp(40px,11.2vw,46px)}
  .prc .num{font-size:clamp(88px,23vw,120px)}
  .lp-h1{font-size:clamp(30px,7.8vw,36px)}
  .lp-hero-g .lp-h1{font-size:clamp(29px,7.6vw,34px)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .r{opacity:1;transform:none}.rl>span{transform:none}
  #logo-hero polygon{opacity:1;transform:none}
  #top .word span{opacity:1;filter:none;transform:none}
  body::after{animation:none}
  html{scroll-behavior:auto}
}
