/* Story Map — uses the theme's colour names when present. */
.smap { display: grid; grid-template-columns: 1fr 280px; gap: 30px; align-items: start; }
.smap__map { position: relative; }
.smap__img { display: block; width: 100%; height: auto; border: 1px solid var(--wp--preset--color--line, #D8CDB8); }
.smap__pin {
	position: absolute; transform: translate(-50%, -50%); width: 30px; height: 30px; border-radius: 50%; padding: 0;
	background: var(--wp--preset--color--teal, #1F6F86); color: #fff; border: 2px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.25);
	font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s, transform .2s;
}
.smap__pin:hover, .smap__pin.is-on { background: var(--wp--preset--color--gold, #C9A96E); transform: translate(-50%, -50%) scale(1.2); }
.smap__pin:focus-visible { outline: 3px solid var(--wp--preset--color--gold, #C9A96E); outline-offset: 2px; }
.smap__card { background: #fff; border: 1px solid var(--wp--preset--color--line, #D8CDB8); padding: 24px; }
.smap__card h2 { font-family: var(--wp--preset--font-family--josefin, inherit); font-weight: 300; font-size: 24px; margin: 4px 0 8px; }
.smap__card p { margin: 0 0 8px; }
.smap__kicker, .smap__appears { font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--wp--preset--color--soft, #5F665A); }
@media (max-width: 800px) {
	.smap { grid-template-columns: 1fr; }
	.smap__pin { width: 26px; height: 26px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .smap__pin { transition: none; } }