:root {
  --blue:#0052CD; --blue-dk:#003A99; --blue-lt:#E8EFFC; --blue-hl:#F4F8FF; --blue-4:#F4F8FF;
  --ink:#191919; --ink-2:#555E6C; --ink-3:#8A93A0;
  --line:#E8E8E8; --line-dk:#5E5E5E;
  --white:#FFFFFF; --bg:#FFFFFF; --bg-soft:#FAFAFA; --surface:#F8FAFC; --black:#1A1A1A;
  --green:#10B981; --green-lt:#ECFDF5; --red:#DC2626; --red-lt:#FEF2F2;
  --gold:#F59E0B; --gold-lt:#FFFBEB;
  --nav-h:68px; --home-max-w:1280px; --radius-l:16px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
}
.container { max-width:var(--home-max-w); margin:0 auto; padding:0 32px; }
.section { padding:100px 0; }
.section-soft { background:var(--bg-soft); }
.eyebrow { font-size:13px; font-weight:700; letter-spacing:4px; color:var(--blue); text-transform:uppercase; margin-bottom:16px; }
.section-title { font-size:44px; font-weight:800; line-height:1.2; margin-bottom:16px; }
.section-subtitle { font-size:18px; color:var(--ink-2); margin-bottom:48px; max-width:800px; }

/* ─── HERO ─── */
.hero { padding:calc(var(--nav-h) + 80px) 0 80px; background:linear-gradient(180deg,white 0%,var(--blue-hl) 100%); }
.hero-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; }
.tagline-badge { display:inline-flex; align-items:center; gap:8px; background:var(--blue-lt); color:var(--blue); padding:8px 16px; border-radius:100px; font-size:13px; font-weight:600; letter-spacing:1px; margin-bottom:28px; }
.tagline-badge::before { content:"✦"; }
.hero h1 { font-size:54px; line-height:1.15; font-weight:800; margin-bottom:24px; letter-spacing:-.5px; }
.hero h1 .accent { color:var(--blue); }
.hero h1 .strike { display:block; font-size:34px; color:var(--ink-2); font-weight:600; margin-top:12px; }
.hero-sub { font-size:18px; color:var(--ink-2); line-height:1.7; margin-bottom:24px; max-width:560px; }
.trust-line { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:36px; font-size:14px; color:var(--ink-3); }
.trust-line span { display:inline-flex; align-items:center; gap:6px; }
.trust-line span::before { content:"✕"; color:var(--red); font-weight:700; }
.cta-row { display:flex; gap:16px; flex-wrap:wrap; }
.home-btn-primary, .btn-secondary { display:inline-flex; align-items:center; gap:8px; padding:16px 28px; border-radius:8px; font-weight:600; text-decoration:none; font-size:15px; transition:all .2s; }
.home-btn-primary { background:var(--blue); color:white; }
.home-btn-primary:hover { background:var(--blue-dk); transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,82,205,.25); }
.btn-secondary { background:white; color:var(--ink); border:1px solid var(--line); }
.btn-secondary:hover { border-color:var(--blue); color:var(--blue); }
/* hero visual - real GSC screenshot */
.hero-visual { background:white; border:1px solid var(--line); border-radius:16px; padding:16px; box-shadow:0 12px 40px rgba(0,82,205,.1); }
.hero-visual-header { display:flex; justify-content:space-between; align-items:center; padding:6px 8px 14px; }
.hero-visual-header strong { font-size:13px; }
.hero-visual-tag { font-size:11px; color:var(--ink-3); }
.hero-visual-tag::before { content:"●"; color:var(--green); margin-right:6px; }
.hero-visual img { width:100%; border-radius:8px; display:block; border:1px solid var(--line); }
.hero-visual-cap { font-size:11px; color:var(--ink-3); text-align:center; padding-top:10px; font-style:italic; }
.platform-icons { display:flex; gap:8px; flex-wrap:wrap; padding-top:14px; margin-top:8px; border-top:1px solid var(--line); }
.platform-icons span { font-size:11px; color:var(--ink-3); padding:4px 10px; background:var(--bg-soft); border-radius:4px; }

