/* MFN public portfolio — fixed 3-column masonry + masked hologram interaction. */

.mfn-native-tilt-gallery{
  width:100%!important;
  max-width:100%!important;
}

/*
 * Once JS has measured the artwork, the gallery becomes a positioned masonry
 * canvas. This intentionally bypasses Elementor flex/grid responsive widths and
 * Safari multi-column balancing. The existing Elementor nodes are never moved.
 */
.mfn-native-tilt-gallery.mfn-suite-masonry-ready{
  display:block!important;
  position:relative!important;
  columns:auto!important;
  column-count:unset!important;
  column-width:auto!important;
  column-gap:0!important;
  overflow:visible!important;
  perspective:1400px;
}

.mfn-native-tilt-gallery.mfn-suite-masonry-ready>.mfn-holo-slot{
  display:block!important;
  position:absolute!important;
  box-sizing:border-box!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  align-self:auto!important;
  break-inside:auto!important;
  overflow:visible!important;
}

.mfn-native-tilt-gallery .mfn-holo-card{
  width:100%!important;
  max-width:100%!important;
  position:relative!important;
  isolation:isolate!important;
  will-change:transform,translate,box-shadow;
}

/* Keep the foil strictly inside the artwork. The outer card can still glow. */
.mfn-native-tilt-gallery .mfn-holo-card .elementor-widget-container,
.mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-element,
.mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-container,
.mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-layer,
.mfn-native-tilt-gallery .mfn-holo-card a{
  position:relative!important;
  overflow:hidden!important;
  border-radius:18px!important;
  clip-path:inset(0 round 18px)!important;
  -webkit-clip-path:inset(0 round 18px)!important;
}
.mfn-native-tilt-gallery .mfn-holo-card a{
  isolation:isolate!important;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
}
.mfn-native-tilt-gallery .mfn-holo-card a::before,
.mfn-native-tilt-gallery .mfn-holo-card a::after{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  border-radius:18px!important;
  overflow:hidden!important;
  clip-path:inset(0 round 18px)!important;
  -webkit-clip-path:inset(0 round 18px)!important;
  pointer-events:none!important;
}
.mfn-native-tilt-gallery .mfn-holo-card img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  border-radius:18px!important;
  clip-path:inset(0 round 18px)!important;
  -webkit-clip-path:inset(0 round 18px)!important;
}

/* Touch stays scrollable while a held card remains holographically active. */
@media (hover:none), (pointer:coarse), (max-width:1024px){
  .mfn-native-tilt-gallery .mfn-holo-card,
  .mfn-native-tilt-gallery .mfn-holo-card a{
    touch-action:pan-y pinch-zoom!important;
    -ms-touch-action:pan-y!important;
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
  }
  .mfn-native-tilt-gallery .mfn-holo-card a,
  .mfn-native-tilt-gallery .mfn-holo-card img{
    pointer-events:auto!important;
    -webkit-user-drag:none!important;
  }
}

