/* shar8 landing pages (/for-agents/, /todoist-alternative/, /zadachnik/, /mcp-zadachnik/, /claude-code-po-raspisaniyu/): small additions on top of landing.css and flow.css. */
.pg-hero{padding:72px 0 56px}
.pg-hero-in{max-width:820px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.pg-hero .cta{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.pg-sec{padding:72px 0}
.pg-sec.alt{background:var(--bg)}
.pg-in{display:flex;flex-direction:column;gap:28px}
.pg-in>p,.pg-in li{color:var(--text-body)}
.pg-in code{font:600 .9em var(--mono);background:var(--bg);padding:1px 6px;border-radius:6px}
.pg-in a:not(.btn){color:var(--accent-deep);text-decoration:underline}
.pg-note{padding:16px 20px;border-radius:16px;background:var(--bg);color:var(--text-body)}
.pg-sec.alt .pg-note{background:var(--bg-elev)}
.pg-tools{display:flex;flex-wrap:wrap;gap:8px}
.pg-tools span{font:600 13px var(--mono);padding:4px 10px;border-radius:8px;background:var(--bg-elev);box-shadow:inset 0 0 0 1.5px var(--line)}
.pg-list{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.pg-snap{color:var(--text-dim);font-size:14px}
.cmp th[scope="row"]{width:22%}
.cmp td{width:39%}
@media (max-width:720px){
  .pg-hero{padding:40px 0 40px}
  .pg-sec{padding:48px 0}
  .cmp th[scope="row"],.cmp td{width:auto}
}