/* BHJ — Contact · Global Offices list and Global Office Map (wireframe P11).
   Loaded after contact.css. The offices are a plain two-column list again
   (no tabs); the map is its own section below it. */

/* ---- Global Offices: every office visible, two columns ---- */
.page-contact .offices-section .office-panels{margin-top:3rem;gap:1.5rem;align-items:stretch}
.page-contact .offices-section .office{display:flex;flex-direction:column;padding:2rem 2.25rem;border-top:.1875rem solid #35b2d2}
.page-contact .offices-section .office h3{font-size:1.375rem;margin-bottom:1rem}
.page-contact .offices-section .office__addr{font-size:1.0625rem;line-height:1.75;margin:0 0 1.5rem}
.page-contact .offices-section .office__c{margin-top:auto;font-size:1rem;line-height:1.9;padding-top:1.25rem}

/* ---- Global Office Map ---- */
.page-contact .office-map-section .sechead{margin-bottom:0}
.office-map-frame{position:relative;margin-top:3rem}
.office-map{position:relative;aspect-ratio:7/4;overflow:hidden;
  border:.0625rem solid #d7e6f0;border-radius:.75rem;background:#eef5fa}
.office-map__stage{position:absolute;left:0;top:0;width:100%;height:100%;
  background:url(../img/office-map.svg) center/100% 100% no-repeat}
.office-map__layer{position:absolute;inset:0;pointer-events:none}

/* list of pins: visible fallback before the script runs */
.office-map__pins{list-style:none;margin:0;padding:1.5rem;display:flex;flex-wrap:wrap;gap:.5rem;align-content:center;justify-content:center;height:100%}
.office-map__pins li{font-size:.8125rem;font-weight:600;color:#0F3193;background:#fff;border:1px solid #dce7ef;border-radius:2rem;padding:.35rem .85rem}
.office-map.is-ready .office-map__pins{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.office-map__cities{position:absolute;right:1.5rem;bottom:1.25rem;left:1.5rem;z-index:1;margin:0;
  text-align:right;font-size:.875rem;line-height:1.7;color:#5b7a90;pointer-events:none}
.office-map__cities span{white-space:nowrap}

.office-pin{position:absolute;width:0;height:0;padding:0;margin:0;border:0;background:none;font:inherit;color:inherit;cursor:pointer}
.office-pin:focus{outline:none}
.office-pin__dot{position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;
  background:#0F3193;box-shadow:0 0 0 2.5px #fff,0 2px 8px rgba(15,49,147,.35);transition:background .3s,transform .3s}
.office-pin__dot::before{content:"";position:absolute;inset:-12px;border-radius:50%}
.office-pin__dot::after{content:"";position:absolute;inset:-8px;border-radius:50%;
  background:rgba(53,178,210,.35);animation:office-pulse 2.8s ease-out infinite}
.office-pin:nth-of-type(3n+2) .office-pin__dot::after{animation-delay:.9s}
.office-pin:nth-of-type(3n) .office-pin__dot::after{animation-delay:1.8s}
@keyframes office-pulse{
  0%{transform:scale(.45);opacity:.9}
  70%,100%{transform:scale(1.7);opacity:0}
}
.office-pin__label{position:absolute;left:0;top:0;white-space:nowrap;font-size:.875rem;line-height:1.2;font-weight:600;
  color:#153f62;text-shadow:0 0 3px #eef5fa,0 0 3px #eef5fa,0 0 6px #eef5fa;transition:color .3s}
.office-pin:hover .office-pin__dot,.office-pin:focus-visible .office-pin__dot,.office-pin.is-active .office-pin__dot{background:#35b2d2;transform:scale(1.25)}
.office-pin:hover .office-pin__label,.office-pin.is-active .office-pin__label{color:#0F3193}
.office-pin:focus-visible .office-pin__label{outline:2px solid #35b2d2;outline-offset:3px;border-radius:2px}

.office-map__card{position:absolute;left:0;top:0;z-index:2;width:max-content;max-width:min(20rem,calc(100% - 1.5rem));
  padding:.875rem 1rem;border-radius:.5rem;background:#fff;border-top:3px solid #35b2d2;box-shadow:0 12px 32px rgba(11,38,63,.16);
  opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s}
.office-map__card.is-open{opacity:1;visibility:visible;transition:opacity .25s}
.office-map__card strong{display:block;font-size:.9375rem;line-height:1.4;color:#0F3193}
.office-map__card span{display:block;margin-top:.375rem;font-size:.8125rem;line-height:1.6;color:#385a73}

@media (max-width:60rem){
  .office-map{aspect-ratio:4/3}
}
@media (max-width:40rem){
  .page-contact .offices-section .office{padding:1.5rem}
  .page-contact .offices-section .office h3{font-size:1.1875rem}
  .office-map-frame{margin-top:2rem}
  .office-map{aspect-ratio:1/1}
  .office-map__cities{position:static;margin-top:.875rem;text-align:left;font-size:.8125rem;line-height:1.7}
  .office-pin__label{font-size:.75rem}
  .office-pin__dot{left:-5px;top:-5px;width:10px;height:10px}
  .office-pin__dot::before{inset:-6px}
}
@media (prefers-reduced-motion:reduce){
  .office-pin__dot::after{animation:none;opacity:0}
}