/* AI marketing agent guide: layout, the agent trace, HTML charts, image grid and the loop illustration only. */
.bespoke-ai-marketing-agent-tiktok figure{margin:0}
.bespoke-ai-marketing-agent-tiktok .ma-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bespoke-ai-marketing-agent-tiktok .ma-hero{padding-top:48px}
.bespoke-ai-marketing-agent-tiktok .ma-no{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ls-ink);border-bottom:3px solid var(--ls-blue);padding-bottom:2px;margin-bottom:16px}

/* loop illustration: flat, 2px ink outlines, pastel fills */
.bespoke-ai-marketing-agent-tiktok .ma-o *{stroke:#1f1e1c;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}
.bespoke-ai-marketing-agent-tiktok .ma-o .ma-arc{stroke-dasharray:2 10;stroke-width:3}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-paper{fill:var(--ls-paper)}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-blue{fill:var(--ls-blue)}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-peach{fill:var(--ls-peach)}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-yellow{fill:var(--ls-yellow)}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-mint{fill:var(--ls-mint)}
.bespoke-ai-marketing-agent-tiktok .ma-o .f-lavender{fill:var(--ls-lavender)}

/* part 1: the loop as four linked cards */
.bespoke-ai-marketing-agent-tiktok .ma-loop{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;counter-reset:none}
.bespoke-ai-marketing-agent-tiktok .ma-loop li{position:relative}
.bespoke-ai-marketing-agent-tiktok .ma-loop li:not(:last-child)::after{content:'→';position:absolute;right:-22px;top:50%;transform:translateY(-50%);font-size:22px;font-weight:800;color:var(--ls-ink)}
.bespoke-ai-marketing-agent-tiktok .ma-step{display:block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ls-muted);margin-bottom:8px}
.bespoke-ai-marketing-agent-tiktok .ma-loop h3{font-size:20px}
.bespoke-ai-marketing-agent-tiktok .ma-loop p{font-size:16px}

/* part 2 */
.bespoke-ai-marketing-agent-tiktok .ma-why{align-items:start}
.bespoke-ai-marketing-agent-tiktok .ma-vs{display:grid;gap:12px}
.bespoke-ai-marketing-agent-tiktok .ma-vs-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"q n" "s s";gap:2px 12px;background:var(--ls-paper);border:2px solid var(--ls-ink);border-radius:var(--ls-radius-sm);padding:14px 18px}
.bespoke-ai-marketing-agent-tiktok .ma-vs-row--low{background:var(--ls-peach-tint);border-color:var(--ls-peach);margin-left:28px}
.bespoke-ai-marketing-agent-tiktok .ma-vs-q{grid-area:q;font-weight:700;color:var(--ls-ink);font-size:16px}
.bespoke-ai-marketing-agent-tiktok .ma-vs-row b{grid-area:n;font-size:28px;font-weight:800;letter-spacing:-.02em;color:var(--ls-ink);line-height:1}
.bespoke-ai-marketing-agent-tiktok .ma-vs-row > span:last-child{grid-area:s;font-size:13px;color:var(--ls-muted)}
.bespoke-ai-marketing-agent-tiktok .ma-demand{margin-top:56px;padding-top:32px;border-top:1.5px solid var(--ls-line)}
.bespoke-ai-marketing-agent-tiktok .ma-demand .ls-stat b{font-size:clamp(30px,3vw,40px)}

/* part 3 */
.bespoke-ai-marketing-agent-tiktok .ma-hosts{margin-top:28px}
.bespoke-ai-marketing-agent-tiktok .ma-hosts .ls-card{display:flex;flex-direction:column;gap:10px;min-width:0}
.bespoke-ai-marketing-agent-tiktok .ma-hosts .ls-small{margin:0}
.bespoke-ai-marketing-agent-tiktok .ma-code{max-width:100%;min-width:0;margin:0;background:var(--ls-cream);border:1.5px solid var(--ls-line);border-radius:12px;padding:14px 16px;overflow-x:auto;font-size:13px;line-height:1.55}
.bespoke-ai-marketing-agent-tiktok .ma-code code{font-family:var(--ls-mono);background:none;border:0;padding:0;font-size:inherit;white-space:pre}
.bespoke-ai-marketing-agent-tiktok .ma-more{margin-top:auto;font-weight:700}
.bespoke-ai-marketing-agent-tiktok .ma-skill{min-width:0;margin-top:40px;background:var(--ls-paper);border:2px solid var(--ls-ink);border-radius:var(--ls-radius);padding:28px}
.bespoke-ai-marketing-agent-tiktok .ma-code--wide{font-size:14px}

