/* ===========================================================
   GeoSynap — 首页 (index.html) 区块样式
   ===========================================================
   本文件移植自 Anthropic Design handoff（tmp/seo-geo/project/seo-geo.css），
   覆盖 Hero / Engine Ticker / Status Report (WhyNow) / Compare (Definition)
   / Capabilities (Service) / GEO Deep Dive / Use Cases / FAQ / CTA Strip
   九个区块的样式 + 末尾「SIZE BUMP」全局放大覆写。

   响应式策略：
     - 流式：clamp() で字号 / padding を vw に追従させる
     - 断点：末尾「RESPONSIVE」セクションに 1024/960/768/540/420px の @media を集約
       （PR #2 round1 review #1 対応、当初の「@media なし」設計を撤回）
   ticker-rail 动画依赖 HTML 里手工复制 3 份相同 cell，translate3d(-33.3333%) 闭合循环。
   ============================================================ */

/* ============ HERO ============ */
.hero {
  padding: 0;
  border-bottom: 1px solid var(--ink);
  background: var(--bg);
  position: relative;
  overflow: hidden;
}
.hero::before {
  /* faint scanlines */
  content: ''; position: absolute; inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(10,10,10,0.015) 0 1px, transparent 1px 4px);
  pointer-events: none;
}

.hero-body {
  padding: 56px 56px 44px;
  position: relative;
  border-bottom: 1px solid var(--ink);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero-title-row {
  display: grid;
  grid-template-columns: auto auto auto;
  align-items: end;
  gap: clamp(32px, 4.5vw, 72px);
  margin: 24px 0 8px;
}

.hero-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  padding-bottom: 14px;
  align-self: stretch;
  justify-content: flex-end;
}
.hero-brand-mark {
  width: 56px; height: 56px;
  color: var(--ink);
  display: block;
}
.hero-brand-wordmark {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hero-brand-wordmark .name {
  font-family: var(--en);
  font-weight: 700;
  font-size: 28px;
  letter-spacing: -0.01em;
  color: var(--ink);
  line-height: 1;
}
.hero-brand-wordmark .name .ai {
  color: var(--teal-3);
  margin-left: 4px;
  font-weight: 700;
}
.hero-brand-wordmark .tagline {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  font-weight: 600;
  font-family: var(--mono);
}

.hero-lock {
  font-family: var(--en); font-weight: 700;
  font-size: clamp(108px, 11vw, 168px);
  line-height: 0.86; letter-spacing: -0.04em;
  color: var(--ink);
  margin: 0;
  position: relative;
}
.hero-lock .lock-geo {
  display: block;
  color: var(--teal-3);
  position: relative;
}
.hero-lock .lock-geo::before {
  content: '×'; position: absolute; left: -0.5em; top: 0.18em;
  font-size: 0.35em; color: var(--ink-3); font-weight: 500;
  letter-spacing: 0;
}
.hero-right-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 36px;
  min-width: 0;
  padding-bottom: 8px;
  align-self: stretch;
}
.hero-jp-pitch {
  font-size: clamp(48px, 5.2vw, 80px);
  font-weight: 700; line-height: 1.18;
  letter-spacing: 0.005em; color: var(--ink);
  margin: 0;
}
.hero-jp-pitch .em.solid {
  display: inline-block;
  margin-top: 12px;
}
.hero-jp-pitch .em {
  background: linear-gradient(transparent 65%, var(--teal-light) 65%);
  padding: 0 4px;
}
.hero-jp-pitch .em.solid {
  background: var(--teal); color: var(--paper);
  padding: 2px 14px 6px;
}

.hero-desc {
  font-size: clamp(15px, 1.18vw, 17px);
  line-height: 1.95; color: var(--ink-2);
  margin: 0;
  font-weight: 500;
  font-feature-settings: "palt" 1;
}
.brief-em {
  font-style: normal;
  font-weight: 700;
  color: var(--ink);
  background: linear-gradient(transparent 65%, var(--teal-light) 65%);
  padding: 0 2px;
}

/* ============ Engine Ticker — scrolling LLM monitor ============
   rail 在 HTML 里手工复制 3 份 cell；动画用 translate3d(-33.3333%) 形成无缝循环
   ============================================================ */
.engine-ticker {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
  overflow: hidden;
  position: relative;
}
.ticker-track {
  overflow: hidden;
  position: relative;
  mask-image: linear-gradient(to right, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
}
.ticker-rail {
  display: flex;
  width: max-content;
  animation: ticker-scroll 48s linear infinite;
}
.ticker-rail:hover { animation-play-state: paused; }
@keyframes ticker-scroll {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-33.3333%, 0, 0); }
}
.ticker-cell {
  display: flex; align-items: center; gap: 16px;
  padding: 22px 36px;
  font-family: var(--mono);
  flex-shrink: 0;
}
.ticker-cell .glyph {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--ink-2);
  flex-shrink: 0;
}
.ticker-cell .glyph svg {
  width: 22px; height: 22px;
}
.ticker-cell .name {
  font-size: 15px; font-weight: 600; color: var(--ink);
  letter-spacing: 0.01em;
  min-width: 96px;
  font-family: var(--sans, inherit);
}
.ticker-cell .bars {
  display: flex; align-items: flex-end; gap: 3px; height: 22px;
}
.ticker-cell .bars span {
  width: 3px; background: var(--teal); display: block;
  transform-origin: bottom;
  animation: bar-pulse 1.6s ease-in-out infinite;
}
.ticker-cell .bars span:nth-child(1) { height: 30%;  animation-delay: 0s;    }
.ticker-cell .bars span:nth-child(2) { height: 55%;  animation-delay: 0.14s; }
.ticker-cell .bars span:nth-child(3) { height: 45%;  animation-delay: 0.28s; }
.ticker-cell .bars span:nth-child(4) { height: 80%;  animation-delay: 0.42s; }
.ticker-cell .bars span:nth-child(5) { height: 100%; animation-delay: 0.56s; }
@keyframes bar-pulse {
  0%, 100% { transform: scaleY(0.55); }
  50%      { transform: scaleY(1);    }
}
.ticker-cell .pct {
  font-size: 14px; font-weight: 700;
  letter-spacing: 0.02em;
  min-width: 56px; text-align: right;
}
.ticker-cell .pct.up { color: var(--teal-text); }  /* AA contrast 14px bold */
.ticker-cell .pct.dn { color: var(--ink-3); }

