/* The ONLY hand-written stylesheet in this build.
 *
 * Everything else under /styles is Duda's own cascade, ported verbatim from what
 * the live documents actually load, with nothing but url() rewritten. This file
 * exists for the few things that cannot come from there: the device gating a
 * single-document build needs, the honeypot that replaces reCAPTCHA, the blog
 * "Show More" reveal, and one parallax behaviour Duda implements in JS rather
 * than in CSS.
 *
 * The breakpoints below are Duda's own — READ OUT OF THIS SITE'S OWN RUNTIME
 * PACKAGE, not inherited from another migration (measured: 767 / 768 / 1024 /
 * 1025 are the only device breakpoints it declares). They MUST stay identical to
 * the ones tools/port-css.mjs media-gates the ported sheets with; if the two
 * disagree there is a width where a device's markup is visible with another
 * device's stylesheet.
 *
 *     mobile   (max-width: 767px)
 *     tablet   (min-width: 768px) and (max-width: 1024px)
 *     desktop  (min-width: 1025px)
 */

/* --------------------------------------------------------- per-device widgets
 * Widgets that build their own DOM client-side and genuinely disagree about
 * STRUCTURE between the three documents, not just about image renditions. All
 * variants are emitted and gated here. The class sits on the widget element
 * ITSELF rather than on a wrapper, so no descendant relationship the widget's
 * own CSS relies on is disturbed.
 *
 * display:none rather than visibility:hidden is deliberate: these variants have
 * different heights, and a hidden-but-laid-out copy would add its own height.
 *
 * The selector is DOUBLED to raise specificity. Duda ships rules like
 *   body.dmRoot #dm [list-layout="layout4"] { display: flex !important }
 * at (1,2,1); a plain `.mg-only-t { display:none !important }` is (0,1,0) and
 * LOSES even with !important, which renders every variant at once. The doubled
 * form inside `body.dmRoot #dm` is (1,3,1) and wins outright rather than relying
 * on a source-order tiebreak that would break if a sheet were reordered. */
@media (min-width: 1025px) {
  body.dmRoot #dm .mg-only-t.mg-only-t,
  body.dmRoot #dm .mg-only-m.mg-only-m { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  body.dmRoot #dm .mg-only-d.mg-only-d,
  body.dmRoot #dm .mg-only-m.mg-only-m { display: none !important; }
}
@media (max-width: 767px) {
  body.dmRoot #dm .mg-only-d.mg-only-d,
  body.dmRoot #dm .mg-only-t.mg-only-t { display: none !important; }
}

/* ------------------------------------------------- parallax on touch (gotcha 22)
 * Duda FREEZES parallax on touch devices in its RUNTIME, not in its CSS. Measured
 * on live (tools/probe-attachment.mjs), the blog hero computes:
 *
 *     desktop 1440   background-attachment: fixed
 *     tablet   768   background-attachment: scroll
 *     mobile   375   background-attachment: scroll
 *
 * but the TABLET stylesheet still declares
 *     #dm .dmBody div.u_1325247579 { background-attachment: fixed !important; ... }
 * so a faithful CSS port keeps it fixed at 768 and renders the hero at roughly
 * viewport height instead of section height in a full-page capture — a large diff
 * that reads like a layout bug and is really a runtime behaviour we failed to
 * reproduce.
 *
 * SPECIFICITY IS THE WHOLE POINT HERE. Duda's rule is (1,2,1). A
 * `[class*=...]` selector on its own loses. `#dm .dmBody div[class*="dmSectionParall"]`
 * is also (1,2,1) and this file is the LAST stylesheet in the head, so it wins on
 * source order; the `[id]` qualifier lifts it to (1,3,1) so it wins outright.
 *
 * Duda ships TWO SPELLINGS of the same idea — dmSectionParallaxNew and
 * dmSectionParallex — and both appear on this site, so the selector matches both.
 *
 * The mobile band is included for completeness even though the mobile sheets
 * never declare `fixed` for these sections; it costs nothing and stops a future
 * re-port from regressing silently. */
@media (max-width: 1024px) {
  #dm .dmBody div[class*="dmSectionParallax"][id],
  #dm .dmBody div[class*="dmSectionParallex"][id] {
    background-attachment: scroll !important;
  }
}

/* --------------------------------------------------------------- honeypot
 * Duda sites rely on reCAPTCHA for spam protection and we remove that widget
 * (its keys are Duda's own and domain-restricted, so they cannot work here), so
 * without this every migrated form would ship with none at all.
 *
 * Off-screen rather than display:none: bots skip obviously-hidden fields. Taken
 * out of flow so it costs no layout — the pixel gate would otherwise measure it.
 * The field is named `company`, which cannot collide because Duda names every
 * real field dmform-N. */
.mg-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ------------------------------------------------------------- accordions
 * NOTHING HERE, deliberately. Duda's own sheets already animate the
 * .accordion-item.expanded state from height 0 — measured on live, which sets no
 * inline style and leaves overflow visible. runtime.js only toggles the class
 * live toggles. Adding a transition or overflow here would restyle elements the
 * ported cascade already handles correctly.
 *
 * PARALLAX POSITION is likewise absent from this file on purpose: it is a
 * function of scroll and viewport height, so it lives in runtime.js, not here. */

/* ------------------------------------------------------------ blog "Show More"
 * /blog publishes 10 of 35 posts and a "Show More" control that asks Duda's
 * backend for ten more, three times (measured: 10 -> 20 -> 30 -> 35, after which
 * the control removes itself). A static build has no backend, so all 35 cards
 * ship and the ones past the first ten start hidden; runtime.js reveals them in
 * live's own steps of ten. display:none rather than visibility:hidden — a
 * laid-out card would add its height to the page, and the initial render has to
 * stay identical to live's un-clicked state, which is what the gate measures. */
.mg-blog-hidden {
  display: none !important;
}