/* Start custom CSS *//* ===== Bluem Our Offices page (4470) =====
   Scoped to .page-id-4470. Hooks use Elementor data-ids because the kit has reached
   the 1000 global class limit. JS (Custom Code "Bluem Our Offices: map, cards, copy, marquee")
   adds the state classes: ofc-is-active (card + map pin), ofc-copied (copy button), ofc-marquee-on (logo track). */

/* --- Office cards: active / hover state (Figma "Office / Location Card" State=Hover) --- */
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active { background-color: var(--bl-brand-primary); border-color: var(--bl-brand-primary); box-shadow: none; }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active h3,
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div .e-paragraph-base { color: var(--bl-surface); }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div:nth-child(2) .e-paragraph-base { opacity: 0.8; }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div:first-child > div.e-con:last-child { background-color: rgba(255,255,255,0.12); }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div:nth-child(3) svg path { fill: var(--bl-surface); }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div:nth-child(3) button:hover svg path,
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div:nth-child(3) button:focus-visible svg path { fill: var(--bl-brand-primary); }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > a { background-color: var(--bl-blue-50); border-color: var(--bl-blue-50); }
.page-id-4470 [data-id="3fa7fadc"] > article.ofc-is-active > div .e-paragraph-base:hover { color: var(--bl-brand-accent-200); }
.page-id-4470 [data-id="3fa7fadc"] svg path { transition: fill 0.3s; }

/* --- Copy button: Default / Hover / Copied (Figma "Office / Copy Button") --- */
.page-id-4470 [data-id="3fa7fadc"] button.ofc-copied { background-color: var(--bl-brand-primary) !important; }
.page-id-4470 [data-id="3fa7fadc"] button.ofc-copied > :first-child { display: none !important; }
.page-id-4470 [data-id="3fa7fadc"] button.ofc-copied > :last-child { display: block !important; }
.page-id-4470 [data-id="3fa7fadc"] button.ofc-copied > :last-child svg path { fill: #ffffff !important; }
.page-id-4470 [data-id="3fa7fadc"] button:focus-visible,
.page-id-4470 [data-id="45cc0e8a"] button:focus-visible { outline: 2px solid var(--bl-brand-accent); outline-offset: 2px; }

/* --- Map pins + tooltip (Figma "Office / Map Pin", "Office / Map Tooltip") --- */
.page-id-4470 [data-id="45cc0e8a"] > button.ofc-is-active > :first-child { opacity: 0 !important; }
.page-id-4470 [data-id="45cc0e8a"] > button.ofc-is-active > :last-child { opacity: 1 !important; }
.page-id-4470 [data-id="45cc0e8a"] > button.ofc-is-active { z-index: 4; }
.page-id-4470 [data-id="30e2486c"].ofc-flip { flex-direction: row-reverse; }
.page-id-4470 [data-id="30e2486c"].ofc-flip > :first-child { transform: scaleX(-1); }

/* --- Trust logo marquee (same behaviour as the other Bluem pages) --- */
@keyframes ofc-logo-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.page-id-4470 [data-id="1ca58cc1"].ofc-marquee-on { animation: ofc-logo-marquee 36s linear infinite; will-change: transform; }
.page-id-4470 [data-id="5356c4b6"]:hover [data-id="1ca58cc1"].ofc-marquee-on { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .page-id-4470 [data-id="1ca58cc1"].ofc-marquee-on { animation: none; }
  .page-id-4470 [data-id="3fa7fadc"] *, .page-id-4470 [data-id="45cc0e8a"] * { transition: none !important; }
}

/* --- HQ contact items on phones: two equal columns so the phone number stays on one line --- */
@media (max-width: 767px) {
  .page-id-4470 [data-id="6a246a0d"] > [data-id="6a2a59de"],
  .page-id-4470 [data-id="6a246a0d"] > [data-id="50b0d461"],
  .page-id-4470 [data-id="6a246a0d"] > [data-id="451647d8"],
  .page-id-4470 [data-id="6a246a0d"] > [data-id="5aac19b5"] { flex: 0 0 calc(50% - 12px); max-width: calc(50% - 12px); }
  .page-id-4470 [data-id="6a246a0d"] [data-id="33ab8474"] { white-space: nowrap; }
}
@media (max-width: 374px) {
  .page-id-4470 [data-id="6a246a0d"] [data-id="33ab8474"] { font-size: 13px; letter-spacing: 0; }
}/* End custom CSS */