.hero-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 56px 24px 64px;
  background: var(--paper);
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 22px 44px;
  background: var(--ink);
  color: var(--paper);
  text-decoration: none;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.02em;
  border-radius: 999px;
  transition: transform 0.25s ease, background 0.25s ease;
}
.hero-cta:hover { transform: translateY(-2px); background: var(--teal-3); }
.hero-cta .arr {
  font-family: var(--en); font-size: 20px; color: var(--teal);
  transition: transform 0.25s ease;
}
.hero-cta:hover .arr { transform: translateX(4px); }
.hero-bottom-note {
  margin: 0;
  font-size: 13px;
  color: var(--ink-3);
  letter-spacing: 0.02em;
}

/* ============ WHY NOW — Status Report ============
   4 cell metric 网格；每格上沿 teal 标记 + 等宽 META 行
   ============================================================ */
.why {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}
.why-intro {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px;
  margin-bottom: 56px;
}
.why-intro .head {
  position: relative;
  /* analyst_note 装饰已移除，head 不再需要左边竖条；下方 SIZE BUMP 区块会再覆写 padding-left */
}
.why-intro h3 {
  font-size: 30px; font-weight: 900; line-height: 1.4;
  letter-spacing: 0.005em;
}
.why-intro h3 .em {
  background: linear-gradient(transparent 65%, var(--teal-light) 65%);
}
.why-intro p {
  font-size: 14px; color: var(--ink-2); line-height: 2;
}

.stat-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border: 1px solid var(--ink);
  background: var(--paper);
}
.stat-cell {
  padding: 28px 24px 24px;
  border-right: 1px solid var(--line);
  position: relative;
  display: flex; flex-direction: column;
  min-height: 240px;
}
.stat-cell:last-child { border-right: none; }
.stat-cell::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 28px; height: 6px; background: var(--teal);
}
.stat-cell .meta {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--mono); font-size: 10px; color: var(--ink-3);
  letter-spacing: 0.12em; margin-bottom: 12px;
}
.stat-cell .meta .id { color: var(--teal-text); font-weight: 700; }  /* WCAG AA: 0e5f63 on white = 7.1:1 */
.stat-cell .label {
  font-size: 12px; font-weight: 700; color: var(--ink-2);
  letter-spacing: 0.04em;
  margin-bottom: 12px;
  font-family: var(--mono);
}
.stat-cell .num {
  font-family: var(--en); font-weight: 700;
  font-size: 76px; line-height: 0.95; color: var(--ink);
  letter-spacing: -0.03em;
  display: flex; align-items: baseline; gap: 2px;
}
.stat-cell .num .unit {
  font-size: 32px; color: var(--teal-3); font-weight: 600;
}
.stat-cell .delta {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  color: var(--teal-text); letter-spacing: 0.06em;  /* AA contrast (review #较低) */
  margin-top: 8px;
}
.stat-cell .desc {
  font-size: 12px; color: var(--ink-2); line-height: 1.85;
  margin-top: auto; padding-top: 16px;
  border-top: 1px dashed var(--line);
}
.stat-cell .src {
  font-family: var(--mono); font-size: 9px; color: var(--ink-3);  /* AA contrast：ink-4 (#9ca3af) 2.53 → ink-3 (#6b7280) 5.0 */
  letter-spacing: 0.06em; margin-top: 10px;
}

/* ============ COMPARE — Channel A/B spec sheet ============
   SEO（白卡）vs GEO（黑卡）两栏对比 + spec-table 4 行
   ============================================================ */
.compare-intro {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px;
  margin-bottom: 56px; align-items: start;
}
.compare-intro h3 {
  font-size: 28px; font-weight: 700; line-height: 1.5;
  letter-spacing: 0.005em;
}
.compare-intro h3 .em { color: var(--teal-3); }
.compare-intro p {
  font-size: 14px; color: var(--ink-2); line-height: 2;
}

.compare-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
.channel {
  position: relative;
  padding: 36px 32px 32px;
  border: 1px solid var(--ink);
  background: var(--paper);
  display: flex; flex-direction: column;
}
.channel.dark { background: var(--dark); color: var(--paper); border-color: var(--dark); }

.channel .ch-tag {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; color: var(--ink-3);
  margin-bottom: 16px;
}
.channel.dark .ch-tag { color: var(--ink-4); }
.channel .ch-tag .id { color: var(--ink); font-weight: 700; }
.channel.dark .ch-tag .id { color: var(--teal); }

.channel .ch-name {
  display: flex; align-items: baseline; gap: 14px;
  margin-bottom: 8px;
}
.channel .ch-name .lock {
  font-family: var(--en); font-weight: 700; font-size: 56px;
  letter-spacing: -0.01em; line-height: 1;
}
.channel.dark .ch-name .lock { color: var(--teal); }
.channel .ch-name .full {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.1em; color: var(--ink-3); text-transform: uppercase;
}
.channel.dark .ch-name .full { color: var(--teal-light); }

