/* The only stylesheet authored for this migration rather than ported.
 *
 * It lives in /site-css/ rather than /styles/ on purpose: /styles/ is generated
 * wholesale by tools/emit-css.mjs and gets cleared on every regeneration, which
 * silently deleted this file once.
 *
 * Everything under /styles is Duda's own cascade, copied out of the live
 * document.styleSheets with nothing changed but the url() targets. This file
 * exists for two things Duda never had to solve, and nothing else.
 *
 * The media conditions match src/lib/device.ts, the stylesheet media
 * attributes, and the pre-paint script. The split is by WIDTH — see src/lib/device.ts for why `pointer: coarse`
 * could not be used (Playwright's full-page screenshot resets touch emulation
 * mid-capture, flipping every pointer-gated rule).
 */

/* === 1. three device layouts in one document ==========================
 * Duda serves a separate DOCUMENT per device, each containing only its own
 * header, so its CSS never had to hide the other two. Ours carries all three.
 */

/* --- desktop: the horizontal nav, no hamburger ------------------------- */
@media (min-width: 1025px) {
  #hamburger-header-container,
  .layout-drawer,
  .layout-drawer-overlay,
  .layout-drawer-hamburger,
  .dmBackToTop {
    display: none !important;
  }
}

/* --- tablet and phone: the hamburger header, no horizontal nav --------- */
@media (max-width: 1024px) {
  .dmHeaderContainer {
    display: none !important;
  }
}

/* data-pm-device marks a subtree that belongs to ONE device document.
 *
 * Two things use it. The hamburger header and drawer: Duda ships distinct
 * markup for tablet (dmtemplateid="Hamburger") and phone
 * (dmtemplateid="mobileHamburgerLayout"), not a restyle of one. And photo
 * galleries: Duda bakes the grid into the DOM, so desktop and tablet get
 * `photogallery-column column-3` in two rows while the phone gets `column-2`
 * in three — no stylesheet can regroup rows, so each device carries its own
 * subtree and the others are hidden.
 */
@media (min-width: 1025px) {
  [data-pm-device="t"], [data-pm-device="m"] { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  [data-pm-device="d"], [data-pm-device="m"] { display: none !important; }
  .dmBackToTop { display: none !important; }   /* phone document only */
}
@media (max-width: 767px) {
  [data-pm-device="d"], [data-pm-device="t"] { display: none !important; }
}

/* === 2. honeypot =======================================================
 * Duda relies on reCAPTCHA for spam protection and its keys are
 * domain-restricted, so removing the widget (which we do) would leave these
 * forms with no protection at all. The honeypot replaces it.
 *
 * Taken OUT OF FLOW rather than display:none, for two reasons: bots know to
 * skip an obviously-hidden field, and an in-flow hidden row costs real layout.
 * It cost exactly 14px on every page carrying a form until this rule existed —
 * enough to shift the entire footer and show up on every comparison.
 */
.website-row {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}