/* Nestor rehydration shim — restores JS behaviors stripped during site import.
   Scoped with nl- prefixes so it can't collide with the captured theme. */

/* Lightbox — lighter overlay + smaller framed image with rounded corners to
   match the original react-image-lightbox look on groupeintegro.com. */
.nl-lb{position:fixed;inset:0;z-index:2147483000;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.65);opacity:0;transition:opacity .2s ease;}
.nl-lb.open{display:flex;opacity:1;}
.nl-lb-fig{margin:0;max-width:80vw;max-height:78vh;display:flex;align-items:center;justify-content:center;}
.nl-lb-img{max-width:80vw;max-height:78vh;object-fit:contain;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.45);}
.nl-lb button{position:absolute;background:rgba(0,0,0,.35);color:#fff;border:0;cursor:pointer;line-height:1;
  width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:34px;transition:background .2s;}
.nl-lb button:hover{background:rgba(255,255,255,.22);}
.nl-lb-close{top:18px;right:18px;font-size:30px;}
.nl-lb-prev{left:18px;top:50%;transform:translateY(-50%);}
.nl-lb-next{right:18px;top:50%;transform:translateY(-50%);}
.nl-lb-count{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);background:none;color:#fff;
  width:auto;height:auto;font-size:14px;opacity:.8;border-radius:0;}
@media(max-width:640px){.nl-lb button{width:44px;height:44px;font-size:26px;}
  .nl-lb-fig,.nl-lb-img{max-width:92vw;max-height:72vh;}}

/* Defensive sticky header (only applied when the captured header lost its fixed CSS) */
.nl-fixed-header{position:sticky;top:0;z-index:1000;background:var(--nl-header-bg,#fff);
  box-shadow:0 2px 12px rgba(0,0,0,.08);}

/* Carousel arrows we may need to reveal */
.nl-car-arrow-shown{opacity:1!important;visibility:visible!important;pointer-events:auto!important;}

/* --------------------------------------------------------------------------
   Groupe Integro captured-theme fixes.
   These override quirks introduced when the react-slick / emotion / react-tabs
   runtime was stripped at import. Scoped under .page-container so they only
   affect the mirrored captured markup, not the platform chrome.
   ----------------------------------------------------------------------- */

/* 1) Hero fills the viewport at desktop widths.
      react-slick left an inline `height:900px` on `.slick-list` at capture
      time, which caps the hero below the fold on tall screens. */
@media (min-width: 1024px) {
  .page-container main .carousel-module .slick-list { height: 100vh !important; }
}

/* 2) Services dropdown must appear on hover / when the aria-expanded state
      is on. The captured CSS hides the menu (rotateX(-90deg), visibility
      hidden) and depends on React runtime to toggle it back. */
@media (min-width: 1024px) {
  .page-container .subnav-menu:hover .dropdown__menu,
  .page-container .subnav-menu:focus-within .dropdown__menu,
  .page-container .dropdown__menu[aria-hidden="false"] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: rotateX(0deg) translateX(0px) !important;
  }
}

/* 3) Active nav link (`.css-7r21xh`) matches inactive-link padding so the
      2px white left border spans the full nav height like siblings. */
@media (min-width: 1024px) {
  .page-container .css-7r21xh { padding: 40px 20px !important; }
}
@media (min-width: 1280px) {
  .page-container .css-7r21xh { padding: 40px 25px !important; }
}

/* 4) Mask-reveal animation for images/wrappers that shipped inline
      `clip-path: inset(0%)` + `transition: clip-path 0.8s`. The initial
      state below hides them behind a top-anchored mask; nestor-rehydrate.js
      flips the mask off when the element scrolls into view. */
.page-container [style*="clip-path: inset(0%)"]:not([data-nl-cp-in="1"]) {
  clip-path: inset(0 0 100% 0) !important;
}
