/* ROUND 83 — Contact page (inc/round83.php). The page-only region pop-up: a compact grid of region
   links inside the round 63 dialog shell. Sized from its content; fits without scrolling on desktop and
   laptop heights, and on short screens only the list scrolls while the heading and Close stay put. */

.sh-r83-region .sh-r83-region__card{width:min(736px,100%);padding:32px 40px;display:flex;flex-direction:column;overflow:hidden;max-height:calc(100vh - 48px)}
@supports (height:1dvh){.sh-r83-region .sh-r83-region__card{max-height:calc(100dvh - 48px)}}
.sh-r83-region__head{flex:none;padding-right:48px}
.sh-r83-region__title{margin:0;color:var(--charcoal)}
.sh-r63 .sh-r83-region .sh-r83-region__title:focus,.sh-r63 .sh-r83-region .sh-r83-region__title:focus-visible{outline:none;box-shadow:none}
.sh-r83-region .sh-r83-region__sub{margin:6px 0 12px}
.sh-r83-region .sh-r83-region__list{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:6px}
.sh-r83-region__item{display:block;min-width:0}
.sh-r83-region .sh-r83-region__opt{display:grid;grid-template-columns:minmax(0,1fr) 16px;column-gap:12px;align-items:center;width:100%;box-sizing:border-box;padding:9px 16px;text-decoration:none;color:var(--charcoal)}
.sh-r83-region .sh-r83-region__opt .sh-region__name{grid-column:1;overflow-wrap:anywhere}
.sh-r83-region .sh-r83-region__opt .sh-region__meta{grid-column:1;margin:2px 0 0;text-align:left;max-width:none;flex:none}
.sh-r83-region .sh-r83-region__opt .arrow{grid-column:2;grid-row:1 / span 2;width:16px;height:16px}
/* ROUND 85: nothing moves on hover. The shared selector's 2px slide pushed the right column past the list
   and toggled a horizontal scrollbar, which shifted every row; here hover is a colour and shadow change only,
   and the global scroll-reveal (home.js) is switched off inside the dialog. */
.sh-r63 .sh-r83-region .sh-r83-region__opt{transition:background-color .2s,box-shadow .2s}
.sh-r63 .sh-r83-region .sh-r83-region__opt:hover{transform:none;background:var(--warm-sand);box-shadow:0 2px 6px rgba(0,0,0,.14)}
.js .sh-r83-region .reveal,.js .sh-r83-region .reveal.is-visible{opacity:1!important;transform:none!important;transition:none!important}
.sh-r83-region .sh-r83-region__opt:focus-visible{outline:2px solid var(--sage);outline-offset:-2px;background:var(--warm-sand)}
.sh-r83-region .sh-r83-region__opt.is-current{outline:2px solid var(--sage);outline-offset:-2px}
.sh-r83-region .sh-region__close:focus-visible{outline:2px solid var(--sage);outline-offset:2px}

@media (max-width:767px){
  .sh-r83-region .sh-r83-region__card{padding:28px 20px calc(24px + env(safe-area-inset-bottom,0px));max-height:min(92vh,calc(100vh - 24px))}
  @supports (height:1dvh){.sh-r83-region .sh-r83-region__card{max-height:min(92dvh,calc(100dvh - 24px))}}
  .sh-r83-region .sh-r83-region__list{grid-template-columns:minmax(0,1fr)}
  .sh-r83-region .sh-r83-region__opt{padding:11px 14px}
}
/* Short desktop viewports: a wider card lets the same grid run to three columns (five rows), so the list
   still fits without scrolling. */
@media (min-width:1100px) and (max-height:700px){
  .sh-r83-region .sh-r83-region__card{width:min(1000px,100%)}
}
@media (max-height:520px){
  .sh-r83-region .sh-r83-region__card{padding-top:24px;padding-bottom:20px}
  .sh-r83-region .sh-r83-region__sub{margin-bottom:12px}
}
@media (prefers-reduced-motion:reduce){
  .sh-r83-region .sh-region__scrim,.sh-r83-region .sh-r83-region__card,.sh-r83-region .sh-r83-region__opt{transition:none}
  .sh-r83-region .sh-r83-region__opt:hover{transform:none}
}