/* The same ink, Manrope, white surface and lilac accent used on the Stillmore homepage. */
body:has(main .tool-story){background:#fff}
main:has(.tool-story){--ink:#111;--quiet:#555158;--page:#fff;--brand:#bb88fe;color:var(--ink)}
main:has(.tool-story) .tool-entry h1{color:var(--ink);font-weight:800}
main:has(.tool-story) .tool-entry p{color:var(--quiet)}
main #quick-answer,main .tool-story{margin:0;padding:clamp(36px,5vw,72px) 0;width:100%;border:0;background:transparent;box-sizing:border-box}
main #quick-answer,.story-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:clamp(30px,7vw,108px)}
main #quick-answer{margin-top:clamp(32px,5vw,64px);border-block:1px solid #e6e3e8}
main #quick-answer h2, main .tool-story h2, main:has(.tool-story) .guide-block h2{margin:0;font:800 clamp(30px,3.7vw,52px)/1.04 Manrope,Arial,sans-serif;letter-spacing:-.045em;text-wrap:balance;color:var(--ink)}
main #quick-answer h2{font-size:clamp(26px,3vw,40px)}
main #quick-answer p,main .story-notes p{font:450 clamp(15px,1.3vw,18px)/1.55 Manrope,Arial,sans-serif;color:#515055;margin:0;max-width:53ch}
main .story-label,main #quick-answer small{display:flex;align-items:center;gap:10px;margin:0 0 12px;color:#604273;font:800 12px/1.2 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.06em}
main .story-label::before,main #quick-answer small::before{content:"";display:block;width:25px;height:4px;background:var(--brand)}
main .post-source{display:inline-block;font-weight:700;font-size:14px;color:var(--ink);margin:12px 0 0;text-decoration:underline;text-decoration-color:#b58bcc;text-underline-offset:4px}
main .post-source:hover{color:#67478c}
.story-images{display:grid;gap:clamp(10px,1.4vw,20px);margin-top:clamp(20px,2.5vw,36px)}
.story-images.count-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.story-images.count-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.story-images.count-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.story-images figure{margin:0;min-width:0}
.story-images img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#f2eff3;border-radius:12px}
.story-images figcaption{font:650 13px/1.4 Manrope,Arial,sans-serif;color:#49454c;margin-top:8px}
main[data-slug="carousel-layout-maker"] .story-images img,main[data-slug="white-border-maker"] .story-images img{height:clamp(170px,24vw,310px);aspect-ratio:auto;padding:10px;box-sizing:border-box}
main:has(.tool-story) .guide-block{border-color:#e6e3e8}
main:has(.tool-story) #guide{border-top:1px solid #e6e3e8}
main:has(.tool-story) .guide-steps li{border-color:#dcd9de}
@media(max-width:700px){
  main #quick-answer,.story-intro{grid-template-columns:1fr;gap:14px}
  main #quick-answer,main .tool-story{padding:30px 0}
  main .story-label,main #quick-answer small{margin-bottom:9px}
  .story-images.count-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .story-images img{border-radius:8px}
  main[data-slug="carousel-layout-maker"] .story-images img{height:auto;aspect-ratio:4/5;padding:2px}
  main[data-slug="white-border-maker"] .story-images img{height:auto;aspect-ratio:1;padding:4px}
}
