:root{
  --bg:#0a0c12;
  --text:#f6f7fb;
  --muted:#9aa4b6;
  --line:#262d39;
  --red:#e8253c;
  --red-hover:#ff3b50;
  --red-active:#c0122a;
  --red-soft:rgba(232,37,60,.14);
  /* ===== 騰落カラー（日本市場慣例）: 上昇=赤 / 下落=緑 =====
     騰落の色はここだけで管理する。個別の箇所に色を直書きしないこと。
     ボタンの --red 系とは意図的に別の赤を使い、変数を共有しない
     （--up を --red-hover と同値にすると「ボタン色＝騰落色」と誤読される）。 */
  --up:#ff4d5e;
  --up-soft:rgba(255,77,94,.14);
  --up-line:rgba(255,77,94,.34);
  --down:#2ee08a;
  --down-soft:rgba(46,224,138,.14);
  --down-line:rgba(46,224,138,.34);
  --neutral:#b4bdca;
  --neutral-soft:rgba(180,189,202,.1);
  --neutral-line:rgba(180,189,202,.24);
  --shadow:0 24px 64px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.62;overflow-x:hidden;text-rendering:optimizeSpeed}
button,input{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
.container{width:min(1160px,calc(100% - 40px));margin:0 auto}
/* ブレンドモードはスクロール中に全画面を再合成させるため使わず、不透明度のみで粒子感を出す */
.noise{position:fixed;inset:0;pointer-events:none;opacity:.05;background-image:radial-gradient(circle at 25% 25%,#fff 0 1px,transparent 1px);background-size:5px 5px;z-index:99}

/* LINE アイコンは site-files/line-icon.svg（独立ファイル）を <img> で参照する。
   img なので fill/color の指定は不要。サイズと配置のみ CSS で管理する。 */
.ico{width:19px;height:19px;flex:0 0 auto;display:block;align-self:center;object-fit:contain}
.final-button .ico,.final-button-sub .ico,.modal-primary .ico{width:21px;height:21px}

/* ===== Header : brand left / CTA right ===== */
/* backdrop-filter は追従時に毎フレーム再計算されるため使わず、背景の不透明度で代替する */
.site-header{position:sticky;top:0;z-index:60;background:rgba(10,12,18,.94);border-bottom:1px solid rgba(255,255,255,.06)}
.header-inner{min-height:68px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:16px}
.logo{display:inline-flex;align-items:center;gap:11px;min-width:max-content}
.logo-mark{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--red);color:#fff;font-weight:900;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
.logo strong{display:block;font-size:13.5px;letter-spacing:.13em}
.logo small{display:block;color:var(--muted);font-size:9px;letter-spacing:.17em;margin-top:-2px}

/* ===== Red button system ===== */
.header-cta,.analyze-btn,.final-button,.modal-primary{border:0;background:var(--red);color:#fff;font-weight:800;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .2s ease,transform .2s ease}
.header-cta:hover,.analyze-btn:hover,.final-button:hover,.modal-primary:hover{background:var(--red-hover);transform:translateY(-1px)}
.header-cta:active,.analyze-btn:active,.final-button:active,.modal-primary:active{background:var(--red-active);transform:translateY(0)}
.header-cta{padding:10px 15px;font-size:13px;white-space:nowrap}

/* ===== Hero ===== */
.hero{position:relative;padding:66px 0 48px;overflow:hidden}
.hero:before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,var(--red-soft),transparent 68%);right:-150px;top:-170px;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:58px;align-items:center}
.kicker,.section-tag,.modal-kicker{font-size:10.5px;letter-spacing:.17em;color:#bcc6d6;font-weight:800}
.kicker{display:flex;align-items:center;gap:9px}
/* 「98.8%」は数字+記号なので、途中で改行されないよう 1 語として扱う */
.kicker-text{display:inline-block}
.kicker-text b{font-weight:800;white-space:nowrap}
.kicker i,.live-dot i,.market-meta i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 14px rgba(232,37,60,.85)}
/* 見出しは短い 1 行コピーになったため、字間と余白を締めて視覚重心を保つ */
.hero h1{font-size:clamp(40px,4.9vw,66px);line-height:1.14;letter-spacing:-.04em;margin:16px 0 16px}
.hero-lead{max-width:560px;color:#aeb7c5;font-size:16px;line-height:1.7;margin:0 0 24px}
.search-console{padding:17px;border:1px solid #27303d;background:linear-gradient(180deg,rgba(21,26,36,.98),rgba(16,20,29,.98));border-radius:20px;box-shadow:var(--shadow)}
.search-console label{display:block;font-size:10.5px;color:#8f9aad;font-weight:700;letter-spacing:.11em;margin-bottom:8px}
.search-row{display:grid;grid-template-columns:1fr auto;gap:10px}
.input-shell{height:54px;border:1px solid #303846;background:#0c1017;border-radius:13px;display:flex;align-items:center;padding:0 15px;gap:10px}
.input-shell:focus-within{border-color:rgba(232,37,60,.6);box-shadow:0 0 0 3px rgba(232,37,60,.1)}
.input-shell svg{width:19px;height:19px;fill:none;stroke:#718096;stroke-width:1.8}
.input-shell input{flex:1;border:0;outline:0;background:transparent;color:#fff;min-width:0}
.input-shell input::placeholder{color:#697487}
.analyze-btn{min-width:158px;padding:0 20px;height:54px;font-size:14px}
.quick-picks{display:flex;align-items:center;gap:11px;margin-top:12px}
.quick-picks>span{font-size:9px;color:#667085;letter-spacing:.15em}
.quick-picks>div{display:flex;gap:7px;flex-wrap:wrap}
.quick-picks button{border:1px solid #2a3340;background:#0d1118;color:#aeb7c5;border-radius:999px;padding:5px 10px;font-size:11px;transition:.2s}
.quick-picks button:hover{border-color:var(--red);color:#fff}
.proof-row{display:flex;gap:30px;margin-top:24px}
.proof-row div{display:flex;flex-direction:column}
.proof-row b{font-size:22px;letter-spacing:-.04em}
.proof-row span{font-size:10.5px;color:#778296}

/* ===== Hero visual ===== */
.hero-visual{position:relative;border:1px solid #26303d;background:linear-gradient(155deg,#131923,#0d1118 64%);border-radius:24px;padding:20px;box-shadow:0 28px 72px rgba(0,0,0,.4);overflow:hidden}
/* filter:blur() は親の再描画ごとにぼかし直されるため、gradient の減衰で同等の見た目にする */
.hero-visual:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,var(--red-soft) 0%,rgba(232,37,60,.06) 55%,transparent 72%);right:-70px;bottom:-90px}
.visual-top,.quote-feature,.visual-stats{position:relative;z-index:2}
.visual-top{display:flex;justify-content:space-between;color:#778296;font-size:10px;letter-spacing:.11em}
.live-dot{display:flex;align-items:center;gap:7px}
.quote-feature{display:flex;justify-content:space-between;gap:22px;align-items:end;margin:28px 0 18px}
.feature-code{font-size:10.5px;color:#7e899a;border:1px solid #303745;padding:4px 8px;border-radius:999px}
.quote-feature h2{margin:7px 0 0;font-size:22px}
.feature-price{text-align:right}
.feature-price strong{font-size:31px;letter-spacing:-.04em;display:block}
.feature-price span{font-size:13.5px;font-weight:800;display:inline-block;margin-top:3px;padding:2px 9px;border-radius:999px;border:1px solid var(--neutral-line);background:var(--neutral-soft)}
.feature-price span.up{border-color:var(--up-line);background:var(--up-soft)}
.feature-price span.down{border-color:var(--down-line);background:var(--down-soft)}
/* クラス名は騰落の意味（up / down）で固定し、色の対応だけを変数で切り替える */
.up{color:var(--up)!important}
.down{color:var(--down)!important}
.neutral{color:var(--neutral)!important}
/* チャートは currentColor 経由で up / down の色を受け取る（線・面グラデーション共通） */
.chart-card{height:240px;position:relative;border-radius:16px;background:#0b0f15;border:1px solid #202734;overflow:hidden;color:var(--neutral)}
.grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:100% 52px,87px 100%}
.chart-card svg{position:absolute;inset:18px 0;width:100%;height:calc(100% - 36px)}
.chart-card .area{fill:url(#nexusArea)}
.chart-card .line{fill:none;stroke:currentColor;stroke-width:3;vector-effect:non-scaling-stroke}
.chart-labels{position:absolute;left:15px;right:15px;bottom:7px;display:flex;justify-content:space-between;color:#5e6878;font-size:9px}
.visual-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:12px}
.visual-stats div{border:1px solid #232b37;background:rgba(8,11,16,.65);border-radius:13px;padding:11px}
.visual-stats span{display:block;color:#707b8d;font-size:9px;letter-spacing:.07em}
.visual-stats b{display:block;margin-top:5px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== Ticker : 純 CSS のシームレス自動スクロール（手動操作なし） ===== */
.ticker-wrap{position:relative;border-top:1px solid #1d232d;border-bottom:1px solid #1d232d;background:#0d1016;overflow:hidden;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.ticker-track{display:flex;width:max-content;animation:ticker 46s linear infinite;will-change:transform;pointer-events:none}
.ticker-group{display:flex;flex:0 0 auto}
.ticker-item{display:flex;align-items:center;gap:9px;padding:11px 20px;border-right:1px solid #232a34;font-size:11px;white-space:nowrap}
.ticker-item b{color:#fff}
.ticker-item span{color:#788496}
.ticker-item em{font-style:normal;font-weight:800}
/* 同一内容を2セット並べているため -50% で継ぎ目なくループする */
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== Market board ===== */
.market-section{padding:80px 0}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:26px;margin-bottom:26px}
.section-heading h2{font-size:clamp(27px,3.6vw,43px);letter-spacing:-.04em;margin:7px 0 0;line-height:1.18}
.section-tag{color:var(--red-hover)}
.market-meta{display:flex;align-items:center;gap:8px;color:#798496;font-size:11px}
.market-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.stock-card{border:1px solid #222a36;background:#0f131b;border-radius:16px;padding:17px;transition:transform .2s ease,border-color .2s ease;cursor:pointer;position:relative;overflow:hidden}
.stock-card:after{content:"";position:absolute;height:2px;left:0;right:100%;bottom:0;background:var(--red);transition:right .24s}
.stock-card:hover{transform:translateY(-3px);border-color:#3c2a33}
.stock-card:hover:after{right:0}
.stock-head{display:flex;justify-content:space-between;gap:13px}
.stock-head b{font-size:13.5px}
.stock-head span{font-size:10px;color:#7b8799}
.stock-body{display:flex;justify-content:space-between;align-items:end;margin-top:19px}
.stock-price{font-size:22px;font-weight:800;letter-spacing:-.03em}
.stock-change{font-size:12.5px;font-weight:800;padding:3px 9px;border-radius:999px;border:1px solid var(--neutral-line);background:var(--neutral-soft)}
.stock-change.up{border-color:var(--up-line);background:var(--up-soft)}
.stock-change.down{border-color:var(--down-line);background:var(--down-soft)}
.stock-meta{margin-top:9px;color:#5e6877;font-size:9px}
.market-disclosure{margin:15px 0 0;color:#687386;font-size:10px}

/* ===== Insight ===== */
.insight-section{padding:86px 0;background:#f1f3ee;color:#101318}
.insight-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:74px;align-items:start}
.insight-intro .section-tag{color:#b3121f}
.insight-intro h2{font-size:clamp(30px,3.6vw,48px);line-height:1.18;letter-spacing:-.045em;margin:12px 0 18px}
.insight-intro p{color:#5c646c;max-width:500px;font-size:15px}
.outline-cta{margin-top:22px;border:0;background:var(--red);color:#fff;border-radius:999px;padding:12px 22px;font-weight:800;font-size:14px;display:inline-flex;align-items:center;gap:9px;transition:background .2s ease,transform .2s ease}
.outline-cta:hover{background:var(--red-hover);color:#fff;transform:translateY(-1px)}
.outline-cta:active{background:var(--red-active);color:#fff;transform:translateY(0)}
.feature-stack{display:grid;gap:10px}
.feature-stack article{display:grid;grid-template-columns:64px 1fr;gap:16px;padding:22px 0;border-top:1px solid #cbd0ca}
.feature-stack article:last-child{border-bottom:1px solid #cbd0ca}
.feature-no{font-size:11px;letter-spacing:.13em;color:#a03a45}
.feature-stack h3{margin:0 0 5px;font-size:18.5px}
.feature-stack p{margin:0;color:#667078;font-size:13.5px}

/* ===== Flow ===== */
.flow-section{padding:86px 0}
.flow-heading p{max-width:360px;color:#778296;font-size:13px}
.flow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.flow-grid article{min-height:248px;padding:22px;border:1px solid #222a34;border-radius:20px;background:linear-gradient(180deg,#11161f,#0d1118);position:relative}
.flow-grid article>span{position:absolute;right:19px;top:17px;color:#46505e;font-size:10px;letter-spacing:.14em}
.flow-icon{width:50px;height:50px;border-radius:15px;background:#1b1319;border:1px solid #3b2831;display:grid;place-items:center;color:var(--red-hover);font-size:22px;margin:30px 0 28px}
.flow-grid h3{margin:0 0 7px;font-size:18.5px}
.flow-grid p{margin:0;color:#778296;font-size:13px}

/* ===== Final CTA (FREE CHECK) ===== */
.final-cta{padding:8px 0 80px}
.final-card{border:1px solid #35222a;background:radial-gradient(circle at 82% 0,var(--red-soft),transparent 40%),#10151d;border-radius:24px;padding:32px 34px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.final-copy{max-width:560px}
.final-card h2{font-size:clamp(26px,2.7vw,32px);letter-spacing:-.035em;margin:8px 0 8px;line-height:1.22}
.final-card p{margin:0;color:#8b95a5;font-size:14px}
.final-actions{display:flex;flex-direction:column;gap:10px;min-width:246px}
.final-button{padding:14px 20px;width:100%;font-size:14.5px}
.final-button-sub{width:100%;padding:13px 20px;border:1px solid rgba(255,255,255,.16);background:var(--red-active);color:#fff;font-weight:800;font-size:14px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .2s ease,transform .2s ease}
.final-button-sub:hover{background:var(--red-hover);color:#fff;transform:translateY(-1px)}
.final-button-sub:active{background:var(--red-active);color:#fff;transform:translateY(0)}

/* ===== Footer ===== */
footer{border-top:1px solid #1d242e;padding:36px 0 28px}
.footer-main{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:22px}
.footer-main p{color:#697485;font-size:11px}
.footer-links{display:flex;gap:17px;font-size:11px;color:#8791a1}
.footer-links a:hover{color:var(--red-hover)}
.disclaimer{border-top:1px solid #1d242e;margin-top:24px;padding-top:18px;color:#586272;font-size:9.5px;line-height:1.7}

/* ===== Modal ===== */
.analysis-modal{position:fixed;inset:0;z-index:120;display:none;place-items:center;padding:20px}
.analysis-modal.is-open{display:grid}
.modal-backdrop{position:absolute;inset:0;background:rgba(2,4,8,.78);backdrop-filter:blur(8px)}
.modal-card{position:relative;width:min(500px,100%);background:linear-gradient(180deg,#151b25,#0e1219);border:1px solid #2b3543;border-radius:24px;padding:34px;box-shadow:0 34px 88px rgba(0,0,0,.5);z-index:1;overflow:hidden}
.modal-close{position:absolute;right:16px;top:14px;width:32px;height:32px;border-radius:50%;border:1px solid #2c3542;background:#0d1117;color:#8994a5;font-size:19px}
.modal-loading,.modal-success{text-align:center}
.modal-orbit{width:80px;height:80px;border-radius:50%;border:1px solid #33404e;margin:0 auto 20px;position:relative;display:grid;place-items:center}
.modal-orbit:before{content:"";position:absolute;inset:8px;border-radius:50%;border:1px dashed #4a3038;animation:spin 5s linear infinite}
.modal-orbit span{width:15px;height:15px;border-radius:50%;background:var(--red);box-shadow:0 0 26px rgba(232,37,60,.8)}
.modal-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--red-hover);top:6px;left:50%;transform:translateX(-50%)}
@keyframes spin{to{transform:rotate(360deg)}}
.modal-kicker{color:var(--red-hover)}
.modal-card h2{font-size:27px;margin:8px 0 6px}
.analysis-target{color:#8893a4;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.progress-shell{height:9px;background:#080b10;border:1px solid #242c37;border-radius:999px;margin:22px 0 10px;overflow:hidden}
.progress-shell i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--red),var(--red-hover));border-radius:inherit;transition:width .3s ease}
.progress-meta{display:flex;justify-content:space-between;align-items:center}
.progress-meta b{font-size:19px}
.progress-meta span{font-size:11px;color:#8792a2}
.stage-dots{display:flex;justify-content:center;gap:7px;margin-top:20px}
.stage-dots i{width:5px;height:5px;border-radius:50%;background:#4a333b}
.success-icon{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:var(--red);color:#fff;font-size:31px;font-weight:900}
.modal-success p{color:#8994a5;font-size:13px;margin:8px auto 22px;max-width:330px}
.modal-primary{width:100%;padding:15px 18px;font-size:14.5px}
.modal-secondary{margin-top:10px;border:0;background:transparent;color:#788496;padding:10px}
.modal-secondary:hover{color:#fff}

/* ===== Floating CTA =====
   常駐のフローティング LINE ボタン。
   z-index の序列は toast(150) > modal(120) > floating-cta(110) > noise(99) > header(60)。
   モーダル表示中は body に .modal-open が付き、フローティング側を隠して
   モーダル内容の上に重ならないようにする。 */
.floating-cta{position:fixed;right:24px;bottom:24px;z-index:110;border:0;padding:14px 20px;border-radius:999px;background:var(--red);color:#fff;font-weight:800;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap;box-shadow:0 14px 34px rgba(232,37,60,.34),0 4px 12px rgba(0,0,0,.34);transition:background .2s ease,transform .2s ease,opacity .2s ease,visibility .2s ease}
.floating-cta .ico{width:21px;height:21px}
.floating-cta:hover{background:var(--red-hover);transform:translateY(-2px)}
.floating-cta:active{background:var(--red-active);transform:translateY(0)}
.floating-cta:focus-visible{outline:2px solid #fff;outline-offset:3px}
/* 呼吸するリング。控えめな 1 段のみで、視線誘導しつつ主要 CTA を邪魔しない */
.floating-cta:before{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid rgba(255,255,255,.28);animation:floatPulse 2.6s ease-out infinite;pointer-events:none}
@keyframes floatPulse{0%{transform:scale(1);opacity:.7}70%{transform:scale(1.14);opacity:0}100%{transform:scale(1.14);opacity:0}}
/* モーダル表示中は非表示（重なり防止） */
body.modal-open .floating-cta{opacity:0;visibility:hidden;pointer-events:none}

/* ===== Toast ===== */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:#f1f3ee;color:#101318;border-radius:999px;padding:10px 16px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:150}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ===== Tablet ===== */
@media (max-width:980px){
  .hero-grid,.insight-grid{grid-template-columns:1fr}
  .hero-grid{gap:40px}
  .hero{padding-top:46px}
  .insight-grid{gap:44px}
  .footer-main{grid-template-columns:1fr auto}
  .footer-main p{grid-column:1/-1;order:3}
  .flow-grid{grid-template-columns:1fr 1fr}
  .flow-grid article:last-child{grid-column:1/-1}
  .final-card{align-items:flex-start;flex-direction:column}
  .final-actions{width:100%;min-width:0;flex-direction:row}
  .final-button,.final-button-sub{flex:1}
}

/* ===== Phone : centered single column, header stays left/right ===== */
@media (max-width:680px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  body{text-align:center}
  .container{width:calc(100% - 24px);max-width:100%;margin-left:auto;margin-right:auto}

  .header-inner{min-height:60px;padding:9px 0;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;text-align:left}
  .logo{justify-content:flex-start;min-width:0;text-align:left}
  .logo-mark{width:32px;height:32px;border-radius:10px}
  .logo strong{font-size:11.5px;letter-spacing:.1em}
  .logo small{font-size:8px;letter-spacing:.12em}
  .header-cta{padding:9px 12px;font-size:11.5px;gap:7px;flex:0 0 auto}
  .header-cta .ico{width:17px;height:17px}

  .hero{padding:30px 0 32px}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:28px;text-align:center}
  .hero-copy,.hero-visual{width:100%;min-width:0;margin-inline:auto}
  .kicker{justify-content:center;flex-wrap:wrap;line-height:1.5;font-size:9.5px}
  .hero h1{font-size:clamp(31px,9.2vw,39px);line-height:1.2;letter-spacing:-.035em;margin:14px auto 13px;max-width:100%}
  .hero-lead{font-size:14px;line-height:1.78;max-width:340px;margin:0 auto 19px}

  .search-console{width:100%;padding:14px;border-radius:17px;text-align:center}
  .search-console label{text-align:center;margin-bottom:9px}
  .search-row{grid-template-columns:minmax(0,1fr);gap:9px;width:100%}
  .input-shell{width:100%;height:52px;padding:0 13px}
  .input-shell input{width:100%;min-width:0;text-align:center;font-size:16px}
  .analyze-btn{width:100%;min-width:0;height:52px;margin:0 auto}
  .quick-picks{flex-direction:column;align-items:center;gap:7px;margin-top:12px}
  .quick-picks>div{width:100%;justify-content:center}
  .quick-picks button{min-height:32px}

  .proof-row{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:20px;justify-items:center}
  .proof-row div{width:100%;align-items:center;text-align:center;padding:7px 3px}
  .proof-row b{font-size:19px}
  .proof-row span{font-size:9.5px}

  .hero-visual{padding:14px;border-radius:18px;text-align:center}
  .visual-top{flex-direction:column;align-items:center;gap:5px}
  .live-dot{justify-content:center}
  .quote-feature{flex-direction:column;align-items:center;gap:11px;margin:22px 0 16px;text-align:center}
  .quote-feature>div{width:100%;text-align:center}
  .quote-feature h2{font-size:20px}
  .feature-price{text-align:center}
  .feature-price strong{font-size:26px}
  .chart-card{height:178px;width:100%}
  .chart-labels{left:10px;right:10px}
  .visual-stats{grid-template-columns:1fr;gap:8px}
  .visual-stats div{text-align:center;padding:10px}

  .ticker-item{justify-content:center;padding:10px 15px;gap:8px}
  /* モバイルは item 幅が狭くなるため、体感速度を揃えるよう少しだけ短く */
  .ticker-track{animation-duration:39s}

  .market-section,.flow-section{padding:56px 0}
  .section-heading,.flow-heading{width:100%;flex-direction:column;align-items:center;gap:11px;text-align:center;margin-bottom:22px}
  .section-heading>div,.flow-heading>div{width:100%;text-align:center}
  .section-heading h2{font-size:clamp(25px,7.8vw,33px);line-height:1.24;margin-inline:auto}
  .market-meta{justify-content:center;width:100%}
  /* 列数・カード内寸法・文字サイズは market-extras.css の 3 列レイアウトで指定する */
  .market-grid{width:100%}
  .stock-card{width:100%;text-align:center}
  .stock-head,.stock-body{flex-direction:column;align-items:center;text-align:center}
  .stock-head b,.stock-head span,.stock-price,.stock-meta{text-align:center;width:100%}
  /* 騰落バッジはピル形状を保つため幅を内容に合わせて中央寄せする */
  .stock-change{width:auto;margin-inline:auto;text-align:center}
  .market-disclosure{max-width:560px;margin:14px auto 0;text-align:center;line-height:1.7}

  .insight-section{padding:58px 0;text-align:center}
  .insight-grid{grid-template-columns:minmax(0,1fr);gap:34px;text-align:center}
  .insight-intro,.feature-stack{width:100%;text-align:center}
  .insight-intro h2{font-size:clamp(26px,8.2vw,34px);line-height:1.24;margin:11px auto 15px}
  .insight-intro h2 br{display:none}
  .insight-intro p{max-width:560px;margin-inline:auto;font-size:14px}
  .outline-cta{margin:19px auto 0;justify-content:center}
  .feature-stack{gap:0}
  .feature-stack article{display:flex;flex-direction:column;align-items:center;gap:7px;padding:20px 8px;text-align:center}
  .feature-no{width:100%;text-align:center}
  .feature-stack h3,.feature-stack p{text-align:center;margin-inline:auto}

  .flow-heading p{max-width:520px;margin:0 auto;text-align:center}
  .flow-grid{grid-template-columns:minmax(0,1fr);gap:11px;width:100%}
  .flow-grid article,.flow-grid article:last-child{grid-column:auto;width:100%;min-height:0;padding:22px 17px;text-align:center}
  .flow-grid article>span{position:static;display:block;width:100%;text-align:center;margin-bottom:11px}
  .flow-icon{margin:0 auto 15px}
  .flow-grid h3,.flow-grid p{text-align:center;margin-inline:auto}

  .final-cta{padding:4px 0 58px}
  .final-card{width:100%;padding:26px 17px;flex-direction:column;align-items:center;gap:20px;text-align:center}
  .final-copy{width:100%;text-align:center}
  .final-card h2{font-size:clamp(24px,7.6vw,30px);line-height:1.24;margin-inline:auto}
  .final-card p{max-width:520px;margin-inline:auto;text-align:center;font-size:13.5px}
  .final-actions{width:100%;max-width:420px;min-width:0;flex-direction:column;margin:0 auto;gap:9px}
  .final-button,.final-button-sub{width:100%;justify-content:center;padding:14px 16px}

  /* モバイルは横幅いっぱいのバー型。safe-area を考慮し、320px でも横溢れしない。
     最終 CTA（FREE CHECK）を覆い隠さないよう、footer 側の padding-bottom で余白を確保する。 */
  .floating-cta{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:auto;max-width:calc(100% - 24px);margin-inline:auto;padding:13px 16px;font-size:13.5px;border-radius:14px}
  .floating-cta .ico{width:19px;height:19px}
  /* トーストはフローティングバーの上に逃がす */
  .toast{bottom:calc(max(12px,env(safe-area-inset-bottom)) + 62px)}

  /* padding-bottom は常駐バーの高さぶんを上乗せ（86px）。
     これで最終 CTA とフッター文言がバーに隠れない。 */
  footer{text-align:center;padding:30px 0 86px}
  .footer-main{grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;gap:13px;text-align:center}
  .footer-logo{justify-content:center}
  .footer-main p{grid-column:auto;order:initial;width:100%;max-width:520px;margin:0 auto;text-align:center}
  .footer-links{width:100%;justify-content:center;flex-wrap:wrap;margin:2px auto 0}
  .disclaimer{text-align:center;margin-inline:auto;line-height:1.8}

  .analysis-modal{padding:12px}
  .modal-card{width:min(100%,500px);max-height:calc(100dvh - 24px);overflow-y:auto;padding:30px 16px 21px;border-radius:20px;text-align:center}
  .modal-close{right:11px;top:10px}
  .modal-card h2{font-size:clamp(22px,7.2vw,26px);line-height:1.26;padding:0 22px}
  .analysis-target{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;max-width:100%;margin-inline:auto}
  .progress-meta{flex-direction:column;align-items:center;gap:4px}
  .stage-dots{justify-content:center}
  .modal-primary{justify-content:center}
  .modal-secondary{display:block;margin:10px auto 0}

  .toast{width:max-content;max-width:calc(100% - 24px);bottom:max(18px,env(safe-area-inset-bottom));white-space:normal}
}

@media (max-width:380px){
  .container{width:calc(100% - 20px)}
  .logo{gap:8px}
  .logo-mark{width:30px;height:30px}
  .logo strong{font-size:10.5px}
  .logo small{display:none}
  .header-cta{padding:8px 10px;font-size:11px}
  .hero{padding-top:24px}
  .hero h1{font-size:28px}
  .search-console{padding:12px 11px}
  .input-shell{padding:0 11px}
  .quick-picks button{font-size:10px;padding:6px 9px}
  .proof-row{gap:5px}
  .proof-row b{font-size:17px}
  .proof-row span{font-size:9px}
  .hero-visual{padding:12px}
  .chart-card{height:160px}
  .section-heading h2{font-size:25px}
  .final-card{padding-inline:14px}
  .modal-card{padding-inline:14px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .modal-orbit:before{animation:none}
  *{transition-duration:.01ms!important}
}