@font-face{font-family:'SGE';src:url('assets/fonts/SpecialGothicExpandedOne-regular.ttf');font-display:swap}
@font-face{font-family:'Mont';src:url('assets/fonts/Montserrat-regular.ttf');font-weight:400;font-display:swap}
@font-face{font-family:'Mont';src:url('assets/fonts/Montserrat-bold.ttf');font-weight:700;font-display:swap}
html,body{margin:0;padding:0;background:#FFF8F9;color:#2B161C;font-family:'Mont',Helvetica,Arial,sans-serif}
a{color:#C60639;text-decoration:none}
a:hover{color:#8F0429}
::selection{background:#F2C6D2}
img{max-width:100%}
/* Placeholder shown for images that are pending upload / not in this bundle */
.img-ph{display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;background:linear-gradient(135deg,#F7DCE3,#F2C6D2);color:#8F0429;font-size:12px;font-weight:700;line-height:1.4;font-family:'Mont',Helvetica,Arial,sans-serif;box-sizing:border-box}
#tech-gallery::-webkit-scrollbar{display:none}
#tech-gallery{scrollbar-width:none}

/* ------------------------------------------------------------------ */
/* Mobile / responsive overrides.                                      */
/* The pages use inline styles (desktop-first), so these use !important */
/* to override them. Attribute selectors catch the inline patterns.     */
/* ------------------------------------------------------------------ */
@media (max-width: 768px) {
  /* Nav: let the pill links wrap onto their own line instead of
     overflowing off-screen (Careers/Contact were being cut off). */
  nav { padding: 12px 16px !important; flex-wrap: wrap !important; row-gap: 10px; }
  nav > div { flex-wrap: wrap !important; gap: 10px 14px !important; font-size: 12px !important; justify-content: flex-start !important; }

  /* Collapse every multi-column grid to a single column. minmax(0,1fr)
     (not bare 1fr) lets the track shrink below fixed-width children so
     wide items like the Technology gallery can't force horizontal scroll. */
  [style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; }

  /* Fixed-px-width containers (e.g. the 560px tech gallery) must fit. */
  [style*="width:560px"], [style*="width: 560px"] { width: 100% !important; }

  /* Trim the desktop 48px side padding on centered containers. */
  [style*="margin:0 auto"] { padding-left: 20px !important; padding-right: 20px !important; }

  /* Headings sized for desktop overflow narrow screens. */
  h1 { font-size: clamp(30px, 8.5vw, 44px) !important; line-height: 1.05 !important; }
  h2 { font-size: clamp(26px, 6.5vw, 38px) !important; }
  h1, h2, h3, p, div { overflow-wrap: break-word; }

  /* Never let media force horizontal scroll. */
  img, iframe, video { max-width: 100% !important; }

  /* Home hero decorative illustration is absolutely positioned off to
     the right at fixed px — hide it on mobile so it can't cause overflow. */
  header img[alt=""] { display: none !important; }
}