/* Hand-written overrides. DELIBERATELY OUTSIDE site/public/styles/, which port-css.mjs
   wipes on every run — a sheet placed there is deleted with no error, and a missing
   stylesheet produces no console message a page-level check would notice.

   Everything here is ours, not ported. Keep it small and justify each rule. */

/* Honeypot. position:absolute (NOT display:none) so bots do not skip it, and so it is
   out of flow and costs ZERO layout — otherwise the pixel gate measures our own spam
   trap as a layout defect. Specificity: Duda emits `#dm .dmBody div.u_NNNN{...!important}`
   for every widget, so a plain class would lose; the repeated class behind #dm wins on
   class count without depending on source order. */
.mg-hp,
#dm .mg-hp.mg-hp.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;
}

/* ==========================================================================
   PRE-LAUNCH REVIEW, 2026-10-10. Every rule below was added by the website
   review; the behaviour that goes with it is in scripts/runtime.js.
   ========================================================================== */

/* ---- drawer sub-menus: closed state --------------------------------------
   max-height clips the CONTENT box only, so the <ul>'s own padding (set
   !important by Duda's [data-auto="sub-pages"] rule) has to collapse with it,
   and the group is opacity:0 until something opens it. */
#hamburger-drawer#hamburger-drawer li.gy-sub > .unifiednav__container_sub-nav {
  overflow: hidden;
  opacity: 1 !important;
  pointer-events: auto !important;
  transition: max-height .3s ease, opacity .2s ease;
}
#hamburger-drawer#hamburger-drawer li.gy-sub.gy-sub-closed > .unifiednav__container_sub-nav {
  max-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-width: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden;
}
/* SUB-MENU INK. The drawer is rgb(15,15,15) and its sub-links are rgb(0,0,0) at
   12.8px: an opened group is black on black, 1.1:1, on live as well. They take the
   parents' white, at a size a thumb can read; the current page gets the site's blue. */
#hamburger-drawer#hamburger-drawer .unifiednav__container_sub-nav .unifiednav__item,
#hamburger-drawer#hamburger-drawer .unifiednav__container_sub-nav .unifiednav__item .nav-item-text {
  color: rgb(255, 255, 255) !important;
  font-size: 15px !important;
}
#hamburger-drawer#hamburger-drawer .unifiednav__container_sub-nav .unifiednav__item.dmNavItemSelected .nav-item-text,
#hamburger-drawer#hamburger-drawer .unifiednav__container_sub-nav .unifiednav__item:hover .nav-item-text {
  color: rgb(119, 171, 222) !important;
}
/* The close X keeps above an open group scrolled beneath it. */
#hamburger-drawer .hamburgerButton { position: relative; z-index: 5; }
#hamburger-drawer div:has(> .hamburgerButton) { z-index: 5; }

/* ---- photo viewer --------------------------------------------------------- */
html.gy-pswp-open { overflow: hidden; }

/* ---- blog search results heading ----------------------------------------- */
#dm#dm .gy-search-heading {
  margin: 0 0 24px;
  font-size: 24px !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  color: rgb(15, 15, 15);
}

/* ---- added CTA button (/gallery) -------------------------------------------
   The site's own button, measured on /about-us at all three widths: 250x50,
   rgb(119,171,222) pill, 2px transparent border, Inter 16px black; hover turns
   it white with the blue border. Restated here because a copied Duda button is
   styled only by its page's own u_<id> rule. */
#dm .gy-cta-wrap { text-align: center; padding: 40px 0 0; clear: both; }
/* The gallery widget is height:100% of its FLEX wrapper, so a block added after it
   spilled out of the section and under the footer map. The widget hugs its photos
   instead and the wrapper grows to hold both. */
#dm#dm .widget-wrapper:has(> .gy-cta-wrap) > .dmPhotoGallery { height: auto !important; }
#dm#dm a.gy-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 250px;
  height: 50px;
  border: 2px solid transparent;
  border-radius: 50px;
  background-color: rgb(119, 171, 222);
  color: rgb(0, 0, 0) !important;
  font-family: Inter, "Inter Fallback", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none !important;
  transition: background-color .2s, border-color .2s;
}
#dm#dm a.gy-cta:hover,
#dm#dm a.gy-cta:focus-visible {
  background-color: rgb(255, 255, 255);
  border-color: rgb(119, 171, 222);
}

/* ---- legal pages ------------------------------------------------------------
   Duda's reset zeroes margin on p, ul and h2, so the rhythm is set explicitly. */
#dm .gy-legal-row {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 40px 80px;
  box-sizing: border-box;
  background-color: rgb(255, 255, 255);
  color: rgb(15, 15, 15);
}
#dm#dm .gy-legal-row h2 { margin: 36px 0 12px; font-size: 26px !important; line-height: 1.3 !important; }
#dm .gy-legal-row p, #dm .gy-legal-row li { line-height: 1.6; }
#dm .gy-legal-row p { margin: 0 0 14px; }
#dm .gy-legal-row ul { margin: 0 0 14px; padding-left: 1.4em; list-style: disc; }
#dm .gy-legal-row li { margin: 0 0 4px; }
#dm .gy-legal-row a { text-decoration: underline; color: inherit; }
@media (max-width: 767px) {
  #dm .gy-legal-row { padding: 32px 16px 60px; }
  #dm#dm .gy-legal-row h2 { font-size: 21px !important; }
}

