/* Progressive interaction hooks. Page and component styles remain in the generated site stylesheet. */

.js [data-menu-panel][hidden],
.js [data-quote-details][hidden],
.js [data-custom-for][hidden],
.js [data-depends-on][hidden],
.js [data-invoice-details][hidden],
.js [data-accordion-panel][hidden],
[data-site-loader][hidden] {
  display: none !important;
}
html:not(.js) [data-menu-panel][hidden],
html:not(.js) [data-quote-details][hidden],
html:not(.js) [data-custom-for][hidden],
html:not(.js) [data-depends-on][hidden],
html:not(.js) [data-invoice-details][hidden],
html:not(.js) [data-accordion-panel][hidden] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
/* Accordion panels and slide-in submenus stay rendered while they slide closed. */
.js [data-accordion-panel][data-sliding],
.js [data-menu-submenu][data-sliding] {
  display: block !important;
}

.site-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* JS masonry replaces the compiler's column flow without affecting no-JS fallback. */
[data-masonry].is-masonry-ready {
  position: relative;
  display: block;
  column-count: auto;
  column-width: auto;
  column-gap: 0;
}

[data-masonry].is-masonry-ready > [data-masonry-item] {
  position: absolute;
  display: block;
  box-sizing: border-box;
  margin-bottom: 15px;
  break-inside: auto;
}


[data-menu-toggle]:focus-visible,
[data-menu-submenu-toggle]:focus-visible,
[data-dialog-close]:focus-visible,
[data-lightbox-dialog] button:focus-visible,
[data-accordion-trigger]:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}
[data-gallery-filter]:focus-visible,
[data-gallery-page]:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: -3px;
  /* Preserve color fades while displaying keyboard focus immediately. */
  transition-property: color, background-color;
}
[data-accordion-trigger] {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  text-align: inherit;
  cursor: pointer;
}


[data-form-status]:empty {
  display: none;
}

.form-field-error {
  color: #a32616;
  font-size: 0.9em;
  line-height: 1.35;
  margin: 0.35rem 0 0;
}

form[data-submitting="true"] {
  cursor: progress;
}

form [name="website"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* The poster overlay fills the video box, so its focus ring sits inside the edge. */
[data-video-overlay][role="button"]:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: -3px;
}
[data-video-overlay][hidden] {
  display: none !important;
}

/* The original slide-in menu was shown off-canvas and moved by its own `right` transition;
   site.js writes the inline `right` offsets, so the stylesheet's right: -100% never shows. */
[data-menu-slide]:not([hidden]) {
  display: block;
}

[data-menu-submenu-toggle] {
  position: absolute;
  top: 10px;
  right: 0;
  display: block;
  width: 21px;
  height: 21px;
  margin: 0;
  padding: 0;
  border: 0;
  appearance: none;
  color: inherit;
  background: transparent;
  font: inherit;
  line-height: 1;
  opacity: 0.6;
  cursor: pointer;
  transition: transform 0.5s;
}
[data-menu-submenu-toggle]::before {
  content: "3";
  display: block;
  width: 21px;
  height: 21px;
  color: inherit !important;
  font-family: site-icons-modules;
  font-size: 21px;
  font-weight: 400;
  line-height: 21px;
  text-align: center;
  -webkit-font-smoothing: antialiased;
}
[data-menu-submenu-toggle][aria-expanded="true"] {
  transform: rotate(180deg);
}
[data-menu-submenu][hidden] {
  display: none !important;
}
html:not(.js) [data-menu-submenu][hidden] {
  display: block !important;
  visibility: visible !important;
}
[data-menu-submenu].is-open {
  display: block !important;
}
[data-menu-submenu].is-open > li {
  opacity: 1 !important;
}

/* Divi entrance animations start hidden (its .et_animated state) until site.js runs them
   on scroll entry. Without scripts, or with reduced motion, content stays visible. */
@media (prefers-reduced-motion: no-preference) {
  .js [data-animation]:not([data-animation-state]) {
    opacity: 0;
  }
}
html:not(.js) [data-animation],
html:not(.js) [data-waypoint] {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

/* Divi Areas faded the newsletter popup in over 400 ms (swing) while its overlay dimmed the
   page fully at once; closing hid both instantly with no fade-out. */
.js dialog[data-newsletter-dialog] {
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.37, 0, 0.63, 1);
}
.js dialog[data-newsletter-dialog].is-open {
  opacity: 1;
}