/* slogan */
.slogan-banner { background:var(--bg-soft); padding:60px 0; text-align:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.slogan-main { font-size:32px; font-weight:800; margin-bottom:12px; letter-spacing:4px; }
.slogan-main span { color:var(--blue); }
.slogan-sub { font-size:16px; color:var(--ink-2); font-style:italic; max-width:760px; margin:0 auto; }

/* pain */
.warning-headline { font-size:46px; line-height:1.2; font-weight:800; text-align:center; margin:0 auto 24px; max-width:1000px; }
.warning-headline .red { color:var(--red); }
.pain-story { background:white; border-left:4px solid var(--red); padding:32px 40px; max-width:820px; margin:48px auto; border-radius:0 12px 12px 0; box-shadow:0 4px 20px rgba(0,0,0,.04); }
.pain-story p { font-size:16px; line-height:1.85; color:var(--ink-2); margin-bottom:12px; }
.pain-story p strong { color:var(--ink); }
.pain-story p:last-child { margin-bottom:0; font-style:italic; color:var(--blue); font-weight:500; }
.compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:1100px; margin:0 auto; }
.compare-card { border-radius:12px; padding:32px; border:1px solid var(--line); }
.compare-card.bad { background:var(--red-lt); border-color:#FCA5A5; }
.compare-card.good { background:var(--green-lt); border-color:#6EE7B7; }
.compare-card h4 { font-size:18px; margin-bottom:20px; display:flex; align-items:center; gap:10px; }
.compare-card.bad h4::before { content:"🔴"; }
.compare-card.good h4::before { content:"🟢"; }
.compare-card ul { list-style:none; }
.compare-card li { font-size:14px; color:var(--ink-2); padding:10px 0; border-bottom:1px solid rgba(0,0,0,.05); display:flex; justify-content:space-between; }
.compare-card li:last-child { border-bottom:none; }
.compare-card li strong { color:var(--ink); }

/* purpose cards */
.purpose-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.purpose-card { background:white; border:1px solid var(--line); border-radius:16px; padding:36px 32px; transition:all .3s; }
.purpose-card:hover { border-color:var(--blue); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,82,205,.1); }
.purpose-card.featured { background:var(--blue-lt); border-color:var(--blue); border-width:2px; }
.purpose-num { font-size:14px; font-weight:700; letter-spacing:3px; color:var(--blue); margin-bottom:8px; }
.purpose-title { font-size:22px; font-weight:700; margin-bottom:16px; }
.purpose-people, .purpose-can-do { margin-top:20px; }
.purpose-people h5, .purpose-can-do h5 { font-size:12px; color:var(--ink-3); letter-spacing:2px; text-transform:uppercase; margin-bottom:10px; font-weight:600; }
.purpose-card ul { list-style:none; padding:0; }
.purpose-card li { font-size:14px; line-height:1.7; color:var(--ink-2); padding-left:16px; position:relative; margin-bottom:8px; }
.purpose-card li::before { content:"—"; position:absolute; left:0; color:var(--blue); }

/* inline CTA */
.inline-cta { margin-top:40px; background:white; border:1px solid var(--line); border-radius:12px; padding:24px 32px; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.inline-cta.tinted { background:var(--blue-lt); border-color:var(--blue); }
.inline-cta .ic-text strong { display:block; font-size:16px; color:var(--ink); margin-bottom:4px; }
.inline-cta .ic-text span { font-size:13px; color:var(--ink-2); }
.inline-cta .btn-mini { display:inline-flex; align-items:center; gap:6px; padding:10px 20px; background:var(--blue); color:white; text-decoration:none; border-radius:6px; font-weight:600; font-size:13px; white-space:nowrap; transition:all .2s; }
.inline-cta .btn-mini:hover { background:var(--blue-dk); transform:translateY(-1px); }

/* defense */
.defense-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:48px; }
.defense-card { background:white; border-radius:12px; padding:24px; border:1px solid var(--line); }
.defense-card .icon-badge { font-size:28px; margin-bottom:12px; display:block; }
.defense-card .when { display:inline-block; background:var(--blue); color:white; padding:4px 10px; border-radius:4px; font-size:11px; font-weight:600; letter-spacing:1px; margin-bottom:16px; }
.defense-card h4 { font-size:17px; font-weight:700; margin-bottom:14px; }
.defense-card p { font-size:13px; color:var(--ink-2); line-height:1.7; margin-bottom:12px; }
.defense-card .real-data { background:var(--green-lt); border-left:3px solid var(--green); padding:12px; border-radius:4px; font-size:12px; color:#065F46; }
.defense-card .real-data strong { color:var(--green); }
.persona-strip { background:var(--bg-soft); border-radius:16px; padding:40px; margin-top:48px; display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.persona { padding:16px; background:white; border-radius:8px; border:1px solid var(--line); }
.persona .role { font-size:11px; font-weight:700; letter-spacing:1px; color:var(--blue); margin-bottom:6px; }
.persona .who { font-size:14px; font-weight:600; margin-bottom:8px; }
.persona .quote { font-size:12px; color:var(--ink-2); font-style:italic; line-height:1.5; }
.persona .quote::before { content:"「"; color:var(--blue); }
.persona .quote::after { content:"」"; color:var(--blue); }

/* differences */
.diff-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.diff-card { background:white; border-radius:12px; padding:24px; border:1px solid var(--line); transition:all .2s; }
.diff-card:hover { border-color:var(--blue); transform:translateY(-2px); }
.diff-card.featured { background:var(--gold-lt); border-color:var(--gold); }
.diff-card.new-badge { position:relative; }
.diff-card.new-badge::before { content:"NEW"; position:absolute; top:-8px; right:16px; background:var(--blue); color:white; font-size:10px; font-weight:700; padding:4px 8px; border-radius:4px; letter-spacing:1px; }
.diff-num { font-size:13px; font-weight:700; color:var(--blue); letter-spacing:2px; margin-bottom:8px; }
.diff-card.featured .diff-num { color:var(--gold); }
.diff-card h4 { font-size:17px; font-weight:700; margin-bottom:8px; }
.diff-card .short { font-size:13px; color:var(--blue); font-weight:600; margin-bottom:12px; }
.diff-card.featured .short { color:var(--gold); }
.diff-card p { font-size:12px; color:var(--ink-2); line-height:1.6; }
.deep-dive { margin-top:64px; display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.deep-dive-card { background:white; border-radius:16px; padding:36px; border:1px solid var(--line); }
.deep-dive-card.highlight { background:var(--blue-lt); border-color:var(--blue); border-width:2px; }
.deep-dive-card h3 { font-size:22px; margin-bottom:12px; }
.deep-dive-card .meta { font-size:12px; color:var(--blue); font-weight:600; letter-spacing:2px; margin-bottom:16px; }
.steps-list { list-style:none; counter-reset:step; }
.steps-list li { counter-increment:step; padding:14px 0 14px 48px; position:relative; border-bottom:1px solid var(--line); }
.steps-list li:last-child { border-bottom:none; }
.steps-list li::before { content:counter(step,decimal-leading-zero); position:absolute; left:0; top:14px; background:var(--blue); color:white; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; }
.steps-list li strong { display:block; font-size:14px; margin-bottom:4px; }
.steps-list li span { font-size:12px; color:var(--ink-2); }

/* image figure (embedded screenshots) */
.fig { background:white; border:1px solid var(--line); border-radius:12px; overflow:hidden; box-shadow:0 8px 30px rgba(0,0,0,.06); margin:24px 0; }
.fig img { width:100%; display:block; }
.fig .cap { padding:12px 16px; font-size:12px; color:var(--ink-3); font-style:italic; text-align:center; border-top:1px solid var(--line); background:var(--bg-soft); }
.fig-label { display:inline-block; font-size:11px; font-weight:700; letter-spacing:2px; color:var(--blue); text-transform:uppercase; margin-bottom:12px; }
.two-fig { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:24px 0; }

/* funnel */
.funnel-section { background:white; }
.funnel-stages { display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:48px; }
.funnel-stage { padding:32px 24px; border-right:1px solid var(--line); }
.funnel-stage:last-child { border-right:none; }
.stage-badge { display:inline-block; background:var(--blue); color:white; padding:4px 10px; border-radius:4px; font-size:11px; font-weight:700; letter-spacing:1px; margin-bottom:12px; }
.stage-name { font-size:18px; font-weight:700; margin-bottom:4px; }
.stage-desc { font-size:13px; color:var(--ink-3); margin-bottom:16px; }
.stage-share { font-size:32px; font-weight:800; color:var(--blue); margin-bottom:4px; }
.stage-share-label { font-size:11px; color:var(--ink-3); margin-bottom:16px; }
.stage-list { list-style:none; padding:0; font-size:12px; }
.stage-list li { padding:6px 0; color:var(--ink-2); border-bottom:1px dashed var(--line); }
.stage-list li:last-child { border-bottom:none; }
.stage-list li strong { color:var(--ink); }
.method-benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:48px; }

/* case */
.case-overview-table { width:100%; border-collapse:collapse; margin-top:32px; background:white; border-radius:12px; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,.04); }
.case-overview-table thead { background:var(--blue); color:white; }
.case-overview-table th { padding:16px; text-align:left; font-size:13px; font-weight:700; letter-spacing:1px; }
.case-overview-table td { padding:16px; border-bottom:1px solid var(--line); font-size:14px; }
.case-overview-table tbody tr:last-child td { border-bottom:none; }
.case-overview-table tbody tr:hover { background:var(--blue-hl); }
.case-overview-table .case-name { font-weight:700; color:var(--blue); }
.case-block { padding:80px 0; border-bottom:1px solid var(--line); }
.case-block:last-child { border-bottom:none; }
.case-header { display:flex; align-items:baseline; gap:16px; margin-bottom:8px; }
.case-num { background:var(--blue); color:white; padding:6px 14px; border-radius:4px; font-size:12px; font-weight:700; letter-spacing:2px; }
.case-title { font-size:36px; font-weight:800; margin:12px 0; }
.case-sub { font-size:16px; color:var(--ink-2); margin-bottom:32px; }
.case-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:32px 0; }
.stat-card { background:white; border:1px solid var(--line); border-radius:12px; padding:24px; }
.stat-card.highlight { background:var(--blue-lt); border-color:var(--blue); }
.stat-value { font-size:36px; font-weight:800; color:var(--blue); margin-bottom:4px; line-height:1; }
.stat-label { font-size:12px; color:var(--ink-2); }
.case-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:32px; margin:32px 0; align-items:start; }
.case-phases { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px; }
.phase-card { background:white; border:1px solid var(--line); border-radius:12px; padding:24px; }
.phase-card .phase-tag { background:var(--blue); color:white; padding:4px 10px; border-radius:4px; font-size:11px; font-weight:700; letter-spacing:1px; display:inline-block; margin-bottom:8px; }
.phase-card .phase-month { font-size:11px; color:var(--gold); font-weight:700; margin-bottom:12px; }
.phase-card h4 { font-size:16px; font-weight:700; margin-bottom:12px; }
.phase-card ul { list-style:none; padding:0; font-size:13px; }
.phase-card ul li { padding:4px 0; color:var(--ink-2); padding-left:14px; position:relative; }
.phase-card ul li::before { content:"·"; position:absolute; left:0; color:var(--blue); font-weight:700; }
.phase-card .phase-result { background:var(--green-lt); border-radius:4px; padding:8px 12px; margin-top:12px; font-size:12px; color:#065F46; }
.phase-card .phase-result strong { color:var(--green); }
.country-strip { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; padding:20px; background:var(--bg-soft); border-radius:12px; align-items:center; }
.country { font-size:13px; color:var(--ink-2); padding:6px 14px; background:white; border-radius:100px; border:1px solid var(--line); }
.country strong { color:var(--blue); }
.ai-platforms { display:grid; gap:16px; margin-top:24px; }
.ai-row { display:grid; grid-template-columns:140px 1fr auto; background:white; border:1.5px solid var(--blue); border-radius:12px; padding:20px 24px; align-items:center; }
.ai-platform-name { font-size:16px; font-weight:700; }
.ai-data { display:flex; align-items:center; gap:16px; }
.ai-from { color:var(--ink-3); }
.ai-to { font-size:26px; font-weight:800; color:var(--blue); }
.ai-to-text { font-size:18px; }
.ai-pct { background:var(--green); color:white; padding:6px 16px; border-radius:4px; font-size:13px; font-weight:700; }
.competitor-table { width:100%; border-collapse:collapse; margin-top:32px; background:white; border-radius:12px; overflow:hidden; border:1px solid var(--line); }
.competitor-table thead { background:var(--blue); color:white; }
.competitor-table th { padding:14px; text-align:left; font-size:13px; }
.competitor-table th:not(:first-child) { text-align:center; }
.competitor-table td { padding:14px; border-bottom:1px solid var(--line); font-size:14px; }
.competitor-table td:not(:first-child) { text-align:center; }
.competitor-table tr.you td { background:var(--gold-lt); font-weight:700; }
.competitor-table tr.you td:first-child { color:var(--gold); }
.competitor-table tr:last-child td { border-bottom:none; }

/* VS */
.vs-table { width:100%; border-collapse:collapse; background:white; border-radius:12px; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,.04); margin-top:32px; }
.vs-table thead th { background:var(--blue); color:white; padding:16px; font-size:14px; text-align:left; }
.vs-table tbody td { padding:16px; border-bottom:1px solid var(--line); font-size:14px; }
.vs-table tbody tr td:first-child { font-weight:700; color:var(--ink); width:25%; }
.vs-table tbody tr td:nth-child(2) { background:var(--blue-hl); color:var(--blue); font-weight:600; }
.vs-table tbody tr td:nth-child(3) { color:var(--ink-2); }
.vs-table tbody tr:last-child td { border-bottom:none; }

