/* Product previews use the current canvas artwork. Shared publication masthead. */
.toolkit-page .pub-header .pub-brand,.toolkit-page .pub-footer .pub-brand{font-size:30px;letter-spacing:-.065em;line-height:1.1}
.toolkit-page .pub-brand-dot{color:var(--coral)}
.toolkit-page .hero-copy{padding-top:64px}
.toolkit-page .case-heading{margin-bottom:28px}
.toolkit-page .case-result{font-size:18px;line-height:1.6;max-width:800px;color:#d7d5cf}
.canvas-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:44px}
.canvas-overview a{text-decoration:none;display:block}
.canvas-overview img{width:100%;box-shadow:0 12px 25px #0004;transition:transform .18s}
.canvas-overview a:hover img{transform:translateY(-4px)}
.canvas-overview a>span{display:flex;align-items:baseline;gap:12px;margin-top:20px;font-size:15px;font-weight:600}
.canvas-overview b{color:var(--coral);font-size:12px;font-weight:400}
.canvas-overview a>span>span{margin-left:auto;font-size:22px;font-weight:400}
.toolkit-page .tool-item{scroll-margin-top:24px}
.toolkit-page .tool-content{grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:48px;align-items:start}
.toolkit-page .tool-visual{margin:0;padding:24px 24px 60px;background:var(--paper)}
.toolkit-page .tool-visual img{width:100%;box-shadow:0 8px 18px #1112}
.toolkit-page .zoom{bottom:14px;right:24px;font-size:12px;min-height:32px}
.toolkit-page .tool-info{max-width:390px;padding-top:6px}
.toolkit-page .page-switch{margin-top:24px;margin-bottom:12px}
.toolkit-page .page-switch button{font-size:12px;min-height:44px}
.toolkit-page .preview-label{margin-top:0}
.toolkit-page .preview-label+p{margin-top:4px}
.strategy-detail{max-width:1600px;margin:auto;background:var(--paper);display:grid;grid-template-columns:.9fr 1.25fr;gap:64px;align-items:center;padding:72px var(--pad)}
.strategy-detail h2{font-size:clamp(38px,4vw,60px);margin-bottom:28px}
.strategy-detail-copy>p:not(.eyebrow){max-width:430px;font-size:16px}
.strategy-detail-copy .text-link{margin-top:26px}
.strategy-detail-figure{min-width:0}
.strategy-detail-crop{position:relative;overflow:hidden;aspect-ratio:2.639;background:white;box-shadow:0 12px 28px #1112}
.strategy-detail-crop img{position:absolute;width:168.42%;max-width:none;height:auto;left:-4.21%;top:-183.33%}
.strategy-detail-figure figcaption{font-size:12px;color:var(--muted);margin-top:20px}
#canvas-dialog{padding:24px;width:min(1400px,96vw);max-height:94vh;overflow:hidden}
#canvas-dialog::backdrop{background:#111b}
#canvas-dialog .dialog-head{margin-bottom:20px;align-items:center}
#dialog-context{margin-top:8px}
.dialog-actions{display:flex;gap:10px;flex-shrink:0}
#preview-zoom{color:var(--ink);background:white;border:1px solid var(--ink)}
.dialog-scroll{max-height:calc(94vh - 125px);overflow:auto;overscroll-behavior:contain}
.dialog-scroll img{width:100%;max-width:none;height:auto}
.dialog-scroll.is-zoomed img{width:1600px;max-width:none}
@media(max-width:1000px){.toolkit-page .tool-content{grid-template-columns:minmax(0,1.4fr) minmax(250px,1fr);gap:30px}.strategy-detail{gap:40px;padding-block:56px}.strategy-detail h2{font-size:42px}.canvas-overview{gap:18px}.canvas-overview a>span{font-size:13px;gap:8px}}
@media(max-width:700px){.toolkit-page .pub-header .pub-brand,.toolkit-page .pub-footer .pub-brand{font-size:27px}.toolkit-page .hero-copy{padding-top:40px}.toolkit-page .tool-content{display:flex;flex-direction:column;gap:24px}.toolkit-page .tool-info{max-width:none}.toolkit-page .tool-visual{padding:16px 16px 55px;width:100%}.toolkit-page .zoom{right:16px}.canvas-overview{grid-template-columns:1fr;gap:32px;margin-top:32px}.canvas-overview a>span{font-size:16px;margin-top:14px}.canvas-overview img{max-width:500px}.toolkit-page .case-result{font-size:16px}.strategy-detail{grid-template-columns:1fr;gap:32px;padding:48px var(--pad)}.strategy-detail-copy>p:not(.eyebrow){max-width:520px}.strategy-detail h2{font-size:42px;margin-bottom:22px}.strategy-detail-figure figcaption{font-size:11px;margin-top:14px}#canvas-dialog{padding:16px;width:96vw}#canvas-dialog .dialog-head{align-items:start;gap:12px;flex-wrap:wrap}#canvas-dialog .dialog-head h2{font-size:22px}.dialog-actions{margin-left:auto}#canvas-dialog .dialog-actions button{font-size:12px;min-height:44px}.dialog-scroll{max-height:calc(94vh - 165px)}}
@media(max-width:360px){.toolkit-page .pub-header .pub-brand,.toolkit-page .pub-footer .pub-brand{font-size:23px}.toolkit-page .page-switch button{padding-inline:12px}.strategy-detail h2{font-size:36px}}

/* Keep preview controls beside the image at every width. */
.toolkit-page .tool-visual{padding:24px}
.toolkit-page .tool-visual .page-switch{margin:0 0 20px}
.preview-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.toolkit-page .preview-actions .zoom{position:static;min-height:44px;margin:0;flex-shrink:0}
.toolkit-page .preview-actions .preview-label{font-size:11px;line-height:1.4;text-align:left}
@media(max-width:700px){.toolkit-page .tool-visual{padding:16px}.preview-actions{gap:12px;margin-top:16px}.toolkit-page .preview-actions .zoom{font-size:11px;padding:10px 12px}.toolkit-page .tool-visual .page-switch{margin-bottom:16px}}

#zoom-help{margin:0 0 12px}#zoom-help:not([hidden])+.dialog-scroll{max-height:calc(94vh - 190px)}

/* Leave room for descenders above the highlighted second line. */
.toolkit-page .hero h1{line-height:1.16}