@media(max-width:767px){
  .mfn-native-tilt-gallery .mfn-holo-card .elementor-widget-container,
  .mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-element,
  .mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-container,
  .mfn-native-tilt-gallery .mfn-holo-card .elementor-motion-effects-layer,
  .mfn-native-tilt-gallery .mfn-holo-card a,
  .mfn-native-tilt-gallery .mfn-holo-card a::before,
  .mfn-native-tilt-gallery .mfn-holo-card a::after,
  .mfn-native-tilt-gallery .mfn-holo-card img{
    border-radius:12px!important;
    clip-path:inset(0 round 12px)!important;
    -webkit-clip-path:inset(0 round 12px)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mfn-native-tilt-gallery .mfn-holo-card{
    transform:none!important;
    translate:0 0!important;
    transition:none!important;
  }
}

/* Shared MFN public portfolio header. The existing Elementor header container is
 * retained as the mounting point, but its fragile nested-anchor contents are
 * replaced in-place by six real navigation links from public-portfolio.js. */
.mfn-suite-public-header-ready{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  background:#05070A!important;
  border:0!important;
  border-bottom:3px solid #FFF200!important;
  overflow:visible!important;
  position:relative!important;
  z-index:50!important;
}
.mfn-suite-public-header__inner{
  box-sizing:border-box;
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding:6px 56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.mfn-suite-public-header__brand{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 245px;
  width:245px;
  line-height:0;
}
.mfn-suite-public-header__brand img{
  display:block;
  width:100%;
  height:auto;
  max-width:245px;
}
.mfn-suite-public-header__nav{
  width:72%;
  display:flex;
  flex-flow:row wrap;
  justify-content:flex-end;
  align-items:center;
  gap:9px 13px;
}
.mfn-suite-public-header__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:7px 2px;
  border:0;
  background:transparent;
  color:#F7F8FA!important;
  font-family:Montserrat,Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  line-height:1.15;
  letter-spacing:.6px;
  text-transform:uppercase;
  text-decoration:none!important;
  white-space:nowrap;
  transition:color .2s ease,background-color .2s ease,border-color .2s ease;
}
.mfn-suite-public-header__link:hover,
.mfn-suite-public-header__link:focus-visible{
  color:#FFF200!important;
  outline:none;
}
.mfn-suite-public-header__link.is-active{
  color:#FFF200!important;
  font-weight:800;
}
.mfn-suite-public-header__link--cta{
  min-height:34px;
  padding:10px 15px;
  border:1px solid #FFF200;
  border-radius:7px;
  background:#FFF200;
  color:#05070A!important;
  font-weight:800;
  letter-spacing:.7px;
}
.mfn-suite-public-header__link--cta:hover,
.mfn-suite-public-header__link--cta:focus-visible{
  border-color:#6FCCDD;
  background:#6FCCDD;
  color:#05070A!important;
}

/* Override WordPress/theme global anchor and visited-link colors. */
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link:link,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link:visited{
  color:#F7F8FA!important;
}
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link:hover,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link:focus-visible{
  color:#FFF200!important;
}
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link.is-active,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link.is-active:link,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link.is-active:visited{
  color:#FFF200!important;
}
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link--cta,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link--cta:link,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link--cta:visited,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link--cta:hover,
.mfn-suite-public-header-ready .mfn-suite-public-header__nav .mfn-suite-public-header__link--cta:focus-visible{
  color:#05070A!important;
}
@media(max-width:1024px){
  .mfn-suite-public-header__inner{padding:6px 40px}
  .mfn-suite-public-header__brand{flex-basis:220px;width:220px}
  .mfn-suite-public-header__brand img{max-width:220px}
  .mfn-suite-public-header__nav{width:72%;gap:9px 12px}
}
@media(max-width:767px){
  .mfn-suite-public-header__inner{
    padding:8px 20px 9px;
    flex-direction:column;
    justify-content:center;
    gap:8px;
  }
  .mfn-suite-public-header__brand{flex:0 0 auto;width:220px;max-width:72vw}
  .mfn-suite-public-header__brand img{max-width:220px}
  .mfn-suite-public-header__nav{
    width:100%;
    justify-content:center;
    gap:10px 14px;
  }
  .mfn-suite-public-header__link{font-size:12px}
  .mfn-suite-public-header__link--cta{padding:10px 14px}
}


/* 1.1.26 — Account + Request a Project public-page accessibility layer. */
body.mfn-public-my-account :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible,
body.mfn-public-new-job :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid #6FCCDD!important;
  outline-offset:3px!important;
}
body.mfn-public-new-job .mfncp-request-form input,
body.mfn-public-new-job .mfncp-request-form textarea,
body.mfn-public-new-job .mfncp-request-form select{
  border-color:#617083!important;
}
body.mfn-public-new-job .mfncp-request-form select{
  background:#0B1017!important;
  color:#F7F8FA!important;
}
body.mfn-public-my-account #account-panel .um-form input[type=text],
body.mfn-public-my-account #account-panel .um-form input[type=email],
body.mfn-public-my-account #account-panel .um-form input[type=password],
body.mfn-public-my-account #account-panel .um-form textarea,
body.mfn-public-my-account #account-panel .um-form select{
  border-color:#617083!important;
}
body.mfn-public-my-account #account-panel .um-account-side li a span.um-account-icon{
  border-right-color:#617083!important;
}
body.mfn-public-my-account #account-panel .um-account-main a:not(.um-button):not([class*="button"]){
  text-decoration:underline!important;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
}
body.mfn-public-my-account .mfn-client-workspace-actions a,
body.mfn-public-new-job .mfncp-button{
  min-height:44px!important;
}


/* 1.1.34 — Resources accessibility consistency. */
body.mfn-public-resources .mfn-resources-tag-accent .elementor-heading-title{color:var(--mfn-color-magenta-text,#CB60B2)!important}
body.mfn-public-resources .elementor-widget-button a.elementor-button:focus-visible,
body.mfn-public-resources .elementor-widget-image a:focus-visible{outline:3px solid var(--mfn-color-focus,#6FCCDD)!important;outline-offset:3px!important}