/* FAQ */
.faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:40px; }
.faq-item { background:white; border:1px solid var(--line); border-radius:12px; padding:24px 28px; transition:all .2s; }
.faq-item:hover { border-color:var(--blue); box-shadow:0 8px 24px rgba(0,82,205,.06); }
.faq-q { display:flex; align-items:flex-start; gap:12px; font-size:16px; font-weight:700; color:var(--ink); margin-bottom:12px; line-height:1.5; }
.faq-q::before { content:"Q"; flex-shrink:0; background:var(--blue); color:white; width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; }
.faq-a { font-size:14px; color:var(--ink-2); line-height:1.75; }
.faq-a strong { color:var(--blue); }
.faq-a ul { margin:8px 0 8px 16px; padding-left:4px; }
.faq-a ul li { margin-bottom:4px; font-size:13px; }
.faq-warn { margin-top:10px; padding:8px 12px; background:var(--red-lt); border-left:3px solid var(--red); font-size:12px; color:var(--red); font-style:italic; border-radius:4px; }
.faq-item-process { grid-column:1 / -1; }
.faq-process-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; margin-top:8px; }
.faq-process-step { min-width:0; padding:16px; background:var(--blue-lt); border:1px solid rgba(0,82,205,.08); border-radius:8px; text-align:center; }
.faq-process-step > strong { display:block; color:var(--blue); font-size:13px; margin-bottom:6px; }
.faq-process-name { color:var(--ink); font-size:13px; font-weight:700; margin-bottom:4px; }
.faq-process-desc { color:var(--ink-3); font-size:11px; line-height:1.65; overflow-wrap:anywhere; }
.faq-process-note { margin-top:16px; color:var(--ink-3); font-size:13px; font-style:italic; }
.faq-bottom-cta { margin-top:40px; text-align:center; padding:32px; background:var(--bg-soft); border-radius:12px; }
.faq-bottom-cta p { font-size:15px; color:var(--ink-2); margin-bottom:16px; }