.channel .ch-jp {
  font-size: 18px; font-weight: 700; margin-bottom: 20px;
}
.channel .ch-body {
  font-size: 13px; line-height: 2; color: var(--ink-2);
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.channel.dark .ch-body { color: #c8d0d6; border-bottom-color: var(--dark-3); }

.spec-table {
  margin-top: auto;
}
.spec-table .row {
  display: grid; grid-template-columns: 110px 1fr;
  gap: 18px; padding: 14px 0;
  border-bottom: 1px solid var(--line-soft);
  font-size: 13px;
  align-items: center;
}
.channel.dark .spec-table .row { border-bottom-color: var(--dark-3); }
.spec-table .row:last-child { border-bottom: none; }
.spec-table .row .k {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.12em; color: var(--ink-3); font-weight: 600;
}
.channel.dark .spec-table .row .k { color: var(--teal-light); }
.spec-table .row .v { font-weight: 600; line-height: 1.7; }
.channel.dark .spec-table .row .v { color: var(--paper); }

/* ============ CAPABILITIES — Service module 2×2 grid ============
   4 个模块，第 3 个（GEO）标 .feat（teal 底 + DEEP DIVE 徽章）
   每卡含 FlowVisual：左侧输入 list → 中间引擎黑盒 → 右侧目标输出
   ============================================================ */
.cap {
  background: var(--paper);
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.cap-intro {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px;
  margin-bottom: 56px; align-items: start;
}
.cap-intro h3 {
  font-size: 30px; font-weight: 700; line-height: 1.45;
  letter-spacing: 0.005em;
}
.cap-intro h3 .sub-line {
  display: block; margin-top: 14px; padding-top: 14px;
  border-top: 1px solid var(--ink);
  font-size: 16px; color: var(--ink-2); font-weight: 500;
}
.cap-intro p {
  font-size: 14px; color: var(--ink-2); line-height: 2;
}

.cap-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border: 1px solid var(--ink);
}
.cap-card {
  padding: 36px 32px 32px;
  background: var(--paper);
  position: relative;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  display: flex; flex-direction: column;
  min-height: 480px;
}
.cap-card:nth-child(2n) { border-right: none; }
.cap-card:nth-last-child(-n+2) { border-bottom: none; }
.cap-card.feat { background: var(--teal-paler); }
.cap-card.feat::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 7px; height: 100%; background: var(--teal);
}

.cap-card .cap-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 28px; padding-bottom: 18px;
  border-bottom: 1px dashed var(--line);
}
.cap-card .cap-head .left .module {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.14em; color: var(--ink-3);
  margin-bottom: 8px;
}
.cap-card.feat .cap-head .left .module { color: var(--teal-text); }  /* AA contrast 10-12px */
.cap-card .cap-head .left .module .acc { color: var(--teal-text); font-weight: 700; }  /* AA contrast */
.cap-card .cap-head .left .cap-jp {
  font-size: 28px; font-weight: 900; color: var(--ink);
  letter-spacing: 0.005em; line-height: 1.15;
}
.cap-card .cap-head .num {
  font-family: var(--en); font-size: 36px; font-weight: 700;
  line-height: 1; color: var(--ink-3); letter-spacing: 0.02em;
}
.cap-card.feat .cap-head .num { color: var(--teal-3); }
.cap-card .feat-marker {
  position: absolute; top: 16px; right: 32px;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 9px; font-weight: 700;
  letter-spacing: 0.18em; color: var(--teal-text);  /* AA contrast 9px */
}
.cap-card .feat-marker .dot {
  width: 6px; height: 6px; background: var(--teal); border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(79,192,195,0.2);
}

.cap-card .cap-visual {
  flex: 1;
  background:
    linear-gradient(to right, var(--grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid) 1px, transparent 1px);
  background-size: 16px 16px;
  background-color: rgba(255,255,255,0.5);
  border: 1px dashed var(--line);
  padding: 24px 20px;
  margin-bottom: 24px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
  min-height: 200px;
}
.cap-card.feat .cap-visual { background-color: rgba(255,255,255,0.65); }

