/* What AI is actually good for (what-ai-is-good-for.html, generated by
 * scripts/build-marketing-pages.mjs). Loaded by that page only, on top of editorial.css, which
 * still owns the guide's base layout. Added on 8 October 2026 from the ideas review: the one
 * sentence the page depends on stands out, an "On this page" row jumps to each section, the five
 * groups of jobs fold into rows (on a phone only the first starts open, see assets/guide.js),
 * three jobs link to their real problem page, the limits open with a short version, and the
 * calculator gets a proper button. Colours come from the shell tokens, so light and dark follow
 * the rest of the site. */
.plain-guide .service-hero .guide-big{border-left:4px solid var(--signal);padding:4px 0 4px 18px;font-size:1.18rem;line-height:1.5;max-width:46em}
.guide-jump{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 8px}
.guide-jump a{border:1px solid var(--line);border-radius:999px;padding:9px 16px;font:600 .88rem var(--body);text-decoration:none;color:var(--ink);background:var(--surface);transition:border-color .2s,color .2s}
.guide-jump a:hover{border-color:var(--signal);color:var(--signal-text)}
.plain-guide .guide-block{scroll-margin-top:100px}
.plain-guide .guide-groups{gap:0}
.guide-group{border-top:1px solid var(--line)}
.guide-group:last-child{border-bottom:1px solid var(--line)}
.guide-group summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:16px 4px;min-height:48px}
.guide-group summary::-webkit-details-marker{display:none}
.guide-group summary h3{margin:0;font-size:1.3rem;line-height:1.2;color:var(--ink)}
.guide-group summary:hover h3{color:var(--signal-text)}
.guide-group summary small{margin-left:auto;font:500 .82rem var(--body);color:var(--ink-soft);white-space:nowrap}
.guide-group summary::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid var(--signal-text);border-bottom:2px solid var(--signal-text);transform:rotate(45deg) translate(-2px,-2px);transition:transform .25s}
.guide-group[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.guide-group .guide-list{padding:4px 4px 28px}
.guide-pill{display:inline-flex;align-items:center;margin-left:8px;padding:2px 10px;border-radius:999px;border:1px solid var(--signal);background:color-mix(in srgb,var(--signal) 15%,var(--surface));color:var(--signal-text);font-size:.72rem;font-weight:600;letter-spacing:.02em;vertical-align:2px}
.guide-link{display:block;width:fit-content;max-width:100%;margin-top:10px;color:var(--signal-text);font-size:.94rem;font-weight:600;line-height:1.4;text-underline-offset:4px}
.guide-glossary .guide-inline{display:inline;margin:0}
.plain-guide .guide-block .guide-foot{margin-top:26px}
.guide-calc{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:14px;padding:9px 14px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--signal-text);font-size:.9rem;font-weight:650;text-decoration:none;transition:border-color .2s}
.guide-calc:hover{border-color:var(--signal)}
.guide-note{margin:0 0 28px;padding:18px 20px;border-radius:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--signal) 6%,transparent);max-width:70ch}
.plain-guide .guide-note p{margin:0;font-size:.98rem;line-height:1.65;color:var(--ink-soft)}
.guide-note b{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.guide-group summary::after,.guide-jump a,.guide-calc{transition:none}}
@media (max-width:560px){.guide-jump a{padding:8px 13px}.plain-guide .service-hero .guide-big{font-size:1.08rem;padding-left:14px}}
/* Tap targets on phones and touch tablets (9 October 2026, site audit): each "On this page" chip is
   at least 44px tall there (it was 36px), the same media query as the 8 October tap-target fixes.
   Computers with a mouse keep the 38px chip. */
@media (max-width:640px), (pointer:coarse) and (max-width:1024px){.guide-jump a{display:inline-flex;align-items:center;min-height:44px}
  /* final audit pass: "See it as a real problem" links were 42px */
  .guide-link{min-height:44px}}