/* ---- AIコンサルティングのページ（案A：AI診断チャットを冒頭に置いた型。2026-10-19） ---- */
body.page-template-page-ai-consulting { background: var(--sh-bg, #f1f2f3); }
body.page-template-page-ai-consulting .site-main { max-width: none !important; width: 100% !important; padding-inline: 0 !important; }
.ai { color: var(--sh-ink, #003040); font-weight: 600; overflow-x: clip; }
.ai-in { max-width: 1240px; width: calc(100% - 185px); margin: 0 auto; }
.ai-in--narrow { max-width: 900px; }

/* ---- 冒頭 ---- */
.ai-hero { position: relative; max-width: 1240px; width: calc(100% - 185px); margin: -100px auto 0; padding: 160px 0 100px; }   /* ページ上部の余白（本文の上の100px）を打ち消し、ヒーローを画面の最上部から始める */
.ai-hero::before { content: ""; position: absolute; left: 50%; top: 0; z-index: -1; width: 100vw; height: 100%; margin-left: -50vw; background: radial-gradient(circle at 12% 30%, rgba(5, 153, 217, .16), rgba(5, 153, 217, 0) 45%), radial-gradient(circle at 88% 70%, rgba(233, 106, 143, .16), rgba(233, 106, 143, 0) 45%), radial-gradient(circle, rgba(0, 48, 64, .12) 1.4px, transparent 1.6px) 0 0 / 28px 28px; }
.ai-crumb ol { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 40px; padding: 0; list-style: none; font-size: 13px; line-height: 20px; color: #5b6e77; }
.ai-crumb li + li::before { content: "›"; margin-right: 10px; }
.ai-crumb a { color: inherit; text-decoration: none; }
.ai-crumb a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ai-hero__grid { display: grid; grid-template-columns: 1fr 560px; gap: 56px; align-items: center; }
.ai-tag { margin: 0 0 18px; font-size: 14px; font-weight: 700; letter-spacing: .3em; color: var(--sh-blue, #0599d9); }
.ai-title { margin: 0 0 28px; font-size: clamp(44px, 6.4vw, 84px); line-height: 1.22; font-weight: 700; letter-spacing: .02em; }
.ai-title .grad { background: linear-gradient(90deg, #0599d9, #7b61ff 50%, #e96a8f, #0599d9) 0 0 / 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: ai-grad 8s ease-in-out infinite alternate; }
@keyframes ai-grad { to { background-position: 100% 0; } }
.ai-lead { margin: 0; font-size: 16px; line-height: 2.1; letter-spacing: .08em; }

/* ---- AI診断チャット ---- */
.ai-chat { position: relative; overflow: hidden; border-radius: 28px; background: #fff; box-shadow: 0 30px 80px rgba(31, 63, 115, .2), 0 0 0 1px rgba(5, 153, 217, .12); }
.ai-chat__bar { display: flex; align-items: center; gap: 7px; padding: 16px 22px; background: linear-gradient(90deg, #0599d9, #7b61ff); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .1em; }
.ai-chat__bar i { width: 11px; height: 11px; border-radius: 50%; background: rgba(255, 255, 255, .6); }
.ai-chat__bar span { margin-left: 10px; }
.ai-chat__log { height: 400px; overflow-y: auto; padding: 22px 22px 8px; scroll-behavior: smooth; }
.ai-msg { display: flex; gap: 10px; margin-bottom: 16px; opacity: 0; transform: translateY(12px); animation: ai-pop .5s cubic-bezier(.2, .7, .2, 1) forwards; }
@keyframes ai-pop { to { opacity: 1; transform: none; } }
.ai-msg--me { justify-content: flex-end; }
.ai-msg__av { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, #0599d9, #7b61ff 60%, #e96a8f); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.ai-msg__b { max-width: 82%; padding: 14px 18px; border-radius: 6px 20px 20px 20px; background: #f0f4f8; font-size: 15px; line-height: 1.85; letter-spacing: .04em; }
.ai-msg--me .ai-msg__b { border-radius: 20px 6px 20px 20px; background: linear-gradient(135deg, #0599d9, #7b61ff); color: #fff; }
.ai-typing { display: inline-flex; gap: 5px; padding: 6px 2px; }
.ai-typing i { width: 8px; height: 8px; border-radius: 50%; background: #9aa9b8; animation: ai-dot 1s ease-in-out infinite; }
.ai-typing i:nth-child(2) { animation-delay: .15s; } .ai-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes ai-dot { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-6px); opacity: 1; } }
.ai-caret::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--sh-blue, #0599d9); animation: ai-blink 1s steps(2) infinite; }
@keyframes ai-blink { 50% { opacity: 0; } }
.ai-res { margin: 12px 0 0; padding: 0; list-style: none; opacity: 0; transform: translateY(10px); transition: opacity .6s ease, transform .6s ease; }
.ai-res.is-in { opacity: 1; transform: none; }
.ai-res li { position: relative; margin: 0 0 6px; padding: 10px 14px 10px 40px; border-radius: 12px; background: #fff; box-shadow: 0 4px 12px rgba(0, 48, 64, .06); font-size: 14px; line-height: 1.7; }
.ai-res li::before { content: ""; position: absolute; left: 12px; top: 12px; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(45deg, #e96a8f, #009ada) 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='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat; }
.ai-cta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; opacity: 0; transition: opacity .6s ease; }
.ai-cta.is-in { opacity: 1; }
.ai-cta a { display: inline-block; padding: 10px 18px; border-radius: 40px; background: #003953; color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-decoration: none; transition: opacity .3s; }
.ai-cta a.alt { background: #fff; color: #003953; box-shadow: inset 0 0 0 1.5px #003953; }
.ai-cta a:hover { opacity: .8; }
.ai-chat__opts { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 18px 16px; border-top: 1px solid #e6edf3; }
.ai-opt { padding: 7px 13px; border: 1.5px solid #0599d9; border-radius: 40px; background: #fff; color: #0b4f73; font: inherit; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; line-height: 1.5; text-align: left; cursor: pointer; transition: background .3s, color .3s, transform .3s; }
.ai-opt:hover { background: #0599d9; color: #fff; transform: translateY(-2px); }
.ai-opt:disabled { opacity: .4; cursor: default; transform: none; background: #fff; color: #0b4f73; }
.ai-chat__opts.is-wait .ai-opt { pointer-events: none; opacity: .45; }

/* ---- 共通の見出し ---- */
.ai-sec { padding: 0 0 140px; }
.ai-h { margin: 0 0 44px; line-height: 22.4px; font-weight: 400; }
.ai-h .en { display: block; margin-bottom: 14px; font-size: 14px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--sh-blue, #0599d9); }
.ai-h .jp { display: block; font-size: clamp(28px, 3.4vw, 42px); line-height: 1.3; font-weight: 700; letter-spacing: .04em; }

/* ---- できること ---- */
.ai-can { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ai-can__item { position: relative; padding: 40px 32px 36px; border-radius: 28px; background: #fff; box-shadow: 0 12px 36px rgba(0, 48, 64, .08); transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s; }
.ai-can__item:hover { transform: translateY(-8px); box-shadow: 0 24px 50px rgba(5, 153, 217, .2); }
.ai-can__item b { display: block; margin-bottom: 14px; font-size: 56px; line-height: 1; font-weight: 700; color: transparent; -webkit-text-stroke: 1.5px var(--sh-blue, #0599d9); }
.ai-can__item h3 { margin: 0 0 12px; font-size: 22px; font-weight: 700; letter-spacing: .05em; }
.ai-can__item p { margin: 0; font-size: 15px; line-height: 1.95; letter-spacing: .05em; color: #5b6e77; }

/* ---- 流れ ---- */
.ai-st { --p: 0; position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin: 0; padding: 70px 0 0; list-style: none; }
.ai-st::before { content: ""; position: absolute; z-index: 0; left: 0; right: 0; top: 30px; height: 4px; border-radius: 4px; background: rgba(0, 48, 64, .12); }
.ai-st::after { content: ""; position: absolute; z-index: 0; left: 0; top: 30px; height: 4px; border-radius: 4px; width: calc(100% * var(--p)); background: linear-gradient(90deg, #e96a8f, #7b61ff, #0599d9); }
.ai-st li { position: relative; z-index: 1; }
.ai-st li::before { content: ""; position: absolute; left: 0; top: -48px; width: 24px; height: 24px; box-sizing: border-box; border: 4px solid #fff; border-radius: 50%; background: #c9d6e3; box-shadow: 0 0 0 3px rgba(0, 48, 64, .12); transition: background .4s, transform .4s; }
.ai-st li.is-on::before { background: var(--sh-blue, #0599d9); transform: scale(1.25); }
.ai-st b { display: block; margin-bottom: 8px; font-size: 32px; line-height: 1; font-weight: 700; color: transparent; -webkit-text-stroke: 1.5px var(--sh-blue, #0599d9); }
.ai-st h3 { margin: 0 0 10px; font-size: 20px; font-weight: 700; letter-spacing: .06em; }
.ai-st p { margin: 0; font-size: 14px; line-height: 1.9; letter-spacing: .04em; color: #5b6e77; }
.ai-free { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin: 64px 0 0; padding: 28px 36px; border-radius: 28px; background: linear-gradient(135deg, #0599d9, #7b61ff 60%, #e96a8f); color: #fff; box-shadow: 0 20px 50px rgba(123, 97, 255, .3); }
.ai-free span { font-size: clamp(18px, 2vw, 24px); font-weight: 700; letter-spacing: .08em; }
.ai-free .sh-more { color: #fff; }

/* ---- FAQ ---- */
.ai-faq { margin-bottom: 12px; border-radius: 20px; background: #fff; box-shadow: 0 8px 24px rgba(0, 48, 64, .06); }
.ai-faq summary { position: relative; padding: 22px 64px 22px 28px; font-size: 17px; font-weight: 700; letter-spacing: .05em; cursor: pointer; list-style: none; }
.ai-faq summary::-webkit-details-marker { display: none; }
.ai-faq summary::after { content: "+"; position: absolute; right: 26px; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; background: linear-gradient(45deg, #e96a8f, #009ada); color: #fff; font-size: 20px; line-height: 28px; text-align: center; transition: transform .3s; }
.ai-faq[open] summary::after { transform: rotate(45deg); }
.ai-faq p { margin: 0; padding: 0 28px 24px; font-size: 15px; line-height: 2; letter-spacing: .05em; color: #5b6e77; }

/* ---- 次はこちら ---- */
.ai-next { padding: 0 0 140px; }
.ai-next__lead { margin: 0 0 20px; font-size: 16px; letter-spacing: .1em; color: #5b6e77; }
.ai-next__card { position: relative; display: grid; grid-template-columns: 420px 1fr; gap: 40px; align-items: center; overflow: hidden; padding: 20px 80px 20px 20px; border-radius: 32px; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 16px 44px rgba(0, 48, 64, .1); transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s; }
.ai-next__card:hover { transform: translateY(-6px); box-shadow: 0 28px 60px rgba(5, 153, 217, .22); }
.ai-next__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 22px; }
.ai-next__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2, .7, .2, 1); }
.ai-next__card:hover .ai-next__img img { transform: scale(1.06); }
.ai-next__txt small { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 700; letter-spacing: .24em; color: var(--sh-pink, #e96a8f); }
.ai-next__txt b { display: block; margin-bottom: 10px; font-size: clamp(26px, 3vw, 38px); line-height: 1.3; letter-spacing: .04em; }
.ai-next__txt em { font-style: normal; font-size: 15px; line-height: 1.9; letter-spacing: .05em; color: #5b6e77; }
.ai-next__go { position: absolute; right: 24px; top: 50%; width: 52px; height: 52px; margin-top: -26px; border-radius: 50%; background: linear-gradient(45deg, #e96a8f, #009ada); transition: transform .4s; }
.ai-next__go::before { content: ""; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Cpath d='M1.5 8h20M15 1.5L21.5 8L15 14.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 22px 15px no-repeat; }
.ai-next__card:hover .ai-next__go { transform: translateX(6px); }

.js-on .ai-rv { opacity: 0; transform: translateY(36px); transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1); }
.js-on .ai-rv.is-in { opacity: 1; transform: none; }
.js-on .ai-st li:nth-child(2) { transition-delay: .1s; } .js-on .ai-st li:nth-child(3) { transition-delay: .2s; } .js-on .ai-st li:nth-child(4) { transition-delay: .3s; } .js-on .ai-st li:nth-child(5) { transition-delay: .4s; }
.js-on .ai-can__item:nth-child(2) { transition-delay: .1s; } .js-on .ai-can__item:nth-child(3) { transition-delay: .2s; }

@media (max-width: 1180px) { .ai-hero__grid { grid-template-columns: 1fr; } .ai-chat { max-width: 640px; } }
@media (max-width: 1080px) {
	.ai-in, .ai-hero { width: calc(100% - 64px); }
	.ai-hero { padding-top: 130px; }
	.ai-can { grid-template-columns: 1fr; }
	.ai-st { grid-template-columns: 1fr; padding: 0 0 0 40px; }
	.ai-st::before, .ai-st::after { left: 11px; right: auto; top: 0; bottom: 0; width: 4px; height: auto; }
	.ai-st::after { height: calc(100% * var(--p)); }
	.ai-st li { padding-bottom: 28px; }
	.ai-st li::before { left: -40px; top: 2px; }
	.ai-next__card { grid-template-columns: 1fr; padding: 16px 16px 24px; }
	.ai-next__go { right: 20px; top: auto; bottom: 20px; margin: 0; }
}
@media (prefers-reduced-motion: reduce) { .js-on .ai-rv { opacity: 1; transform: none; transition: none; } .ai-title .grad, .ai-typing i, .ai-caret::after { animation: none; } .ai-msg { opacity: 1; transform: none; animation: none; } }

/* ---- 案A＋案C＋仕掛け1・3・6（2026-10-19） ---- */
/* 仕掛け6：次の章の予告 */
.ai-peek { margin: 56px 0 0; text-align: center; }
.ai-peek--hero { margin-top: 64px; }
.ai-peek a { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; color: inherit; text-decoration: none; }
.ai-peek small { font-size: 11px; font-weight: 700; letter-spacing: .3em; color: var(--sh-pink, #e96a8f); }
.ai-peek b { font-size: 16px; letter-spacing: .08em; }
.ai-peek i { position: relative; width: 2px; height: 44px; background: linear-gradient(to bottom, rgba(5, 153, 217, 0), #0599d9); animation: ai-peek 1.8s ease-in-out infinite; }
.ai-peek i::after { content: ""; position: absolute; left: -4px; bottom: 0; width: 10px; height: 10px; border-right: 2px solid #0599d9; border-bottom: 2px solid #0599d9; transform: rotate(45deg); }
@keyframes ai-peek { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(8px); } }
.ai-peek a:hover b { color: var(--sh-blue, #0599d9); }
.ai-can__lead { margin: -16px 0 36px; max-width: 760px; font-size: 17px; line-height: 2; letter-spacing: .06em; }
.ai-typed::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--sh-blue, #0599d9); animation: ai-blink 1s steps(2) infinite; }

/* 案C：縦にスクロールすると横に流れる物語 */
.ai-hs { position: relative; width: 100vw; margin: 0 0 120px calc(50% - 50vw); }
.ai-hs__stick { position: sticky; top: 112px; display: flex; flex-direction: column; height: min(640px, calc(100vh - 132px)); overflow: hidden; }
.ai-hs__title { flex: none; padding: 0 calc((100vw - 1240px) / 2) 26px; }
.ai-hs__title .en { margin: 0 0 8px; font-size: 14px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--sh-blue, #0599d9); }
.ai-hs__title h2 { margin: 0; font-size: clamp(28px, 3.4vw, 42px); line-height: 1.3; font-weight: 700; letter-spacing: .04em; }
.ai-hs__stage { position: relative; flex: 1; min-height: 0; }
.ai-hs__bg { position: absolute; inset: 0; pointer-events: none; }
.ai-hs__bg span { position: absolute; border-radius: 50%; }
.ai-hs__bg .b1 { left: 10%; top: 20%; width: 380px; height: 380px; background: radial-gradient(circle, rgba(5, 153, 217, .2), rgba(5, 153, 217, 0) 70%); }
.ai-hs__bg .b2 { left: 70%; top: 30%; width: 420px; height: 420px; background: radial-gradient(circle, rgba(233, 106, 143, .2), rgba(233, 106, 143, 0) 70%); }
.ai-hs__track { position: relative; display: flex; gap: 36px; height: calc(100% - 16px); padding: 0 calc((100vw - 1240px) / 2); will-change: transform; }
.ai-hs__rail { position: absolute; left: 0; top: 46px; height: 3px; width: 100%; background: rgba(0, 48, 64, .14); border-radius: 3px; }
.ai-hs__fill { position: absolute; left: 0; top: 46px; height: 3px; width: 0; border-radius: 3px; background: linear-gradient(90deg, #e96a8f, #7b61ff, #0599d9); }
.ai-hs__fill::after { content: ""; position: absolute; right: -9px; top: -8px; width: 19px; height: 19px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(5, 153, 217, .35), 0 0 22px 6px rgba(5, 153, 217, .55); animation: ai-pulse 1.6s ease-in-out infinite; }
@keyframes ai-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.25); } }
.ai-hs__item { position: relative; flex: none; width: 440px; padding-top: 70px; }
.ai-hs__item::before { content: ""; position: absolute; left: 0; top: 36px; width: 23px; height: 23px; box-sizing: border-box; border: 4px solid #fff; border-radius: 50%; background: #c9d6e3; box-shadow: 0 0 0 3px rgba(0, 48, 64, .12); transition: background .4s, transform .4s, box-shadow .4s; }
.ai-hs__item.is-passed::before { background: var(--sh-blue, #0599d9); }
.ai-hs__item.is-active::before { transform: scale(1.5); box-shadow: 0 0 0 6px rgba(5, 153, 217, .25), 0 0 24px 4px rgba(5, 153, 217, .5); }
.ai-hs__no { position: absolute; left: 0; top: -8px; font-size: 40px; line-height: 1; font-weight: 700; color: transparent; -webkit-text-stroke: 1.5px var(--sh-blue, #0599d9); background: linear-gradient(90deg, #e96a8f, #7b61ff, #0599d9) 0 0 / 0% 100% no-repeat; -webkit-background-clip: text; background-clip: text; transition: background-size .9s cubic-bezier(.2, .7, .2, 1), -webkit-text-stroke-color .5s; }
.ai-hs__item.is-active .ai-hs__no { background-size: 100% 100%; -webkit-text-stroke-color: transparent; }
.ai-hs__card { height: calc(100% - 70px); padding: 0 0 24px; overflow: hidden; border-radius: 28px 80px 28px 28px; background: #fff; box-shadow: 0 12px 36px rgba(0, 48, 64, .08); transform-origin: 0 0; will-change: transform; transition: box-shadow .5s; }
.ai-hs__item.is-active .ai-hs__card { box-shadow: 0 26px 56px rgba(5, 153, 217, .22); }
.ai-hs__img { display: block; height: 112px; overflow: hidden; background: var(--sh-ph, #e3e8eb); }
.ai-hs__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ai-hs__card h3 { margin: 14px 26px 2px; font-size: 22px; font-weight: 700; letter-spacing: .05em; }
.ai-hs__card .lead { margin: 0 26px 8px; font-size: 14px; font-weight: 700; color: var(--sh-pink, #e96a8f); letter-spacing: .06em; }
.ai-hs__card .d { margin: 0 26px 10px; font-size: 14px; line-height: 1.8; letter-spacing: .04em; color: #4a5b64; min-height: 76px; }
.ai-hs__card .ba { display: grid; grid-template-columns: 1fr 22px 1fr; align-items: center; gap: 8px; margin: 0 26px; }
.ai-hs__card .ba > span { display: block; padding: 10px 12px; border-radius: 14px; font-size: 12px; line-height: 1.6; font-weight: 700; letter-spacing: .03em; }
.ai-hs__card .ba small { display: block; margin-bottom: 2px; font-size: 10px; letter-spacing: .16em; }
.ai-hs__card .ba .b { background: #e3e8eb; color: #4a5256; }
.ai-hs__card .ba .a { background: linear-gradient(135deg, #e6f4fc, #f1ecff); color: var(--sh-ink, #003040); box-shadow: 0 0 0 1.5px rgba(5, 153, 217, .35); }
.ai-hs__card .ba i { width: 22px; height: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Cpath d='M1.5 8h20M15 1.5L21.5 8L15 14.5' fill='none' stroke='%230599d9' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px 13px no-repeat; }
.ai-hs__bar { position: absolute; left: calc((100vw - 1240px) / 2); right: calc((100vw - 1240px) / 2); bottom: 0; height: 4px; border-radius: 4px; background: rgba(0, 48, 64, .12); overflow: hidden; }
.ai-hs__bar i { display: block; height: 100%; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #e96a8f, #7b61ff, #0599d9); }
.ai-sec--free { padding-bottom: 120px; }
/* 料金（AIコンサルティング。顧問型 月額¥80,000〜。2026-10-21） */
.ai-sec--price { padding-bottom: 24px; }
.ai-price { display: grid; grid-template-columns: minmax(280px, .9fr) 1.1fr; border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 20px 56px rgba(0, 48, 64, .1); }
.ai-price__main { display: flex; flex-direction: column; justify-content: center; padding: 44px 36px; background: linear-gradient(135deg, #0599d9, #7b61ff 60%, #e96a8f); color: #fff; }
.ai-price__plan { margin: 0 0 12px; font-size: 14px; font-weight: 700; letter-spacing: .22em; opacity: .92; }
.ai-price__num { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 6px; margin: 0; white-space: nowrap; }
.ai-price__num small { font-size: 17px; font-weight: 700; letter-spacing: .1em; }
.ai-price__num b { font-size: clamp(38px, 4.4vw, 52px); line-height: 1.1; font-weight: 900; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.ai-price__num em { font-size: 26px; font-weight: 700; font-style: normal; }
.ai-price__note { margin: 16px 0 0; font-size: 13.5px; line-height: 1.85; letter-spacing: .05em; opacity: .95; }
.ai-price__body { padding: 40px 40px 36px; }
.ai-price__body h3 { margin: 0 0 18px; font-size: 18px; font-weight: 700; letter-spacing: .06em; }
.ai-price__list { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.ai-price__list li { position: relative; padding-left: 36px; }
.ai-price__list li::before { content: "✓"; position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--sh-blue, #0599d9); color: #fff; font-size: 13px; font-weight: 700; }
.ai-price__list b { display: block; font-size: 16px; line-height: 1.6; font-weight: 700; letter-spacing: .04em; }
.ai-price__list span { display: block; font-size: 14px; line-height: 1.85; letter-spacing: .04em; color: #5b6e77; }
.ai-price__fine { margin: 18px 4px 0; font-size: 13px; line-height: 1.9; letter-spacing: .04em; color: #5b6e77; }
@media (max-width: 800px) {
	.ai-price { grid-template-columns: 1fr; }
	.ai-price__main { padding: 32px 26px; }
	.ai-price__body { padding: 28px 26px 26px; }
}
@media (max-width: 1080px) {
	.ai-hs { height: auto !important; margin-bottom: 72px; }
	.ai-hs__stick { position: static; height: auto; overflow-x: auto; padding-bottom: 16px; scroll-snap-type: x mandatory; }
	.ai-hs__title { padding: 0 32px 20px; }
	.ai-hs__track { height: 520px; padding: 0 16px; transform: none !important; }
	.ai-hs__item { width: 82vw; scroll-snap-align: center; }
	.ai-hs__bar, .ai-hs__bg, .ai-hs__fill { display: none; }
}
@media (prefers-reduced-motion: reduce) { .ai-peek i, .ai-hs__fill::after, .ai-typed::after { animation: none; } }

/* ---- ヒーローを画面の高さいっぱいにし、文章を縦中央に、チャット全体を最初の画面に収める（2026-10-19） ---- */
@media (min-width: 1181px) {
	.ai-hero { box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; min-height: 100vh; padding: 136px 0 76px; }
	.ai-hero .ai-crumb { position: absolute; left: 0; top: 160px; }   /* ヘッダーとの間に、余白を設ける */
	.ai-hero .ai-crumb ol { margin: 0; }
	.ai-hero__grid { align-items: center; }
	.ai-chat__log { height: clamp(180px, calc(100vh - 560px), 400px); }
	.ai-peek--hero { position: absolute; left: 0; right: 0; bottom: -62px; margin: 0; }
}

/* ヒーローの「NEXT」の予告が、下の「できること」の見出しと重ならないよう、見出しを下げる */
.ai-hero + .ai-sec { padding-top: 140px; }

/* よくある質問：伸びるときの中身は、少し遅れてふわっと現れる */
.ai-faq[open] p { animation: ai-faq-in .5s ease .12s both; }
@keyframes ai-faq-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---- ヒーロー以外の背景の仕掛け：ページを下へ流れる「光の糸」と、またたく星、ゆっくり動く光の輪（2026-10-19） ---- */
.ai { position: relative; isolation: isolate; }
.ai-bg { position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; overflow: hidden; pointer-events: none; }
.ai-bg__tint { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 153, 217, 0) 0%, rgba(5, 153, 217, .06) 18%, rgba(123, 97, 255, .07) 45%, rgba(233, 106, 143, .07) 70%, rgba(5, 153, 217, .05) 100%); }
.ai-bg__svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; }
.ai-bg__base { fill: none; stroke: url(#ai-bg-grad); stroke-width: 3; stroke-linecap: round; opacity: .42; }
.ai-bg__pulse { fill: none; stroke: url(#ai-bg-grad); stroke-width: 6; stroke-linecap: round; filter: drop-shadow(0 0 10px rgba(5, 153, 217, .9)); animation: ai-pulse-run linear infinite; }
@keyframes ai-pulse-run { from { stroke-dashoffset: var(--len); } to { stroke-dashoffset: 0; } }
.ai-star { position: absolute; width: var(--s, 14px); height: var(--s, 14px); margin: calc(var(--s, 14px) / -2) 0 0 calc(var(--s, 14px) / -2); transform: translateY(var(--py, 0px)); }
.ai-star::before { content: ""; display: block; width: 100%; height: 100%; background: var(--c, #0599d9); clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); opacity: .8; animation: ai-twinkle var(--d, 4s) ease-in-out infinite; animation-delay: var(--dl, 0s); }
@keyframes ai-twinkle { 0%, 100% { transform: scale(.4) rotate(0deg); opacity: .15; } 50% { transform: scale(1) rotate(45deg); opacity: .8; } }
.ai-ring { position: absolute; border-radius: 50%; border: 2px solid var(--c, rgba(5, 153, 217, .25)); transform: translateY(var(--py, 0px)); }
.ai-ring::after { content: ""; position: absolute; inset: 18%; border: 1.5px dashed var(--c, rgba(5, 153, 217, .25)); border-radius: 50%; animation: ai-ringspin 40s linear infinite; }
@keyframes ai-ringspin { to { transform: rotate(360deg); } }
@media (max-width: 1080px) { .ai-ring { display: none; } }
@media (prefers-reduced-motion: reduce) { .ai-bg__pulse, .ai-star::before, .ai-ring::after { animation: none !important; } .ai-bg__pulse { display: none; } }
