/* Loaded in every page head, before the page renders, so these apply on first paint. */
/* Reveal animations start cards slightly scaled up; never let that scroll the page sideways. */
body{overflow-x:clip}

/* Mobile: the links and CTA move into a menu behind the toggle. */
.mn-toggle{display:none}
.mn-panel{display:none}
@media (max-width:860px){
  .mn-links,.mn-cta{display:none!important}
  .mn-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-right:-10px;padding:0;border:0;background:none;color:#E6F0FA;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mn-panel{display:flex;position:fixed;top:72px;left:0;right:0;bottom:0;z-index:49;flex-direction:column;padding:24px clamp(20px,4vw,56px) 40px;background:#010A18;overflow-y:auto;font-family:Geist,Helvetica,sans-serif;transition:opacity .25s,visibility .25s}
}
/* Phones: lighter images and layouts that fit a narrow screen (pages add these hooks). */
@media (max-width:760px){
  [style*="Walk-of-italy.webp"]{background-image:url(/images/portfolio/Walk-of-italy-960.webp)!important}
  [style*="Obsideo.webp"]{background-image:url(/images/portfolio/Obsideo-960.webp)!important}
  [style*="wsl.webp"]{background-image:url(/images/portfolio/wsl-960.webp)!important}
  [style*="ai-group.webp"]{background-image:url(/images/portfolio/ai-group-960.webp)!important}
  [style*="regtech.webp"]{background-image:url(/images/portfolio/regtech-960.webp)!important}
  .m-tall{aspect-ratio:4/3!important}
  .m-hero-img{width:100%!important;opacity:.25!important}
  .m-hero-short{min-height:0!important}
}
