/* Shared geographic atlas. Static and readable without JavaScript. */
.destination-atlas{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(25px,4vw,64px);align-items:center}
.region-map{min-width:0;color:var(--ink);position:relative;isolation:isolate}
.map-topline{display:flex;justify-content:space-between;gap:20px;font-size:10px;font-weight:600;letter-spacing:.15em;border-top:1px solid var(--line);padding-top:17px}
.map-topline>span:last-child{letter-spacing:.1em}
.map-canvas{display:block;width:100%;height:auto;overflow:hidden;margin-block:8px 0}
.map-neighbours{fill:#e7e5da;stroke:#c7ccbd;stroke-width:1}
.map-country{fill:#dce1cf;stroke:#bcc5b1;stroke-width:1.5}
.map-border{fill:none;stroke:#506554;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.map-country-labels{font:500 17px var(--body);letter-spacing:2.2px;fill:#777e70}
.map-botswana-label{font-size:20px;letter-spacing:4px;fill:#98a38b;text-anchor:middle}
.map-halo{fill:var(--map-color);opacity:.14;transition:opacity .35s}
.map-water{--map-color:#2a6f70}.map-forest{--map-color:#526a41}.map-salt{--map-color:#a78053}.map-sand{--map-color:#ae693e}
.map-stop{color:var(--ink);cursor:pointer;outline:none;transform-box:fill-box;transform-origin:center}
.map-leader{fill:none;stroke:var(--map-color);stroke-width:1.3;opacity:.65}
.map-target{fill:transparent;stroke:var(--map-color);stroke-width:1;stroke-opacity:.35;transition:fill .3s,stroke-width .3s}
.map-pin{fill:var(--map-color);stroke:var(--paper);stroke-width:3;transition:r .3s}
.map-label-target{fill:var(--paper);fill-opacity:.87;stroke:transparent;stroke-width:2;transition:stroke .25s,fill .25s}
.map-number{font:600 15px var(--body);letter-spacing:2px;fill:var(--map-color)}
.map-label{font:500 31px var(--display);fill:currentColor;letter-spacing:0}
.map-stop.is-map-active .map-label-target,.map-stop:hover .map-label-target,.map-stop:focus-visible .map-label-target{stroke:var(--map-color);fill:#f5f2e8;fill-opacity:1}
.map-stop.is-map-active .map-target,.map-stop:hover .map-target,.map-stop:focus-visible .map-target{fill:var(--map-color);fill-opacity:.12;stroke-width:2}
.map-stop.is-map-active .map-pin{r:10}
.map-halo.is-map-active{opacity:.29}
.map-towns{fill:#67715f}.map-towns text{font:400 19px var(--body)}
.map-scale{fill:#747c6e;font:400 16px var(--body)}.map-scale path{fill:none;stroke:currentColor;stroke-width:1}
.map-relations{fill:none;stroke:#2a6f70;stroke-width:1.5;stroke-dasharray:4 7;opacity:.6}
.region-map figcaption{font-size:13px;line-height:1.65;padding-block:0;max-width:56ch}
.map-detail{display:block;font-size:10px;line-height:1.7;color:var(--muted);margin-top:10px}
.map-detail a{text-decoration:underline;text-underline-offset:2px}
.home .destination-atlas .destination-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.home .destination-atlas .destination{height:315px;margin:0;padding:22px 20px;min-width:0;border:2px solid transparent;transition:border-color .3s,box-shadow .4s}
.home .destination-atlas .destination h3{font-size:36px}
.home .destination-atlas .destination-title>p{font-size:11px}
.home .destination-atlas .destination-head{font-size:9px}
.home .destination-atlas .destination-head>span:last-child{width:29px;height:29px;font-size:20px}
.home .destination-atlas .destination-explore{margin-top:18px;padding-top:12px}
.home .destination-atlas .destination.is-map-active{border-color:var(--rust);box-shadow:0 12px 30px #24372526}
.home .destination-atlas .destination.water img{object-position:50% 50%}
.home .destination-atlas .destination.earth img{object-position:54% 30%}
.region-intro-geography h2{margin-bottom:32px}
.region-intro-geography .region-map{max-width:570px}
.region-map-compact .map-topline{font-size:9px;padding-top:13px}
.region-map-compact figcaption{font-size:12px;max-width:52ch}
.region-map-compact .map-detail{font-size:9px;margin-top:8px}
.region-page .region-intro{gap:42px 6vw}
.motion-enabled .map-motion-ready .map-border{stroke-dasharray:1;stroke-dashoffset:var(--map-draw,0)}
.motion-enabled .map-motion-ready .map-stop{opacity:var(--map-show,1);transform:translateY(calc((1 - var(--map-show,1))*12px))}
.motion-enabled .map-motion-ready .map-halo{opacity:calc(.14*var(--map-fill,1))}
.motion-enabled .map-motion-ready .map-halo.is-map-active{opacity:calc(.29*var(--map-fill,1))}
.motion-enabled .map-motion-ready .map-relations{opacity:calc(.6*var(--map-fill,1))}
.map-motion-ready:focus-within .map-stop{opacity:1!important;transform:none!important}
.map-motion-ready:focus-within .map-border{stroke-dashoffset:0!important}
@media(min-width:1600px){.home .destination-atlas .destination{height:350px}.home .destination-atlas .destination h3{font-size:43px}}
@media(max-width:1100px){.destination-atlas{grid-template-columns:1fr;gap:36px}.destination-atlas>.region-map{max-width:700px;width:100%;margin-inline:auto}.home .destination-atlas .destination-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home .destination-atlas .destination{height:320px;padding:19px 15px}.home .destination-atlas .destination h3{font-size:32px}.home .destination-atlas .destination-head>span:last-child{display:none}}
@media(max-width:700px){.map-topline{font-size:9px}.map-canvas{margin-top:12px}.region-map figcaption{font-size:12px}.map-detail{font-size:9px}.home .destination-atlas .destination-grid{grid-template-columns:1fr 1fr;gap:14px}.home .destination-atlas .destination{height:280px;padding:18px 14px}.home .destination-atlas .destination h3{font-size:32px}.home .destination-atlas .destination-title>p{display:none}.home .destination-atlas .destination-head{font-size:8px}.home .destination-atlas .destination-explore{font-size:10px;margin-top:16px}.home .destination-atlas .destination-explore>span{font-size:19px}.region-page .region-intro{gap:30px}.region-intro-geography h2{margin-bottom:28px}.region-intro-geography .region-map{max-width:540px}.region-map-compact figcaption{font-size:12px}}
@media(prefers-reduced-motion:reduce){.region-map *{transition:none!important}.map-stop{opacity:1!important;transform:none!important}.map-border{stroke-dashoffset:0!important}}

/* Keep the map and practical facts in balance instead of moving the empty column. */
@media(min-width:701px){
  .region-intro-geography{grid-column:1;grid-row:1/3}
  .region-intro-text{grid-column:2;grid-row:1}
  .region-intro .region-facts{grid-column:2;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr));align-self:end;gap:30px 22px;padding-top:26px}
}

@media(max-width:700px){.home .destination-atlas .destination.salt h3{font-size:clamp(24px,6.7vw,30px)}}