/* part 4: the agent trace */
.bespoke-ai-marketing-agent-tiktok .ma-trace{list-style:none;margin:32px 0 0;padding:0;counter-reset:call;position:relative}
.bespoke-ai-marketing-agent-tiktok .ma-trace::before{content:'';position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:var(--ls-line)}
.bespoke-ai-marketing-agent-tiktok .ma-call{counter-increment:call;position:relative;padding-left:60px;margin-bottom:34px}
.bespoke-ai-marketing-agent-tiktok .ma-call::before{content:counter(call);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:12px;background:var(--ls-blue);border:2px solid var(--ls-ink);display:grid;place-items:center;font-weight:800;color:var(--ls-ink)}
.bespoke-ai-marketing-agent-tiktok .ma-cmd{font-family:var(--ls-mono);font-size:15px;color:var(--ls-ink);margin:8px 0 12px}
.bespoke-ai-marketing-agent-tiktok .ma-cmd code{font-size:15px;background:var(--ls-yellow-tint);border-color:var(--ls-yellow)}
.bespoke-ai-marketing-agent-tiktok .ma-out{background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius);padding:22px;max-width:860px}
.bespoke-ai-marketing-agent-tiktok .ma-note{margin:16px 0 0;font-size:16px}
.bespoke-ai-marketing-agent-tiktok .ma-note b{display:inline-block;background:var(--ls-mint);border-radius:999px;padding:1px 10px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-right:6px;color:var(--ls-ink)}
.bespoke-ai-marketing-agent-tiktok .ma-months ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;align-items:end;height:220px;border-bottom:1.5px solid var(--ls-line)}
.bespoke-ai-marketing-agent-tiktok .ma-months li{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px}
.bespoke-ai-marketing-agent-tiktok .ma-months li b{font-size:13px;color:var(--ls-ink)}
.bespoke-ai-marketing-agent-tiktok .ma-col{display:block;width:100%;max-width:56px;height:calc(var(--f) * 1.6px);min-height:4px;background:var(--ls-blue);border-radius:8px 8px 0 0}
.bespoke-ai-marketing-agent-tiktok .ma-months li.hi .ma-col{background:var(--ls-blue-deep)}
.bespoke-ai-marketing-agent-tiktok .ma-months li > span:last-child{font-size:13px;color:var(--ls-muted)}
.bespoke-ai-marketing-agent-tiktok .ma-demo,.bespoke-ai-marketing-agent-tiktok .ma-facts{list-style:none;margin:0;padding:0;gap:18px}
.bespoke-ai-marketing-agent-tiktok .ma-demo .ls-stat b,.bespoke-ai-marketing-agent-tiktok .ma-facts .ls-stat b{font-size:clamp(26px,2.6vw,34px)}
.bespoke-ai-marketing-agent-tiktok .ma-beats{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.bespoke-ai-marketing-agent-tiktok .ma-beats li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;font-size:16px}
.bespoke-ai-marketing-agent-tiktok .ma-beats b{font-family:var(--ls-mono);font-size:14px;color:var(--ls-blue-deep)}
.bespoke-ai-marketing-agent-tiktok .ma-themes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bespoke-ai-marketing-agent-tiktok .ma-themes div{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:start;background:var(--ls-lavender-tint);border-radius:var(--ls-radius-sm);padding:14px}
.bespoke-ai-marketing-agent-tiktok .ma-themes b{font-size:28px;font-weight:800;color:var(--ls-ink);line-height:1}
.bespoke-ai-marketing-agent-tiktok .ma-themes span{font-size:15px;line-height:1.45}
.bespoke-ai-marketing-agent-tiktok .ma-gal-h{margin-top:16px}

