/* For museums: what a museum gets, and one worked example. Tokens in atlas.css. */
.museum-hero h1{margin:0}
.museum-gets{list-style:none;counter-reset:mg;margin:30px 0 0;padding:0}
.museum-gets li{counter-increment:mg;position:relative;padding:14px 0 14px 54px;border-top:1px solid var(--paper-3);font-size:17px;line-height:1.55;color:var(--ink-2)}
.museum-gets li::before{content:counter(mg);position:absolute;left:0;top:6px;font:italic 600 38px/1 var(--display);font-variation-settings:"opsz" 24;color:var(--red)}
.museum-gets b{color:var(--ink);font-weight:600}
.museum-when{margin:22px 0 0;padding:16px 18px;border-left:3px solid var(--red);background:var(--card);font-size:16.5px;line-height:1.55}
.example-layout{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);gap:clamp(36px,5vw,72px);align-items:start}
.example-map{margin:0;background:var(--card);padding:12px;box-shadow:var(--shadow-paper);transform:rotate(-.6deg)}
.example-map img{width:100%;height:auto;filter:sepia(.12) contrast(1.04)}
.example-map figcaption{margin-top:10px;font:italic 400 14px/1.4 var(--text);color:var(--ink-3)}
.museum-example h2{font-size:clamp(28px,2.6vw,38px);margin:0 0 .4em}
.museum-example h2 cite{font-style:italic}
.example-findings{list-style:none;margin:22px 0 26px;padding:0}
.example-findings li{display:grid;grid-template-columns:auto;gap:8px;padding:14px 0;border-top:1px dotted var(--rule-blue);font-size:16.5px;line-height:1.5}
.example-findings .stamp{justify-self:start;font-size:11.5px;--rot:-2deg}
.museum-example .btn{margin-right:18px}
.museum-terms .plain p{margin:0 0 14px}
@media (max-width:900px){.example-layout{grid-template-columns:1fr}.example-map{max-width:420px}}