/* ---- legal links -------------------------------------------------------------
   Footer: ON the copyright line, as the third item of the widget's own flex row, at
   the copyright's size and ink (rgb(15,15,15) on the blue strip). Form: one line under Submit Form,
   left like the button, CLEARING the button's float, with 15px of padding above. */
#dm#dm .gy-legal-links a {
  color: inherit !important;
  text-decoration: underline !important;
  font-weight: inherit !important;
}
#dm .gy-legal-footer {
  flex: 0 0 auto;
  white-space: nowrap;
  font: inherit;
  color: inherit;
}
@media (max-width: 767px) {
  /* 390px cannot hold the copyright and the links on one row; the links wrap
     beneath it, centred, without the separator that joined them. */
  #dm .copyright:has(.gy-legal-footer) { flex-wrap: wrap; }
  #dm .gy-legal-footer { flex-basis: 100%; text-align: center; padding-top: 4px; }
  #dm .gy-legal-footer .gy-sep { display: none; }
}
#dm .gy-legal-form {
  clear: both;
  text-align: left;
  padding-top: 15px;
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
  color: rgb(15, 15, 15);
}

/* ---- 404 ------------------------------------------------------------------------
   Live's 404 gets its look from a Duda sheet that is not in the port, so the block
   rendered as bare text against the page's left edge. */
#dm #error-container {
  padding: 110px 20px 90px;
  text-align: center;
  background-color: rgb(255, 255, 255);
}
#dm #error-container .four-o-four {
  font-family: Outfit, "Outfit Fallback", sans-serif;
  font-weight: 700;
  font-size: 130px;
  line-height: 1;
  color: rgb(93, 55, 18);
}
#dm #error-container .four-o-four .lean { display: inline-block; transform: rotate(15deg); }
#dm#dm #error-container h1.description {
  margin: 36px 0;
  font-family: Inter, "Inter Fallback", sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: none;
  color: rgb(15, 15, 15);
}
#dm#dm #error-container a.back-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 250px;
  height: 50px;
  border: 2px solid transparent;
  border-radius: 50px;
  background-color: rgb(119, 171, 222);
  color: rgb(0, 0, 0) !important;
  font-size: 16px;
  text-decoration: none !important;
  transition: background-color .2s, border-color .2s;
}
#dm#dm #error-container a.back-button:hover,
#dm#dm #error-container a.back-button:focus-visible {
  background-color: rgb(255, 255, 255);
  border-color: rgb(119, 171, 222);
}
@media (max-width: 767px) {
  #dm #error-container { padding: 70px 16px 60px; }
  #dm #error-container .four-o-four { font-size: 96px; }
}

/* ---- desktop menu on ONE row ---------------------------------------------------
   The menu sits in a 672px column. On the home page its items are 18px and add up
   to 706px, so "Contact" dropped to a second row at every desktop width (on live
   too); on every other page they are 16px and fit at 1440 but wrapped below ~1200.
   The home page takes the 16px every other page already uses, and between 1025 and
   1279 the gaps and type step down with the window. */
@media (min-width: 1025px) {
  #dm#dm nav[id="1198691314"] > ul { flex-wrap: nowrap !important; }
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item {
    white-space: nowrap;
  }
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item,
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item .nav-item-text {
    font-size: 16px !important;
    letter-spacing: 0.48px !important;
  }
}
@media (min-width: 1025px) and (max-width: 1279px) {
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item {
    padding-left: clamp(3px, calc(3px + (100vw - 1025px) * 0.0353), 12px) !important;
    padding-right: clamp(3px, calc(3px + (100vw - 1025px) * 0.0353), 12px) !important;
  }
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item,
  #dm#dm#dm .dmInner nav[id="1198691314"].main-navigation.unifiednav .unifiednav__container:not([data-depth]) > .unifiednav__item-wrap > .unifiednav__item .nav-item-text {
    font-size: clamp(12.5px, calc(12.5px + (100vw - 1025px) * 0.0138), 16px) !important;
    letter-spacing: 0 !important;
  }
}

/* ---- links on the brown cards ------------------------------------------------------
   The brown wave-pattern cards carry white body copy. Some in-text links on them kept
   the site's brown link colour (rgb(93,55,18), all but invisible on the card) or its
   blue (about 2:1). Every in-text link on a brown card is white and underlined; the
   cards are listed by id because the brown is a background IMAGE. */