/* final CTA */
.final-cta-wrapper { background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dk) 100%); color:white; padding:100px 0; }
.final-cta-header { text-align:center; margin-bottom:48px; }
.final-cta-header h2 { font-size:44px; margin-bottom:16px; line-height:1.2; }
.final-cta-header .sub { font-size:18px; opacity:.9; margin-bottom:12px; }
.final-cta-header .promise-tag { display:inline-block; padding:6px 16px; border-radius:100px; background:rgba(255,255,255,.15); font-size:13px; letter-spacing:1px; }
.value-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:960px; margin:0 auto 48px; }
.value-card { background:rgba(255,255,255,.08); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.18); border-radius:12px; padding:28px; }
.value-card .icon { font-size:28px; margin-bottom:12px; }
.value-card h4 { font-size:17px; margin-bottom:10px; font-weight:700; }
.value-card p { font-size:13px; opacity:.85; line-height:1.6; }
.contact-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:32px; max-width:1100px; margin:0 auto; }
.contact-form-card { background:white; color:var(--ink); border-radius:16px; padding:36px; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.contact-form-card h3 { font-size:22px; margin-bottom:8px; }
.contact-form-card .form-sub { font-size:13px; color:var(--ink-3); margin-bottom:24px; }
.form-row { margin-bottom:16px; }
.form-row label { display:block; font-size:12px; font-weight:600; color:var(--ink-2); margin-bottom:6px; letter-spacing:.5px; }
.form-row input, .form-row select, .form-row textarea { width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:6px; font-size:14px; color:var(--ink); background:white; font-family:inherit; transition:border .2s; }
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 3px var(--blue-lt); }
.form-row textarea { resize:vertical; min-height:80px; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-submit { width:100%; padding:14px; background:var(--blue); color:white; border:none; border-radius:6px; font-size:15px; font-weight:700; cursor:pointer; transition:background .2s; margin-top:8px; }
.form-submit:hover { background:var(--blue-dk); }
.form-foot { font-size:11px; color:var(--ink-3); text-align:center; margin-top:14px; }
.form-foot::before { content:"🔒 "; }
.contact-side { display:flex; flex-direction:column; gap:16px; }
.qr-card { background:white; color:var(--ink); border-radius:16px; padding:28px; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.qr-card img { width:180px; height:180px; margin:0 auto 16px; display:block; border-radius:8px; border:1px solid var(--line); }
.qr-card .qr-title { font-size:15px; font-weight:700; margin-bottom:4px; }
.qr-card .qr-sub { font-size:12px; color:var(--ink-3); }
.contact-method { background:rgba(255,255,255,.08); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.18); border-radius:12px; padding:16px 20px; display:flex; align-items:center; gap:14px; text-decoration:none; color:white; transition:all .2s; }
.contact-method:hover { background:rgba(255,255,255,.15); transform:translateX(4px); }
.contact-method .cm-icon { font-size:22px; }
.contact-method .cm-content strong { display:block; font-size:14px; margin-bottom:2px; }
.contact-method .cm-content span { font-size:12px; opacity:.85; }
.promise-bar { margin-top:48px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1100px; margin-left:auto; margin-right:auto; padding-top:48px; border-top:1px solid rgba(255,255,255,.18); }
.promise-item { display:flex; align-items:flex-start; gap:12px; }
.promise-item .pi-icon { font-size:24px; flex-shrink:0; }
.promise-item strong { display:block; font-size:14px; margin-bottom:4px; }
.promise-item span { font-size:12px; opacity:.85; line-height:1.5; }

@media (max-width:968px) {

  .hero-grid, .case-grid, .deep-dive, .two-fig { grid-template-columns:1fr; }
  .compare-grid, .purpose-tabs, .case-stats, .case-phases, .contact-grid, .value-cards, .promise-bar, .faq-grid { grid-template-columns:1fr; }
  .faq-item-process { grid-column:auto; }
  .faq-process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .defense-grid, .diff-grid, .funnel-stages, .persona-strip { grid-template-columns:repeat(2,1fr); }
  .hero h1 { font-size:36px; } .hero h1 .strike { font-size:24px; }
  .section-title, .warning-headline { font-size:30px; }

}

@media (max-width:600px) {
  /* Keep every homepage section on the same mobile content line. */
  .container { width:100%; max-width:none; padding-left:20px; padding-right:20px; }
  .section { padding:64px 0; }
  .hero { padding-top:calc(var(--nav-h) + 48px); padding-bottom:56px; }
  .slogan-banner { padding:48px 0; }
  .section-subtitle { margin-bottom:32px; }

  /* Two-column tablet layouts become too narrow on phones. */
  .defense-grid,
  .diff-grid,
  .persona-strip,
  .method-benefit-grid { grid-template-columns:minmax(0,1fr); }

  .persona-strip {
    width:100%;
    margin-top:32px;
    padding:16px;
    gap:12px;
  }
  .persona { min-width:0; padding:16px; }

  .funnel-stages { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:32px; }
  .funnel-stage {
    min-width:0;
    padding:18px 14px;
    border:1px solid var(--line);
    border-radius:10px;
  }
  .funnel-stage:first-child,
  .funnel-stage:last-child { padding-top:18px; padding-bottom:18px; border:1px solid var(--line); }
  .stage-share { font-size:26px; }
  .stage-list,
  .stage-list li { min-width:0; overflow-wrap:anywhere; }

  .method-benefit-grid { gap:12px; margin-top:32px; }

  .fig,
  .fig img,
  .hero-visual,
  .case-overview-table,
  .competitor-table { max-width:100%; min-width:0; }
  .fig-label { max-width:100%; overflow-wrap:anywhere; }
  .two-fig,
  .case-grid,
  .deep-dive { width:100%; min-width:0; }

  .ai-platforms { min-width:0; gap:12px; }
  .ai-row { grid-template-columns:minmax(0,1fr); gap:10px; min-width:0; width:100%; padding:16px 18px; align-items:start; }
  .ai-platform-name { min-width:0; overflow-wrap:anywhere; }
  .ai-data { min-width:0; width:100%; gap:8px; flex-wrap:wrap; }
  .ai-to { font-size:22px; line-height:1.3; overflow-wrap:anywhere; }
  .ai-to-text { font-size:17px; }
  .ai-pct { justify-self:start; max-width:100%; padding:5px 12px; white-space:normal; overflow-wrap:anywhere; }
  .faq-grid { grid-template-columns:minmax(0,1fr); gap:12px; margin-top:28px; }
  .faq-item { min-width:0; padding:20px 18px; }
  .faq-q { gap:10px; font-size:15px; }
  .faq-q::before { width:24px; height:24px; }
  .faq-process-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
  .faq-process-step { padding:14px 16px; text-align:left; }
  .faq-process-step > strong { margin-bottom:4px; }
  .faq-process-desc br { display:none; }
  .faq-process-note { margin-top:14px; line-height:1.7; }
}