/* image grid: each cover links to the original */
.bespoke-ai-marketing-agent-tiktok .ma-shots{display:grid;grid-template-columns:repeat(5,minmax(0,200px));gap:20px;margin:18px 0 32px}
.bespoke-ai-marketing-agent-tiktok .ma-shot{display:flex;flex-direction:column;gap:10px}
.bespoke-ai-marketing-agent-tiktok .ma-shot > a{display:block;line-height:0}
.bespoke-ai-marketing-agent-tiktok .ma-shot img{display:block;width:100%;max-width:200px;height:auto;aspect-ratio:3 / 4;object-fit:cover;object-position:top;border:2px solid var(--ls-ink);border-radius:var(--ls-radius-sm);background:var(--ls-paper)}
.bespoke-ai-marketing-agent-tiktok .ma-shot figcaption{font-size:13px;line-height:1.45;color:var(--ls-muted)}
.bespoke-ai-marketing-agent-tiktok .ma-shot figcaption strong{color:var(--ls-ink)}

/* part 5 */
.bespoke-ai-marketing-agent-tiktok .ma-briefs{margin-top:28px}
.bespoke-ai-marketing-agent-tiktok .ma-briefs h3{margin-top:14px;font-size:20px}
.bespoke-ai-marketing-agent-tiktok .ma-briefs p{font-size:16px}
.bespoke-ai-marketing-agent-tiktok .ma-skip{margin:24px 0 28px;max-width:760px}

/* part 6 */
.bespoke-ai-marketing-agent-tiktok .ma-guard{align-items:start}
.bespoke-ai-marketing-agent-tiktok .ma-rules{padding-left:20px;margin:0 0 20px}
.bespoke-ai-marketing-agent-tiktok .ma-rules li{margin-bottom:10px}
.bespoke-ai-marketing-agent-tiktok .ls-prompt{margin-top:24px}

@media (max-width:960px){
  .bespoke-ai-marketing-agent-tiktok .ma-loop{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bespoke-ai-marketing-agent-tiktok .ma-loop li:nth-child(2)::after{display:none}
  .bespoke-ai-marketing-agent-tiktok .ma-shots{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:600px){
  .bespoke-ai-marketing-agent-tiktok .ma-hero{padding-top:28px}
  .bespoke-ai-marketing-agent-tiktok .ls-illo{padding:12px}
  .bespoke-ai-marketing-agent-tiktok .ma-loop{grid-template-columns:1fr;gap:16px}
  .bespoke-ai-marketing-agent-tiktok .ma-loop li::after{display:none}
  .bespoke-ai-marketing-agent-tiktok .ma-vs-row--low{margin-left:14px}
  .bespoke-ai-marketing-agent-tiktok .ma-trace::before{left:15px}
  .bespoke-ai-marketing-agent-tiktok .ma-call{padding-left:44px}
  .bespoke-ai-marketing-agent-tiktok .ma-call::before{width:32px;height:32px;border-radius:10px}
  .bespoke-ai-marketing-agent-tiktok .ma-out{padding:14px}
  .bespoke-ai-marketing-agent-tiktok .ma-cmd{font-size:13px}
  .bespoke-ai-marketing-agent-tiktok .ma-months ol{gap:4px;height:190px}
  .bespoke-ai-marketing-agent-tiktok .ma-months li b{font-size:11px}
  .bespoke-ai-marketing-agent-tiktok .ma-themes{grid-template-columns:1fr}
  .bespoke-ai-marketing-agent-tiktok .ma-shots{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .bespoke-ai-marketing-agent-tiktok .ma-skill{padding:18px}
  .bespoke-ai-marketing-agent-tiktok .ma-code{font-size:12px}
}
.bespoke-ai-marketing-agent-tiktok .ma-hosts .ma-code code{white-space:pre-wrap;overflow-wrap:anywhere}