/* visual: 输入 list → 引擎 → 输出 goal */
.flow {
  display: grid; grid-template-columns: 1fr auto 1fr;
  gap: 14px; align-items: center; width: 100%;
}
.flow-list { display: flex; flex-direction: column; gap: 6px; }
.flow-list .item {
  border: 1px solid var(--ink); background: var(--paper);
  padding: 6px 10px;
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.04em;
  position: relative;
}
.flow-list .item::before {
  content: ''; position: absolute; left: -4px; top: 50%;
  transform: translateY(-50%);
  width: 6px; height: 6px; background: var(--teal);
}
.flow-arrow {
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 18px; color: var(--teal-3);
}
.flow-arrow .dots {
  display: flex; align-items: center; gap: 3px;
}
.flow-arrow .dots span {
  width: 4px; height: 4px; background: var(--teal); border-radius: 50%;
}
.flow-engine {
  background: var(--ink); color: var(--paper);
  padding: 16px 12px;
  text-align: center;
  font-family: var(--mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.04em;
  position: relative;
  display: flex; flex-direction: column; gap: 6px;
}
.flow-engine::before, .flow-engine::after {
  content: ''; position: absolute; width: 8px; height: 8px;
  border: 1.5px solid var(--teal);
}
.flow-engine::before { top: -4px; left: -4px; border-right: none; border-bottom: none; }
.flow-engine::after { bottom: -4px; right: -4px; border-left: none; border-top: none; }
.flow-engine .label {
  font-size: 11px; color: var(--teal);
  font-weight: 700; letter-spacing: 0.06em;
}
.flow-engine .sub {
  font-size: 9px; opacity: 0.7; font-weight: 500;
  letter-spacing: 0.06em;
}
.flow-goal {
  border: 1.5px solid var(--ink); background: var(--paper);
  padding: 12px 10px;
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  text-align: center; letter-spacing: 0.04em;
  line-height: 1.45;
  position: relative;
}
.flow-goal .arr {
  position: absolute; left: -12px; top: 50%; transform: translateY(-50%);
  font-size: 12px; color: var(--ink); background: var(--paper); padding: 0 2px;
}

.cap-card .cap-desc {
  font-size: 13px; color: var(--ink-2); line-height: 1.95;
  padding-top: 0;
}
.cap-card .cap-foot {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-top: 16px; padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.1em; color: var(--ink-3);
}
.cap-card .cap-foot .id { font-weight: 700; color: var(--ink); }

/* ============ GEO DEEP DIVE — 暗色区块 ============
   终端 mock 模拟 ChatGPT 引用 your-domain；5-step pipeline 横向 5 列
   ============================================================ */
.geo {
  background: var(--dark);
  color: var(--paper);
  position: relative;
  border-bottom: 1px solid var(--ink);
}
.geo::before {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(to right, rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
}
.geo > * { position: relative; }

.geo .sec-head {
  border-bottom-color: var(--paper);
}
.geo .sec-head h2, .geo .sec-head .num { color: var(--paper); }
.geo .sec-head .num .acc { color: var(--teal); }
.geo .sec-head h2 .jp { color: var(--ink-4); }
.geo .sec-head .coord { color: var(--ink-4); }
.geo .sec-head::before { background: var(--teal); }

.geo-intro {
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px;
  margin-bottom: 56px; align-items: end;
}
.geo-intro h3 {
  font-size: 42px; font-weight: 900; line-height: 1.3;
  letter-spacing: 0.005em;
}
.geo-intro h3 .accent { color: var(--teal); }
.geo-intro h3 .underline {
  background: linear-gradient(transparent 65%, rgba(79,192,195,0.35) 65%);
  padding: 0 2px;
}
.geo-intro p {
  font-size: 14px; color: #c8d0d6; line-height: 2;
}

/* mock split: 左说明 / 右终端 */
.geo-mock {
  display: grid; grid-template-columns: 1fr 1.1fr;
  border: 1px solid var(--dark-line);
  margin-bottom: 80px;
  background: var(--dark-2);
}
.geo-mock-left {
  padding: 40px 36px;
  border-right: 1px solid var(--dark-line);
}
.geo-mock-left .small-tag {
  font-family: var(--mono); font-size: 11px; color: var(--teal);
  letter-spacing: 0.16em; text-transform: uppercase;
  margin-bottom: 20px; font-weight: 600;
  display: flex; align-items: center; gap: 10px;
}
.geo-mock-left .small-tag::before {
  content: ''; width: 14px; height: 1px; background: var(--teal);
}
.geo-mock-left h4 {
  font-size: 24px; font-weight: 700; line-height: 1.55;
  letter-spacing: 0.005em; color: var(--paper);
}
.geo-mock-left h4 .em {
  background: var(--teal); color: var(--dark);
  padding: 0 8px;
}
.geo-mock-left p {
  font-size: 13px; color: #b8c1c8; line-height: 2;
  margin-top: 18px;
}

.geo-engines {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 28px;
}
.geo-eng {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 12px;
  background: transparent; border: 1px solid var(--dark-line);
  font-family: var(--mono); font-size: 11px; color: #c8d0d6;
  font-weight: 600; letter-spacing: 0.04em;
}
.geo-eng .dot { width: 6px; height: 6px; border-radius: 50%; background: #444; }
.geo-eng.on { background: var(--teal); color: var(--dark); border-color: var(--teal); }
.geo-eng.on .dot { background: var(--dark); }

.geo-term {
  background: var(--dark);
  display: flex; flex-direction: column;
}
.geo-term-bar {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--dark-line);
  font-family: var(--mono); font-size: 10px; color: #5d6770;
  letter-spacing: 0.06em;
}
.geo-term-bar .lights { display: flex; gap: 5px; }
.geo-term-bar .lights span { width: 8px; height: 8px; border-radius: 50%; }
.geo-term-bar .lights span:nth-child(1) { background: #FF5F57; }
.geo-term-bar .lights span:nth-child(2) { background: #FEBC2E; }
.geo-term-bar .lights span:nth-child(3) { background: #28C840; }
.geo-term-bar .ttl { color: #b8c4cc; font-weight: 500; flex: 1; }
.geo-term-bar .status-pill {
  font-family: var(--mono); font-size: 9px; color: var(--teal);
  letter-spacing: 0.1em; padding: 2px 8px; border: 1px solid var(--teal);
}

.geo-term-body {
  padding: 24px 24px 28px;
  font-family: var(--jp);
  font-size: 13px; color: #d6dde2; line-height: 2;
  flex: 1;
}
.geo-term-body .prompt {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border: 1px solid var(--dark-line);
  margin-bottom: 20px;
  font-family: var(--mono); font-size: 12px;
  color: var(--teal);
}
.geo-term-body .prompt::before {
  content: '$'; color: var(--teal); font-weight: 700;
}
.geo-term-body .ai-out {
  color: #e6ebef; line-height: 2;
}
.geo-term-body .cite {
  display: inline-block; background: var(--teal); color: var(--dark);
  font-family: var(--mono); font-size: 10px; padding: 1px 7px;
  margin: 0 3px; font-weight: 700; letter-spacing: 0.04em;
  vertical-align: 1px;
}
.geo-term-body .hl {
  background: rgba(79,192,195,0.18);
  border-bottom: 1px solid var(--teal);
  padding: 1px 2px;
}
.geo-term-body .sources {
  margin-top: 22px; padding-top: 16px;
  border-top: 1px dashed var(--dark-line);
  display: flex; flex-direction: column; gap: 8px;
}
.geo-term-body .sources .lbl {
  font-family: var(--mono); font-size: 9px; color: #5d6770;
  letter-spacing: 0.14em; margin-bottom: 4px;
}
.geo-term-body .sources .src {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--mono); font-size: 11px;
}
.geo-term-body .sources .src .n {
  background: var(--teal); color: var(--dark);
  padding: 2px 7px; font-weight: 700; font-size: 9px;
}
.geo-term-body .sources .src.you .url {
  color: var(--teal); font-weight: 600;
}
.geo-term-body .sources .src .url { color: #8b97a0; }

/* ============ PROCESS PIPELINE ============ */
.pipeline-head {
  display: grid; grid-template-columns: 1fr 1.3fr; gap: 64px;
  margin-bottom: 48px; align-items: end;
}
.pipeline-head .small-tag {
  font-family: var(--mono); font-size: 11px; color: var(--teal);
  letter-spacing: 0.16em; text-transform: uppercase;
  margin-bottom: 14px; font-weight: 600;
}
.pipeline-head h4 {
  font-size: 34px; font-weight: 900; line-height: 1.35;
  letter-spacing: 0.005em; color: var(--paper);
}
.pipeline-head h4 .em { color: var(--teal); }
.pipeline-head p {
  font-size: 13px; color: #b8c1c8; line-height: 2; padding-bottom: 6px;
}

.pipeline {
  display: grid; grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--dark-line);
  background: var(--dark-2);
  position: relative;
}
.pipeline::before {
  content: ''; position: absolute; top: 96px; left: 4%; right: 4%;
  height: 1px; background-image: repeating-linear-gradient(to right, var(--teal) 0 6px, transparent 6px 12px);
  z-index: 0;
}
.ppl-step {
  padding: 32px 18px 28px;
  border-right: 1px solid var(--dark-line);
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
}
.ppl-step:last-child { border-right: none; }
.ppl-step .ph {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: var(--teal); font-weight: 700;
  margin-bottom: 18px;
}
.ppl-step .node {
  width: 64px; height: 64px;
  background: var(--dark);
  border: 1.5px solid var(--teal);
  position: relative;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 18px;
}
.ppl-step.active .node { background: var(--teal); }
.ppl-step .node::before, .ppl-step .node::after {
  content: ''; position: absolute; width: 10px; height: 10px;
  border: 1.5px solid var(--teal);
}
.ppl-step .node::before { top: -4px; left: -4px; border-right: none; border-bottom: none; }
.ppl-step .node::after { bottom: -4px; right: -4px; border-left: none; border-top: none; }
.ppl-step .node .glyph {
  font-family: var(--en); font-weight: 700; font-size: 22px;
  color: var(--teal);
}
.ppl-step.active .node .glyph { color: var(--dark); }
.ppl-step .name-jp {
  font-size: 17px; font-weight: 700; color: var(--paper);
  margin-bottom: 4px;
}
.ppl-step .name-en {
  font-family: var(--mono); font-size: 10px; color: var(--ink-4);
  letter-spacing: 0.1em; text-transform: uppercase;
  margin-bottom: 16px;
}
.ppl-step .desc {
  font-size: 12px; color: #b8c1c8; line-height: 1.85;
}

/* ============ USE CASES ============
   4 张案例卡 2×2 网格；右侧 200px 数字 stat 块 + 双侧 teal 角标
   ============================================================ */
.uc {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}
.uc-intro {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  margin-bottom: 64px; align-items: start;
}
.uc-intro h3 {
  font-size: 28px; font-weight: 700; line-height: 1.55;
}
.uc-intro p {
  font-size: 14px; color: var(--ink-2); line-height: 2;
}

.uc-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  border: 1px solid var(--ink);
}
.uc-card {
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  background: var(--paper);
  padding: 32px 32px 28px;
  display: grid; grid-template-columns: 1fr 200px;
  gap: 24px; align-items: start;
  position: relative;
  transition: background 0.2s;
}
.uc-card:nth-child(2n) { border-right: none; }
.uc-card:nth-last-child(-n+2) { border-bottom: none; }
.uc-card:hover { background: var(--teal-paler); }

.uc-card .uc-meta {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.12em; color: var(--ink-3);
  margin-bottom: 14px;
  grid-column: 1 / -1;
}
.uc-card .uc-meta .id { color: var(--teal-text); font-weight: 700; }  /* AA contrast 11px bold */
.uc-card .uc-meta .date { color: var(--ink-2); }

.uc-card .uc-text { display: flex; flex-direction: column; gap: 14px; }
.uc-card .uc-title {
  font-size: 17px; font-weight: 700; line-height: 1.55;
  letter-spacing: 0.005em;
}
.uc-card .uc-desc {
  font-size: 13px; color: var(--ink-2); line-height: 1.9;
}
.uc-card .uc-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.uc-card .uc-tag {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.08em; padding: 3px 8px;
  border: 1px solid var(--line);
  color: var(--ink-2);
}
.uc-card .uc-tag.geo { background: var(--ink); color: var(--paper); border-color: var(--ink); }

.uc-card .uc-stat {
  background: var(--bg);
  border: 1px dashed var(--line);
  padding: 18px 16px;
  text-align: center;
  display: flex; flex-direction: column; gap: 4px;
  position: relative;
}
.uc-card .uc-stat::before, .uc-card .uc-stat::after {
  content: ''; position: absolute; width: 10px; height: 10px;
  border: 1.5px solid var(--teal);
}
.uc-card .uc-stat::before { top: -3px; left: -3px; border-right: none; border-bottom: none; }
.uc-card .uc-stat::after { bottom: -3px; right: -3px; border-left: none; border-top: none; }
.uc-card .uc-stat .lbl {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em;
  color: var(--ink-2); font-weight: 600;  /* AA：ink-3 (4.47 on var(--bg)) → ink-2 (12+) */
}
.uc-card .uc-stat .val {
  font-family: var(--en); font-weight: 700; font-size: 44px;
  color: var(--ink); line-height: 1; letter-spacing: -0.02em;
  margin: 4px 0;
}
.uc-card .uc-stat .val .u { font-size: 22px; color: var(--teal-3); }
.uc-card .uc-stat .sub {
  font-family: var(--mono); font-size: 9px; color: var(--teal-text);  /* AA contrast on var(--bg) */
  letter-spacing: 0.08em; font-weight: 600;
}

/* ============ FAQ — terminal log ============
   FAQ 是 always-expanded（无 useState、无折叠 JS），[+] 仅装饰
   ============================================================ */
.faq {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}
.faq-list {
  border: 1px solid var(--ink);
}
.faq-item {
  border-bottom: 1px solid var(--line);
  padding: 22px 28px;
  display: grid; grid-template-columns: 80px 1fr 32px;
  gap: 24px; align-items: start;
  cursor: pointer;
  transition: background 0.15s;
}
.faq-item:last-child { border-bottom: none; }
.faq-item:hover { background: var(--bg); }
.faq-item .q-id {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  color: var(--teal-text); letter-spacing: 0.12em;  /* AA contrast 13px bold */
  padding-top: 6px;
}
.faq-item .q-id::before { content: '?_ '; color: var(--ink-3); }
.faq-item .body .q {
  font-size: 16px; font-weight: 700; line-height: 1.6;
  margin-bottom: 10px;
}
.faq-item .body .a {
  font-size: 13px; line-height: 2; color: var(--ink-2);
  max-width: 760px;
  padding-left: 16px;
  border-left: 2px solid var(--teal);
}
.faq-item .glyph {
  font-family: var(--mono); font-weight: 700; font-size: 16px;
  color: var(--ink-3); text-align: right; padding-top: 6px;
}

/* ============ CTA strip ============
   黑底大区块；左侧大标题 + 右侧 3 个 cta-list 链接（無料診断 / 白書 / 30分相談）
   ============================================================ */
.cta {
  background: var(--ink);
  color: var(--paper);
  padding: 80px 0;
  position: relative;
  border-bottom: 1px solid var(--ink);
}
.cta::before {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
}
.cta > * { position: relative; }

.cta-row {
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 64px;
  align-items: start;
}
.cta-row .lead .kbd {
  color: var(--teal); margin-bottom: 28px;
  display: inline-flex; align-items: center; gap: 10px;
}
.cta-row .lead .kbd .dot { background: var(--teal); }
.cta-row h2 {
  font-size: 44px; font-weight: 900; line-height: 1.3;
  letter-spacing: 0.005em;
}
.cta-row h2 .em {
  background: var(--teal); color: var(--dark);
  padding: 0 10px; margin: 0 4px;
}
.cta-row .info {
  font-size: 14px; color: #c8d0d6; line-height: 2;
  margin-top: 24px;
}
.cta-list {
  display: flex; flex-direction: column; gap: 8px;
}
.cta-list a {
  display: grid; grid-template-columns: 1fr auto;
  gap: 18px; align-items: center;
  padding: 22px 26px;
  background: var(--dark-2); color: var(--paper);
  border: 1px solid var(--dark-line);
  font-size: 14px; font-weight: 700;
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
  position: relative;
}
.cta-list a::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--teal);
  transform: scaleY(0); transform-origin: bottom;
  transition: transform 0.2s;
}
.cta-list a:hover { background: var(--ink); border-color: var(--teal); transform: translateX(4px); }
.cta-list a:hover::before { transform: scaleY(1); transform-origin: top; }
.cta-list a .lbl {
  display: flex; flex-direction: column; gap: 4px;
}
.cta-list a .lbl .sub {
  font-family: var(--mono); font-size: 10px; color: var(--ink-4);
  letter-spacing: 0.1em; font-weight: 500;
}
.cta-list a .arr {
  width: 36px; height: 36px;
  background: var(--teal); color: var(--dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
}


/* ===========================================================
   SIZE BUMP — 全站文字尺寸放大（来自 chat3，2026-05-24 owner 要求）
   ============================================================
   `clamp(min, vw, max)` 流式响应，保证桌面 / 平板 / 手机阶段连续过渡
   ============================================================ */

/* Section headers */
.sec-head h2 { font-size: clamp(56px, 6vw, 84px); line-height: 1.02; }
.sec-head h2 .jp { font-size: clamp(20px, 1.7vw, 26px); margin-left: 22px; }

/* WHY NOW */
.why-intro h3 { font-size: clamp(40px, 3.6vw, 56px); line-height: 1.35; }
.why-intro p  { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; }

.stat-cell { padding: 36px 32px 32px; min-height: 320px; }
.stat-cell .label { font-size: 16px; }
.stat-cell .num   { font-size: clamp(96px, 8vw, 124px); }
.stat-cell .num .unit { font-size: clamp(40px, 3.6vw, 52px); }
.stat-cell .delta { font-size: 13px; margin-top: 12px; }
.stat-cell .desc  { font-size: 16px; line-height: 1.85; padding-top: 22px; }
.stat-cell .meta  { font-size: 11px; margin-bottom: 16px; }
.stat-cell .src   { font-size: 10px; margin-top: 14px; }

/* COMPARE */
.compare-intro h3 { font-size: clamp(40px, 3.6vw, 56px); line-height: 1.4; }
.compare-intro p  { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; }
.channel { padding: 40px 36px; }
.channel .ch-name .lock { font-size: clamp(72px, 6.8vw, 104px); }
.channel .ch-name .full { font-size: 13px; }
.channel .ch-jp   { font-size: clamp(24px, 2vw, 32px); margin-bottom: 24px; }
.channel .ch-body { font-size: clamp(16px, 1.18vw, 18px); line-height: 1.9; }
.spec-table .row { padding: 18px 0; }
.spec-table .row .k { font-size: 12px; }
.spec-table .row .v { font-size: 16px; line-height: 1.6; }
.channel .ch-tag { font-size: 12px; margin-bottom: 16px; }

/* CAPABILITIES */
.cap-intro h3 { font-size: clamp(40px, 3.6vw, 56px); line-height: 1.4; }
.cap-intro h3 .sub-line { font-size: 19px !important; padding-top: 18px; }
.cap-intro p  { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; }
.cap-card { padding: 44px 40px 40px; min-height: 540px; }
.cap-card .cap-head .left .module { font-size: 12px; margin-bottom: 12px; }
.cap-card .cap-head .left .cap-jp { font-size: clamp(32px, 2.8vw, 44px); }
.cap-card .cap-head .num { font-size: clamp(40px, 3.4vw, 52px); }
.cap-card .cap-desc { font-size: clamp(16px, 1.15vw, 18px); line-height: 1.9; }
.cap-card .cap-foot { font-size: 12px; margin-top: 22px; padding-top: 16px; }

/* GEO DEEP DIVE */
.geo-intro h3 { font-size: clamp(48px, 4.6vw, 72px); line-height: 1.25; }
.geo-intro p  { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; max-width: 620px; }
.geo-mock-left { padding: 48px 44px; }
.geo-mock-left .small-tag { font-size: 13px; }
.geo-mock-left h4 { font-size: clamp(28px, 2.4vw, 38px); line-height: 1.5; }
.geo-mock-left p  { font-size: clamp(16px, 1.18vw, 18px); line-height: 1.95; }
.geo-eng { font-size: 13px; padding: 10px 16px; }
.geo-term-body { padding: 32px 32px 36px; }
.geo-term-body .prompt { font-size: 15px; padding: 16px 18px; }
.geo-term-body .ai-out { font-size: 16px; line-height: 2.05; }

/* USE CASES */
.uc-intro h3 { font-size: clamp(40px, 3.6vw, 56px); line-height: 1.4; }
.uc-intro p  { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; }
.uc-card { padding: 36px 32px; gap: 28px; }
.uc-card .uc-title { font-size: clamp(22px, 1.8vw, 28px); line-height: 1.5; }
.uc-card .uc-desc  { font-size: clamp(16px, 1.15vw, 18px); line-height: 1.9; }
.uc-card .uc-tag   { font-size: 11px; padding: 5px 12px; }
.uc-card .uc-stat .lbl { font-size: 11px; }
.uc-card .uc-stat .val { font-size: clamp(56px, 5vw, 72px); }
.uc-card .uc-stat .val .u { font-size: clamp(28px, 2.4vw, 36px); }
.uc-card .uc-stat .sub { font-size: 11px; }
.uc-card .uc-meta { font-size: 11px; }

/* FAQ */
.faq-item { padding: 32px 36px; gap: 36px; }
.faq-item .q-id { font-size: 13px; }
.faq-item .body .q { font-size: clamp(20px, 1.6vw, 26px); line-height: 1.55; margin-bottom: 14px; }
.faq-item .body .a { font-size: clamp(16px, 1.18vw, 19px); line-height: 1.95; max-width: 880px; padding: 16px 0 16px 22px; }
.faq-item .glyph { font-size: 22px; }

/* CTA strip */
.cta-row h2 { font-size: clamp(48px, 4.6vw, 68px); line-height: 1.25; }
.cta-row .info { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.95; max-width: 620px; }
.cta-row .lead .kbd { font-size: 13px; }
.cta-list a { padding: 26px 28px; }
.cta-list a .lbl > span:first-child { font-size: 19px; font-weight: 700; }
.cta-list a .lbl .sub { font-size: 12px; }
.cta-list a .arr { width: 44px; height: 44px; font-size: 20px; }


/* ===========================================================
   REVIEW 対応：免責 / 占位 / フォーカス / モーションリスペクト
   ===========================================================
   PR #2 Cursor review に基づく追加スタイル
   ============================================================ */

/* 数値の免責文言（review #3） */
.hero-disclaimer,
.uc-disclaimer {
  font-family: var(--mono);
  font-size: clamp(11px, 0.85vw, 12px);
  line-height: 1.8;
  color: var(--ink-3);
  margin-top: 20px;
  max-width: 720px;
  letter-spacing: 0.02em;
}
.hero-disclaimer {
  text-align: center;
  border-top: 1px dashed var(--line);
  padding-top: 16px;
}
.hero-disclaimer strong,
.uc-disclaimer strong {
  color: var(--teal-text);  /* AA contrast for inline emphasis */
  font-weight: 700;
}
.hero-disclaimer a {
  color: var(--teal-text);  /* AA contrast */
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* CTA list の占位 span（<a> と同じ見た目だがリンクではない、review #6） */
.cta-list .cta-disabled {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 22px 26px;
  background: var(--dark-2);
  color: var(--paper);
  border: 1px solid var(--dark-line);
  font-size: 14px;
  font-weight: 700;
  position: relative;
  cursor: not-allowed;
  opacity: 0.55;
}
.cta-list .cta-disabled .lbl {
  display: flex; flex-direction: column; gap: 4px;
}
.cta-list .cta-disabled .lbl > span:first-child {
  font-size: 19px; font-weight: 700;
}
.cta-list .cta-disabled .lbl .sub {
  font-family: var(--mono); font-size: 12px;
  color: var(--ink-4);
  letter-spacing: 0.1em; font-weight: 500;
}
.cta-list .cta-disabled .arr {
  width: 44px; height: 44px;
  background: var(--ink-3); color: var(--dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700;
}

/* Footer RESOURCES の占位 span（review #6） */
.foot .col li .link-disabled {
  color: var(--ink-3);   /* AA：ink-4 (2.53) → ink-3 (5.0) for 11px */
  cursor: not-allowed;
  display: inline-flex; align-items: center;
}
.foot .col li .link-disabled .arr { color: var(--ink-3); margin-right: 8px; }
.foot .col li .link-disabled .soon {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--teal-text);  /* AA contrast for 9px text */
  letter-spacing: 0.12em;
  font-weight: 600;
  margin-left: 4px;
}

/* キーボードフォーカスの可視化（review #5）
   :focus-visible はキーボード操作時のみ発火、マウスクリックでは発火しない
   ※ 死規則削除（round3 較低）：`[role="link"]:focus-visible` と
     `.cta-disabled:focus-visible` は HTML から role="link" を除去し、
     `.cta-disabled` も plain span（不可聚焦）にしたため不要。 */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--teal-3);
  outline-offset: 3px;
  border-radius: 2px;
}
/* 暗色背景上のフォーカスは teal を使う */
.geo a:focus-visible,
.cta a:focus-visible,
.foot .ctablock .ml:focus-visible {
  outline-color: var(--teal);
  outline-offset: 4px;
}

/* モーションリスペクト（review #5）
   ticker / pulse / bar-pulse のアニメーションを停止し、scroll-behavior も瞬時に */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto !important; }
  .ticker-rail { animation: none !important; }
  .ticker-cell .bars span { animation: none !important; transform: scaleY(0.75); }
}