#dm#dm [id="c6dee79c"] a:not(.dmButtonLink),
#dm#dm [id="63e7cbe1"] a:not(.dmButtonLink),
#dm#dm [id="adea4062"] a:not(.dmButtonLink),
#dm#dm [id="bfb6c2dd"] a:not(.dmButtonLink),
#dm#dm [id="3d53efc4"] a:not(.dmButtonLink),
#dm#dm [id="8eff8d90"] a:not(.dmButtonLink),
#dm#dm [id="7dddbef8"] a:not(.dmButtonLink),
#dm#dm [id="4678ffe5"] a:not(.dmButtonLink),
#dm#dm [id="97b5f55a"] a:not(.dmButtonLink),
#dm#dm [id="20598ea1"] a:not(.dmButtonLink),
#dm#dm [id="0e933ecb"] a:not(.dmButtonLink) {
  color: rgb(255, 255, 255) !important;
  text-decoration: underline !important;
}
#dm#dm [id="c6dee79c"] a:not(.dmButtonLink) *,
#dm#dm [id="63e7cbe1"] a:not(.dmButtonLink) *,
#dm#dm [id="adea4062"] a:not(.dmButtonLink) *,
#dm#dm [id="bfb6c2dd"] a:not(.dmButtonLink) *,
#dm#dm [id="3d53efc4"] a:not(.dmButtonLink) *,
#dm#dm [id="8eff8d90"] a:not(.dmButtonLink) *,
#dm#dm [id="7dddbef8"] a:not(.dmButtonLink) *,
#dm#dm [id="4678ffe5"] a:not(.dmButtonLink) *,
#dm#dm [id="97b5f55a"] a:not(.dmButtonLink) *,
#dm#dm [id="20598ea1"] a:not(.dmButtonLink) *,
#dm#dm [id="0e933ecb"] a:not(.dmButtonLink) * {
  color: rgb(255, 255, 255) !important;
}
/* SEO brief 2026-10-13: in-text links on these brown cards are set apart from the white
   copy around them: Septic Services' Septic Repair card, Septic Inspection's first section,
   and Septic Repair's first section and Professional Septic Pump Repair card. Light gold, about
   4.5:1 on the card's brown. */
body[data-page-alias="septic-services"] #dm#dm [id="1874951974"] a,
body[data-page-alias="septic-services"] #dm#dm [id="1874951974"] a *,
body[data-page-alias="septic-inspection-greenville"] #dm#dm [id="1526721337"] a,
body[data-page-alias="septic-inspection-greenville"] #dm#dm [id="1526721337"] a *,
body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1594458925"] a,
body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1594458925"] a *,
body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1037395332"] a,
body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1037395332"] a * {
  color: rgb(255, 224, 138) !important;
}

/* ---- phone: a heading follows its section's body text ---------------------------------
   On a phone these headings were centred over left-aligned copy (or left over centred
   copy). Each takes the alignment of the body text in its own section. Scoped per PAGE:
   Duda reuses a widget id across pages (1131234682 is centred copy on the pumping page
   and left copy on the Greenville page). */
@media (max-width: 767px) {
  body[data-page-alias="home"] #dm#dm [id="2967781706"] h3,
  body[data-page-alias="home"] #dm#dm [id="2967781706"] h3 span { text-align: left !important; }
  body[data-page-alias="home"] #dm#dm [id="1639171296"] h2,
  body[data-page-alias="home"] #dm#dm [id="1639171296"] h2 span { text-align: center !important; }
  body[data-page-alias="home"] #dm#dm [id="1008587674"] h2,
  body[data-page-alias="home"] #dm#dm [id="1008587674"] h2 span { text-align: center !important; }
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1129171287"] h3,
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1129171287"] h3 span { text-align: left !important; }
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1745094757"] h3,
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1745094757"] h3 span { text-align: left !important; }
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1847494622"] h3,
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1847494622"] h3 span { text-align: left !important; }
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1965169556"] h3,
  body[data-page-alias="septic-repair-greenville"] #dm#dm [id="1965169556"] h3 span { text-align: left !important; }
  body[data-page-alias="septic-service-greenville"] #dm#dm [id="1518171946"] h2,
  body[data-page-alias="septic-service-greenville"] #dm#dm [id="1518171946"] h2 span { text-align: center !important; }
  body[data-page-alias="septic-tank-installation-greenville"] #dm#dm [id="1381474323"] h2,
  body[data-page-alias="septic-tank-installation-greenville"] #dm#dm [id="1381474323"] h2 span { text-align: center !important; }
  body[data-page-alias="septic-tank-installation-greenville"] #dm#dm [id="1283779145"] h2,
  body[data-page-alias="septic-tank-installation-greenville"] #dm#dm [id="1283779145"] h2 span { text-align: center !important; }
  body[data-page-alias="septic-tank-pumping-greenville"] #dm#dm [id="1518171946"] h2,
  body[data-page-alias="septic-tank-pumping-greenville"] #dm#dm [id="1518171946"] h2 span { text-align: center !important; }
  body[data-page-alias="septic-tank-pumping-greenville"] #dm#dm [id="1131234682"] h2,
  body[data-page-alias="septic-tank-pumping-greenville"] #dm#dm [id="1131234682"] h2 span { text-align: center !important; }
}