/* VELLIX motion v3 — 暗い画面・3D・スクロール連動 */
html,body{overflow-x:clip}
.bg-orbs{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.bg-orbs i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.45;will-change:transform}
.bg-orbs i:nth-child(1){width:46vmax;height:46vmax;left:-12vmax;top:-10vmax;background:radial-gradient(circle,rgba(99,102,241,.5),transparent 65%);animation:orb1 22s ease-in-out infinite alternate}
.bg-orbs i:nth-child(2){width:40vmax;height:40vmax;right:-12vmax;top:28vh;background:radial-gradient(circle,rgba(168,85,247,.38),transparent 65%);animation:orb2 26s ease-in-out infinite alternate}
.bg-orbs i:nth-child(3){width:34vmax;height:34vmax;left:24vw;bottom:-16vmax;background:radial-gradient(circle,rgba(56,189,248,.22),transparent 65%);animation:orb3 24s ease-in-out infinite alternate}
@keyframes orb1{to{transform:translate(14vmax,10vmax) scale(1.15)}}
@keyframes orb2{to{transform:translate(-12vmax,-8vmax) scale(1.1)}}
@keyframes orb3{to{transform:translate(10vmax,-12vmax) scale(1.2)}}

.float-cta{position:fixed;right:20px;bottom:20px;z-index:900;display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border-radius:999px;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;font:700 14px 'Noto Sans JP',sans-serif;text-decoration:none;box-shadow:0 10px 34px rgba(99,102,241,.5);opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .35s,transform .35s}
.float-cta.show{opacity:1;transform:none;pointer-events:auto}
.float-cta::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(129,140,248,.6);animation:pulse 2.6s ease-out infinite}
@keyframes pulse{70%{box-shadow:0 0 0 16px rgba(129,140,248,0)}100%{box-shadow:0 0 0 0 rgba(129,140,248,0)}}
.shimmer{background-image:linear-gradient(90deg,#818cf8,#c084fc,#f0abfc,#818cf8)!important;background-size:300% auto;animation:shim 7s linear infinite}
@keyframes shim{to{background-position:300% center}}

/* 英字の見出し（細い明朝） */
.section-label{background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
.section-label-dot{display:none!important}
.section-label span,.eyebrow{font-family:'Cormorant Garamond','Noto Serif JP',serif!important;font-weight:500!important;font-size:clamp(28px,6vw,46px)!important;letter-spacing:.02em!important;text-transform:capitalize!important;color:rgba(255,255,255,.5)!important;line-height:1.2}
.eyebrow{margin-bottom:6px!important}

/* ガラス風の枠 */
.js-scrub .feature-card,.js-scrub .plan-card,.js-scrub .card,.js-scrub .step,.js-scrub .term,.js-scrub .service-card,.js-scrub .testimonial-card{border:1px solid rgba(255,255,255,.28)!important;background:rgba(6,8,16,.72)!important}
.js-scrub [data-sc]{will-change:transform,opacity}

/* 巨大な背景文字 */
[data-word]{position:relative;overflow:hidden}
.gword{position:absolute;left:50%;bottom:-.12em;transform:translateX(-50%);font-family:'Cormorant Garamond',serif;font-weight:600;font-size:min(30vw,380px);line-height:1;letter-spacing:.02em;color:rgba(255,255,255,.055);white-space:nowrap;pointer-events:none;user-select:none;z-index:0}
[data-word]>*:not(.gword){position:relative;z-index:1}
[data-word]>.hero-bg-grid,[data-word]>.hero-orb{position:absolute}

/* ヒーロー入場 */
@keyframes inUp{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes stripIn{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}

/* ガラスの帯（右から流れ込み、スクロールで動く） */
.strip-wrap{margin-top:46px}
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:100%}
.strip .gl{min-width:0;padding:16px 20px;border:1px solid rgba(255,255,255,.38);border-radius:16px;background:rgba(255,255,255,.06);backdrop-filter:blur(10px);box-shadow:inset 0 0 24px rgba(255,255,255,.05),0 18px 40px rgba(0,0,0,.4)}
.strip .gl b{display:block;font-size:20px;color:#fff;font-weight:800;line-height:1.3}.strip .gl span{font-size:12px;color:#aab4c8}

/* 数字 */
.stats{padding:84px 0}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1040px;margin:0 auto;padding:0 24px}
.stat{text-align:center;padding:30px 10px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:rgba(6,8,16,.72)}
.stat .n{font-family:'Cormorant Garamond',serif;font-size:clamp(44px,7vw,72px);font-weight:600;color:#fff;line-height:1}
.stat .n small{font-family:'Noto Sans JP',sans-serif;font-size:14px;color:#a5b4fc;margin-left:4px;font-weight:700}
.stat .l{margin-top:10px;font-size:12.5px;color:#94a3b8;line-height:1.7;padding:0 6px}
@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== サンプル画面とスライダー ===== */
.lid{position:relative;background:#14161f;border:solid #23262f;border-width:2.2% 2.2% 3.4% 2.2%;border-radius:10px;overflow:hidden}
.scr{position:absolute;inset:0;container-type:inline-size;overflow:hidden;font-family:'Noto Sans JP',sans-serif;pointer-events:none}
.scr .m{width:100%;height:100%;display:flex;flex-direction:column}
.m .nv{display:flex;align-items:center;gap:3cqw;padding:2.4cqw 4cqw}
.m .nv b{width:3.4cqw;height:3.4cqw;border-radius:50%;background:var(--ac)}
.m .nv span{font-size:2.6cqw;font-weight:900;letter-spacing:.3cqw}
.m .nv i{margin-left:auto;display:flex;gap:2.6cqw}.m .nv i u{display:block;width:6cqw;height:1.2cqw;border-radius:1cqw;background:currentColor;opacity:.35}
.m .hr{flex:1;display:flex;gap:3cqw;padding:2cqw 4cqw;align-items:center;min-height:0}
.m .tx{flex:1.1}.m .tx h4{font-size:5cqw;line-height:1.25;font-weight:900;margin-bottom:1.6cqw}
.m .tx p{height:1.2cqw;border-radius:1cqw;background:currentColor;opacity:.25;margin-bottom:1cqw;width:90%}.m .tx p+p{width:70%}
.m .tx em{display:inline-block;margin-top:1.6cqw;font-style:normal;font-size:2.2cqw;font-weight:700;color:#fff;background:var(--ac);padding:1cqw 3cqw;border-radius:2cqw}
.m .im{flex:1;height:100%;max-height:30cqw;border-radius:2.4cqw;position:relative;overflow:hidden}
.m .im::before{content:"";position:absolute;width:55%;aspect-ratio:1;border-radius:50%;right:-10%;top:-12%;background:rgba(255,255,255,.28)}
.m .im::after{content:"";position:absolute;width:40%;aspect-ratio:1;border-radius:50%;left:8%;bottom:-14%;background:rgba(255,255,255,.18)}
.m .cd{display:flex;gap:2cqw;padding:1.6cqw 4cqw 3cqw}.m .cd u{flex:1;height:8cqw;border-radius:1.6cqw;background:currentColor;opacity:.12}
.m .smp{position:absolute;right:2cqw;bottom:1.4cqw;font-size:1.8cqw;opacity:.5}
.sl{position:relative;max-width:900px;margin:0 auto}
.sl-view{overflow:hidden;border-radius:22px}
.sl-track{display:flex;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.sl-p{flex:0 0 100%;padding:10px 4% 6px;text-align:center}
.sl-dev{position:relative;max-width:640px;margin:0 auto;aspect-ratio:16/10.6;text-align:left}
.sl-dev .lapx{position:absolute;left:0;bottom:0;width:78%;filter:drop-shadow(0 22px 34px rgba(0,0,0,.5))}
.sl-dev .phox{position:absolute;right:2%;bottom:0;width:21%;filter:drop-shadow(0 22px 34px rgba(0,0,0,.5))}
.lapx .lid{aspect-ratio:16/10}.phox .lid{aspect-ratio:9/19;border-radius:16px;border-width:3.5%}
.lapx .base{height:12px;margin:0 -4%;background:linear-gradient(#c9ccd6,#8d91a0);border-radius:0 0 14px 14px}
.sl-cap{margin-top:14px;font-weight:700;font-size:16px;color:#fff}.sl-cap small{display:block;font-weight:400;font-size:12px;color:#64748b;margin-top:2px}
.sl-btn{position:absolute;top:44%;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(15,19,35,.8);color:#fff;font-size:18px;cursor:pointer;z-index:2;transition:.2s}
.sl-btn:hover{background:#6366f1}.sl-btn.pv{left:-6px}.sl-btn.nx{right:-6px}
.sl-dots{display:flex;gap:8px;justify-content:center;margin-top:12px}.sl-dots button{width:8px;height:8px;border-radius:50%;border:0;background:rgba(255,255,255,.25);cursor:pointer;padding:0;transition:.3s}.sl-dots button.on{width:26px;border-radius:6px;background:#818cf8}
.phox .scr .m .hr{flex-direction:column;align-items:stretch;padding-top:6cqw}.phox .scr .m .im{order:-1;flex:none;height:44cqw;max-height:none}
.phox .scr .m .tx h4{font-size:8.5cqw}.phox .scr .m .nv span{font-size:5cqw}.phox .scr .m .tx em{font-size:4.6cqw;padding:2cqw 5cqw}.phox .scr .m .cd{display:none}.phox .scr .m .tx p{height:2cqw}
@media(max-width:640px){.float-cta{right:12px;left:12px;bottom:12px;justify-content:center}.sl-btn{width:38px;height:38px}.strip{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.bg-orbs i,.float-cta::after,.shimmer{animation:none}.sl-track{transition:none}.js-scrub [data-sc]{will-change:auto}}

@media(max-width:1000px){.strip{grid-template-columns:repeat(2,1fr)}}

/* 日本語の改行を整える */
html{word-break:auto-phrase;line-break:strict;overflow-wrap:break-word}
h1,h2,h3,.lead,.sub,.bridge,.section-title,.section-sub,.eyebrow,.gl b,.gl span{text-wrap:balance}
p,li,.faq-a,.l{text-wrap:pretty}
.nw{white-space:nowrap}
.section-title{word-break:keep-all}
.strip .gl b{white-space:nowrap;font-size:clamp(15px,4.4vw,20px)}
.strip .gl span{display:block;line-height:1.5;margin-top:4px}
@media(max-width:640px){.strip .gl{padding:14px 12px;text-align:center}}

/* 常に動く相談ボタン */
.btn-primary,.btn-p,.header-cta,.hcta,.float-cta{position:relative;overflow:visible;animation:ctaBob 2.8s ease-in-out infinite}
.float-cta{position:fixed}
.btn-primary::before,.btn-p::before,.header-cta::before,.hcta::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);background-size:250% 100%;animation:ctaShine 3s ease-in-out infinite}
.btn-primary::after,.btn-p::after,.header-cta::after,.hcta::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 0 rgba(129,140,248,.65);animation:ctaRing 2.2s ease-out infinite}
@keyframes ctaBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes ctaShine{0%{background-position:150% 0}60%,100%{background-position:-50% 0}}
@keyframes ctaRing{0%{box-shadow:0 0 0 0 rgba(129,140,248,.65)}70%,100%{box-shadow:0 0 0 14px rgba(129,140,248,0)}}
.float-cta.show{animation:ctaBob 2.8s ease-in-out infinite}
.hero-title{font-size:clamp(27px,7.4vw,72px)}
@media(min-width:900px){.hero-title{font-size:clamp(38px,6vw,72px)}}
@media(prefers-reduced-motion:reduce){.btn-primary,.btn-p,.header-cta,.hcta,.float-cta,.btn-primary::before,.btn-p::before,.header-cta::before,.hcta::before,.btn-primary::after,.btn-p::after,.header-cta::after,.hcta::after{animation:none!important}}

/* スマホのトップをシンプルに */
@media(max-width:640px){
 #sec-hero .hero-badge,.m-hide{display:none!important}
 #sec-hero{min-height:auto!important;padding-top:120px!important;padding-bottom:40px!important}
 #sec-hero .hero-title{margin-bottom:20px}
 #sec-hero .hero-subtitle-main{font-size:15px;line-height:1.8;margin-bottom:28px}
 #sec-hero .hero-cta-group{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}
 #sec-hero .btn-secondary{padding:14px 40px}
 #sec-hero .btn-primary{display:flex;justify-content:center;width:100%;box-sizing:border-box;padding:18px 20px}
 .btn-primary::after,.header-cta::after{animation-duration:2.6s}
 .header-cta{padding:10px 14px;font-size:13px}
}