/* ===========================================================
   RESPONSIVE — 移动断点（review #1：原稿は @media なしで携帯不可）
   ===========================================================
   断点设计：
     - 1024px 以下：タブレット縦、2 列維持しつつ余白縮小
     - 768px 以下：多くの 2 列 grid を単列折叠、hero 三栏 → スタック
     - 540px 以下：stat-grid 4→2 / pipeline 5→2 / uc-card 縦並び
     - 420px 以下：stat-grid 1 列、ticker のセル padding 削減
   ============================================================ */

/* === 1024px：余白縮小 === */
@media (max-width: 1024px) {
  .shell-wide { padding: 0 32px; }
  .hero-body { padding: 48px 32px 36px; }
}

/* === 960px：多 2 列 intro 折叠 === */
@media (max-width: 960px) {
  /* セクション間隔縮小 */
  section { padding: 72px 0; }

  /* 各セクション导入区段の 2 列レイアウトを単列に */
  .why-intro,
  .compare-intro,
  .cap-intro,
  .uc-intro,
  .geo-intro,
  .pipeline-head {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* === 768px：大規模折叠（実質的なタブレット縦・大型携帯） === */
@media (max-width: 768px) {
  section { padding: 56px 0; }
  .shell-wide,
  .shell { padding: 0 20px; }

  /* Hero：3 列 → 縦スタック */
  .hero-body { padding: 32px 20px 28px; }
  .hero-title-row {
    grid-template-columns: 1fr;
    gap: 28px;
    align-items: start;
  }
  .hero-lock {
    font-size: clamp(72px, 18vw, 120px);
    line-height: 0.9;
  }
  .hero-lock .lock-geo::before { left: -0.4em; }
  .hero-jp-pitch {
    font-size: clamp(36px, 9vw, 56px);
    line-height: 1.2;
  }
  .hero-bottom { padding: 36px 20px 44px; }
  .hero-cta { padding: 18px 32px; font-size: 15px; }

  /* Engine ticker：cell 縮小 */
  .ticker-cell { padding: 16px 22px; gap: 12px; }
  .ticker-cell .name { min-width: 72px; font-size: 13px; }
  .ticker-cell .pct { min-width: 46px; font-size: 13px; }

  /* Status 4→2 列、cell 高さ縮小 */
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-cell { min-height: 240px; padding: 28px 22px 22px; }
  .stat-cell:nth-child(2n) { border-right: none; }
  .stat-cell:nth-child(-n+2) { border-bottom: 1px solid var(--line); }

  /* Definition：SEO/GEO 双卡片を単列 */
  .compare-grid { grid-template-columns: 1fr; gap: 18px; }
  .channel { padding: 32px 24px; }
  .channel .ch-name .lock { font-size: clamp(56px, 14vw, 84px); }

  /* Service 4→2 列 → 1 列（携帯ではカード縦並びが読みやすい） */
  .cap-grid { grid-template-columns: 1fr; }
  .cap-card {
    min-height: auto;
    padding: 32px 24px 28px;
    border-right: none;
    border-bottom: 1px solid var(--ink);
  }
  .cap-card:last-child { border-bottom: none; }
  .cap-card .feat-marker { top: 12px; right: 24px; }

  /* GEO Deep Dive mock 2 列 → 縦 */
  .geo-mock { grid-template-columns: 1fr; }
  .geo-mock-left { padding: 32px 24px; border-right: none; border-bottom: 1px solid var(--dark-line); }
  .geo-term-body { padding: 24px 20px 28px; }

  /* GEO Pipeline 5 列 → 2 列、節点間ライン非表示 */
  .pipeline { grid-template-columns: repeat(2, 1fr); }
  .pipeline::before { display: none; }
  .ppl-step { padding: 24px 16px; border-right: 1px solid var(--dark-line); border-bottom: 1px solid var(--dark-line); }
  .ppl-step:nth-child(2n) { border-right: none; }
  .ppl-step:nth-last-child(-n+1) { border-bottom: none; }

  /* Use Cases 2→1 列 */
  .uc-grid { grid-template-columns: 1fr; }
  .uc-card {
    grid-template-columns: 1fr;
    border-right: none;
    border-bottom: 1px solid var(--ink);
    padding: 28px 24px;
  }
  .uc-card:last-child { border-bottom: none; }
  .uc-card .uc-stat { padding: 16px 14px; }

  /* FAQ：q-id 列幅縮小、glyph 非表示でスペース確保 */
  .faq-item {
    grid-template-columns: 56px 1fr;
    gap: 20px;
    padding: 24px 24px;
  }
  .faq-item .glyph { display: none; }
  .faq-item .body .a { padding-left: 14px; }

  /* CTA strip 2→1 列 */
  .cta { padding: 56px 0; }
  .cta-row { grid-template-columns: 1fr; gap: 36px; }
  .cta-row h2 { font-size: clamp(34px, 8vw, 48px); }
  .cta-list a { padding: 20px 22px; }
  .cta-list .cta-disabled { padding: 20px 22px; }
}

/* === 540px：stat-grid 1 列、pipeline 1 列、uc-card 縦並び === */
@media (max-width: 540px) {
  .stat-grid { grid-template-columns: 1fr; }
  .stat-cell { border-right: none; border-bottom: 1px solid var(--line); }
  .stat-cell:last-child { border-bottom: none; }

  .pipeline { grid-template-columns: 1fr; }
  .ppl-step { border-right: none; border-bottom: 1px solid var(--dark-line); }
  .ppl-step:last-child { border-bottom: none; }

  /* Use Cases stat ブロックを下に移動 */
  .uc-card { grid-template-columns: 1fr; gap: 14px; }
  .uc-card .uc-meta { grid-column: 1 / -1; }
}

/* === 420px：極小幅。ticker padding 削減、hero-lock 字小さく === */
@media (max-width: 420px) {
  .hero-lock { font-size: clamp(56px, 16vw, 80px); }
  .ticker-cell { padding: 12px 16px; }
  .ticker-cell .glyph { width: 24px; height: 24px; }
  .ticker-cell .glyph svg { width: 18px; height: 18px; }
  .ticker-cell .bars { height: 16px; }
  .channel .ch-name .lock { font-size: clamp(48px, 16vw, 64px); }
}