/* The lightbox follows the captured Magnific overlay (masonry gallery profile):
   rgba(0, 0, 0, .8) backdrop, white edge controls and a centered image. */
dialog.lightbox-dialog {
  box-sizing: border-box;
  width: 100vw;
  max-width: none;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  margin: 0;
  border: 0;
  padding: 0;
  overflow: hidden;
  color: #fff;
  background: transparent;
}

dialog.lightbox-dialog::backdrop {
  background: rgb(0 0 0 / 80%);
}

dialog.lightbox-dialog:not([open]) {
  display: none;
}

/* Magnific's .mfp-container: 8 px side padding (6 px at <= 900 px), eased over the
   gallery's 0.3 s ease-out when a resize crosses 900 px. As in Magnific, the image
   keeps its natural size (never upscaled), capped at 100 % of the padded width (so it
   follows the padding transition) and the full viewport height (the gallery zeroed
   Magnific's 40 px image padding). */
.lightbox-shell {
  position: relative;
  display: grid;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0 8px;
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
  place-items: center;
  transition: padding 0.3s ease-out;
}

.lightbox-figure {
  display: grid;
  max-width: 100%;
  margin: 0;
  place-items: center;
}

.lightbox-image {
  display: block;
  max-width: 100%;
  max-height: 100vh;
  max-height: 100dvh;
}

/* Magnific's fade effect (300 ms ease-out) on the content; the gallery's backdrop
   stayed fully opaque. */
.lightbox-figure,
.lightbox-close {
  opacity: 0;
  transition: opacity 0.3s ease-out;
}
dialog.lightbox-dialog.is-open .lightbox-figure,
dialog.lightbox-dialog.is-open .lightbox-close {
  opacity: 1;
}

.lightbox-close,
.lightbox-prev,
.lightbox-next {
  position: absolute;
  z-index: 2;
  box-sizing: border-box;
  margin: 0;
  border: 0;
  padding: 0;
  color: #fff;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: center;
}

/* Control boxes measured on the original: close 44 × 44 in the top-right corner with
   Magnific's "×" in Arial 28 px. Arrows copy Magnific + Divi: a 48 × 48 button with a
   13.3333 px strut, top 50 % less 32 px, 0 / 10 px from the edges, and an inline
   ::after drawing the Divi module icon font's "4" / "5" at 64 px / line-height 1;
   at <= 900 px the whole button scales by .75 from its outer edge. */
.lightbox-close {
  top: 0;
  right: 0;
  width: 44px;
  height: 44px;
  font: 400 28px/44px Arial, Baskerville, monospace;
}

.lightbox-prev,
.lightbox-next {
  top: 50%;
  width: 48px;
  height: 48px;
  margin-top: -32px;
  font-size: 13.3333px;
  line-height: 1em;
}

.lightbox-prev::after,
.lightbox-next::after {
  font-family: site-icons-modules;
  font-size: 64px;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}

.lightbox-prev::after {
  content: "4";
}

.lightbox-next::after {
  content: "5";
}

.lightbox-prev {
  left: 0;
}

.lightbox-next {
  right: 10px;
}

/* The original gallery lightbox showed no caption or counter; both remain
   available to assistive technology only. */
.lightbox-caption,
.lightbox-count {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@media (max-width: 900px) {
  .lightbox-shell {
    padding: 0 6px;
  }

  .lightbox-prev,
  .lightbox-next {
    transform: scale(0.75);
  }

  .lightbox-prev {
    transform-origin: 0;
  }

  .lightbox-next {
    transform-origin: 100%;
  }
}

/* Reduced motion (a documented deviation: the original ignored it) shows every final
   state at once: entrances, icons, typing, menus, popups, the lightbox and the header. */
@media (prefers-reduced-motion: reduce) {
  [data-waypoint] {
    opacity: 1 !important;
    animation: none !important;
  }
  [data-typing-cursor=""] {
    animation: none !important;
  }
  .js dialog[data-newsletter-dialog],
  .lightbox-shell,
  .lightbox-figure,
  .lightbox-close,
  [data-menu-slide],
  [data-menu-submenu] > li,
  [data-fixed-header],
  [data-fixed-header] *,
  .site-animated-content {
    transition: none !important;
  }
}