/* Blocks added for the platform positioning. Uses the tokens in site.css. */

.hero{padding-top:88px;padding-bottom:24px}
.hero h1{grid-column:1 / span 8}
.hero .side{grid-column:9 / span 4}
.hero-cta{grid-column:1 / -1;display:flex;gap:12px;margin-top:36px}

/* ---------- problem statement ---------- */
.band{padding:64px 0 8px}
.pitch{display:grid;grid-template-columns:repeat(12,78px);column-gap:24px;border-top:1px solid var(--ink);padding-top:28px}
.pitch-lead{grid-column:1 / span 7;font-size:22px;line-height:1.42;letter-spacing:-.015em;margin:0}
.pitch-note{grid-column:9 / span 4;font-size:14px;line-height:1.65;color:var(--muted);margin:0;align-self:start;padding-top:4px}

/* ---------- three pillars ---------- */
.pillars{padding:56px 0 24px}
.pillar{display:grid;grid-template-columns:repeat(12,78px);column-gap:24px;
  border-top:1px solid var(--line);padding:32px 0 36px}
.pillar .num{grid-column:1;padding-top:6px}
.pillar-body{grid-column:2 / span 9}
.pillar-body h3{font-size:24px;line-height:1.25;letter-spacing:-.02em;font-weight:600;margin:0}
.pillar-body p{font-size:14.5px;line-height:1.7;color:var(--muted);max-width:70ch;margin-top:10px}
.pillar-body .tags{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}

/* ---------- modules ---------- */
.modules{padding:56px 0 24px;border-top:1px solid var(--line)}
.mod-head{grid-column:1 / span 4;padding-top:4px}
.mod-head p{margin-top:14px;max-width:32ch}
.mod{grid-column:5 / span 4;display:block;padding:22px 24px 24px;background:var(--panel);
  border:1px solid var(--line);transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.mod + .mod{grid-column:9 / span 4}
.mod:hover{border-color:var(--ink);transform:translateY(-2px)}
.mod h3{margin-top:10px}
.mod p{font-size:13.5px;line-height:1.65;color:var(--muted);margin-top:10px}
.mod .more{display:inline-block;margin-top:16px;font-size:13.5px;color:var(--ink)}
.mod:hover .more{color:var(--accent)}

/* ---------- industries ---------- */
.industries{padding:56px 0 16px;border-top:1px solid var(--line);margin-top:40px}
.ind-head{grid-column:1 / span 4;padding-top:4px}
.ind{grid-column:5 / span 4;padding-top:4px}
.ind:nth-of-type(3){grid-column:9 / span 4}
.ind p{font-size:14px;line-height:1.68;color:var(--muted);margin-top:12px}

/* ---------- trust ---------- */
.trust{padding:24px 0 8px;margin-top:40px;border-top:1px solid var(--ink)}
.tr{grid-column:span 4;padding:22px 0 4px}
.tr p{font-size:13.5px;line-height:1.65;color:var(--muted);margin-top:10px;max-width:34ch}

/* ---------- closing ---------- */
.closing{grid-column:1 / span 6}
.closing-copy{grid-column:8 / span 5}

@media (max-width:1240px){
  .pitch,.pillar,.hero .cols,.modules .cols,.industries .cols,.trust .cols{grid-template-columns:repeat(12,1fr)}
  .hero h1{grid-column:1 / span 8}
  .hero .side{grid-column:9 / span 4}
}
@media (max-width:1024px){
  .hero{padding-top:56px}
  .hero h1,.hero .side,.pitch-lead,.pitch-note,.pillar .num,.pillar-body,
  .mod-head,.mod,.ind-head,.ind,.tr,.closing,.closing-copy{grid-column:1 / -1}
  .hero .side{padding-top:0;margin-top:18px}
  .pitch-lead{font-size:19px}
  .pitch-note{margin-top:16px}
  .pillar .num{padding-top:0;margin-bottom:6px}
  .mod,.ind{margin-top:16px}
  .tr{padding:16px 0 0}
  .closing-copy{margin-top:20px}
}
@media (max-width:640px){
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta .btn,.hero-cta .btn-ghost{width:100%}
  .pillar-body h3{font-size:20px}
  .pitch-lead{font-size:17px;line-height:1.5}
}

.pind{padding-left:9ch}


/* 06 图形语言：覆盖矩阵 */
.coverage{padding:80px 0 72px;border-top:1px solid var(--line)}
.cov-head{grid-column:1 / span 4}
.cov-h{font-size:52px;line-height:1.02;letter-spacing:-.03em;font-weight:600;margin-top:20px}
.cov-h .out{-webkit-text-stroke:1.6px var(--ink);color:transparent;margin-left:.20em}
.cov-fig{grid-column:6 / span 7;margin:0;min-width:0}
.figcap{display:flex;justify-content:space-between;font-family:'Google Sans Code',monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-bottom:10px;border-bottom:1px solid var(--ink)}
.cov-fig svg{display:block;width:100%;height:auto;margin-top:22px}
.figscroll{overflow-x:auto;overflow-y:hidden;min-width:0}
.figlegend{display:flex;gap:24px;padding-top:20px;font-family:'Google Sans Code',monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.figlegend i{display:inline-block;width:10px;height:10px;margin-right:7px;vertical-align:-1px}
.sw-full{background:var(--ink)}
.sw-part{background:var(--accent);opacity:.55}
.sw-none{border:1px solid var(--line);background:transparent}
.cov-head .figlegend{flex-direction:column;gap:11px;padding-top:32px}
.fignote{margin-top:14px;font-size:11.5px;color:var(--muted)}
@media (max-width:980px){
  .coverage .cov-head,.coverage .cov-fig{grid-column:1 / -1}
  .cov-fig{margin-top:34px}
  .cov-h{font-size:34px}
  .figscroll svg{min-width:600px}
  .figscroll{padding-bottom:6px}
}