/* ============================================================
   device-switch.css — THE ONLY HAND-WRITTEN CSS IN THIS BUILD.

   Duda serves three separate documents (desktop / tablet / mobile),
   each with its own header markup and its own stylesheet. This
   rebuild is one responsive document, so all three header blocks
   are present and gated by the same breakpoints Duda itself uses:

     mobile   <= 767px
     tablet   768px - 1024px   (laid out on a 960px canvas, as the
                                original's <meta viewport> dictates)
     desktop  >= 1025px

   Everything else on the page is Duda's own CSS, ported unchanged.
   ============================================================ */

@media (max-width: 767px) {
  .tbc-dev-desktop,
  .tbc-dev-tablet {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .tbc-dev-desktop,
  .tbc-dev-mobile {
    display: none !important;
  }
}

@media (min-width: 1025px) {
  .tbc-dev-tablet,
  .tbc-dev-mobile {
    display: none !important;
  }
}

/* Duda's runtime injects the drawer's open/closed state. Without its JS the
   drawer must start closed; the layout's script drives it from here. */
.tbc-drawer-closed {
  display: none !important;
}

/* The tablet and mobile documents have no #iscrollBody — only the desktop one
   does. Our single document keeps it (desktop rules need it), so below 1025px
   its inherited `.dmBodyNoIscroll #iscrollBody { overflow-y: auto }` has to be
   neutralised. Left as-is it becomes an inner scroll container and the page
   paints offset from its own layout in a full-page screenshot. */
@media (max-width: 1024px) {
  #iscrollBody {
    overflow: visible !important;
    height: auto !important;
  }
}

/* Duda runs skrollr parallax on the DESKTOP document only — the tablet and
   mobile documents load a runtime that never initialises it, so their parallax
   rows keep the CSS default. The markup here was captured from the desktop DOM
   after skrollr had run, so it carries that frozen state inline
   (`class="… skrollable skrollable-between"` + `style="background-position:
   50% -25.5426px"`). Inline styles beat any normal rule, so below 1025px the
   desktop offset has to be undone explicitly. Where Duda's own mobile sheet
   already pins one of these rows (it does for u_1325247579), its id-level
   selector outranks this and still wins. */
@media (max-width: 1024px) {
  .skrollable[style*="background-position"] {
    background-position: 0% 0% !important;
  }
}

/* Duda gates its scroll-in animations from CSS:

     .dmDesktopBody:not(.editGrid) [data-anim-desktop]:not([data-anim-desktop="none"])
       { visibility: hidden }

   and its runtime clears that once the widget scrolls into view. This build has
   no animation runtime, so without an override the widget stays hidden forever.
   One element on the site is affected — the green panel on
   /basement-finishing-west-boxbury — and the end state a visitor sees is
   visible, so that is what ships. */
[data-anim-desktop]:not([data-anim-desktop="none"]),
[data-anim-tablet]:not([data-anim-tablet="none"]),
[data-anim-mobile]:not([data-anim-mobile="none"]) {
  visibility: visible !important;
}

/* Photo galleries are the other widget Duda lays out in JavaScript rather than
   CSS: it reads data-desktop-columns / data-mobile-columns and builds a grid of
   .photogallery-row > .photogallery-column.column-N at runtime. A static copy
   can only carry one grid, so each gallery ships both — the one Duda builds at
   >= 768px and the one it builds at <= 767px — and the breakpoint picks. */
@media (max-width: 767px) {
  .dmPhotoGallery > .layout-container.tbc-gal-large {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .dmPhotoGallery > .layout-container.tbc-gal-small {
    display: none !important;
  }
}

/* The forms carry no reCAPTCHA. Duda's site key belongs to Duda's own account
   and is registered to Duda-hosted domains, so it cannot validate here — it
   would either fail closed and swallow real leads or render nothing at all.
   The widget is removed outright rather than left as a reserved gap, and this
   honeypot is the spam protection: a field no human sees, which the handler
   uses to drop bots. It must stay empty and stay out of the tab order. */
.dmform-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
