/* gy-added (review 2026-10-10) — Growyo pre-launch review fixes.
 *
 * Kept apart from bands.css so the ported / hand-written split stays legible,
 * and linked with a content-hash ?v= from Page.astro so a change is a new URL.
 * Every selector here targets either a gy-added element or a state runtime.js
 * sets.
 */

/* ---- Mobile / tablet drawer ---------------------------------------------- */
/* Scroll lock while the drawer is open (live sets overflow:hidden on <body>). */
html.gy-drawer-lock,
body.gy-drawer-lock {
  overflow: hidden !important;
  overscroll-behavior: none;
}
/* Submenu groups. max-height clips the CONTENT box, so the <ul>'s own padding is
   collapsed with it — with !important, because Duda's sub-pages padding is. */
.layout-drawer li.gy-sub-group > ul.unifiednav__container_sub-nav {
  overflow: hidden !important;
  transition: max-height .3s ease-in-out, opacity .3s ease-in-out, padding .3s ease-in-out !important;
}
.layout-drawer li.gy-sub-group:not(.unifiednav__item-wrap_open) > ul.unifiednav__container_sub-nav {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-width: 0 !important;
}
/* The caret: rotate ::before (the glyph), never .icon itself, and give it a
   real touch area with an overlay rather than by sizing the inline span. */
#dm .layout-drawer li.gy-sub-group .gy-caret::before { display: inline-block; transition: transform .3s ease; }
#dm .layout-drawer li.gy-sub-group:not(.unifiednav__item-wrap_open) .gy-caret::before { transform: none !important; }
#dm .layout-drawer li.gy-sub-group.unifiednav__item-wrap_open .gy-caret::before { transform: rotate(180deg) !important; }
/* pointer-events: the tablet sheet sets `pointer-events:none` on the caret
   (measured at 820), so a tap on it reached the label's <a> instead — which on
   "Service Area" navigates. Restored, with !important to beat that rule. */
#dm .layout-drawer .gy-caret { position: relative; cursor: pointer; pointer-events: auto !important; }
.layout-drawer .gy-caret::after {
  content: "";
  position: absolute;
  left: -12px; right: -12px; top: -12px; bottom: -12px;
}

/* ---- Map above the footer ------------------------------------------------- */
#dm .gy-map-row { display: block; width: 100%; margin: 0; padding: 0; line-height: 0; }
#dm .gy-map-row iframe { display: block; width: 100%; height: 300px; border: 0; }

/* ---- One <h1> per page: type pins ---------------------------------------- */
/* tools/review-content-fixes.py retags headings so each page has exactly one
   <h1> per band. A retag changes which of Duda's tag rules apply, so the type
   each element had BEFORE is restated here. Verified against live at
   1440 / 820 / 390 with computed style and box of every retagged element.

   div.gy-was-h1 — a line that was an <h1> and is not a heading: the company
                   name above each post title, and /blog's breadcrumb and spacer
                   lines. Duda's h1 type is Montserrat 700, 40px (30px on phone),
                   line-height normal. Lines carrying a size-NN class keep that
                   class's size.
   h1.gy-was-h2  — /reviews and /service-areas, whose page heading was an <h2>:
                   Duda's h2 size (36px; 26px on phone) where h1 would give 40/30. */
#dm .dmBody div.gy-was-h1 {
  font-family: Montserrat, "Montserrat Fallback" !important;
  font-weight: 700 !important;
  line-height: normal !important;
}
#dm .dmBody div.gy-was-h1:not([class*="size-"]) { font-size: 40px !important; }
body.dmMobileBody #dm .dmBody div.gy-was-h1:not([class*="size-"]) { font-size: 30px !important; }
#dm .dmBody h1.gy-was-h2 { font-size: 36px !important; }
body.dmMobileBody #dm .dmBody h1.gy-was-h2 { font-size: 26px !important; }

/* The post template's company-name line. Its box came from per-page rules
   written against `h1.u_1852899778`, which no longer match a <div>; restated
   from those rules, per band. */
#dm .dmBody div.gy-was-h1.u_1852899778 {
  display: block !important;
  float: none !important;
  position: relative !important;
  top: 0 !important; left: 0 !important;
  width: 860px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 2px 0 !important;
  margin: 0 auto !important;
  text-align: center !important;
  color: rgb(255, 255, 255) !important;
}
body.dmMobileBody #dm .dmBody div.gy-was-h1.u_1852899778 { width: 328px !important; margin: 8px auto !important; }

/* ---- Legal links: footer -------------------------------------------------- */
/* One line directly under the copyright. The copyright block is centred in all
   three bands (measured), on rgb(235,235,235), in Poppins 13px rgb(43,43,43) —
   so the line is centred, in that type and that dark ink. */
#dm .gy-footer-legal {
  display: block;
  clear: both;
  text-align: center;
  font-family: Poppins, "Poppins Fallback", sans-serif;
  font-size: 13px;
  line-height: 26px;
  white-space: nowrap;
  color: rgb(43, 43, 43);
}
#dm .gy-footer-legal a,
#dm .gy-footer-legal a:visited { color: rgb(43, 43, 43) !important; text-decoration: none !important; display: inline !important; }
#dm .gy-footer-legal a:hover { color: rgb(177, 47, 47) !important; text-decoration: underline !important; }

/* ---- Legal links: contact + review forms ----------------------------------- */
/* One line under the submit button. The button is Duda's FLOATED .dmformsubmit,
   so the line clears it (source order alone leaves it beside the button). The
   cleared float already leaves 20px beneath the button (measured at all three
   bands, both forms), so no further space is added above the line. Aligned with the SUBMIT BUTTON, measured per form and
   band: the button sits LEFT, 15px in from the form's edge, on both forms at
   desktop and tablet and on /contact-us on phone, so the line starts on that
   edge; on /reviews on phone the button spans the column, so the line is
   centred there. Both forms sit on white: the site's dark body ink. */
#dm .gy-form-legal {
  clear: both;
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0 0 0 15px;
  text-align: left;
  font-family: Poppins, "Poppins Fallback", sans-serif;
  font-size: 14px;
  line-height: 1.6;
  white-space: nowrap;
  color: rgb(43, 43, 43);
}
body.dmMobileBody #dm .u_1750034418 .gy-form-legal { padding-left: 0; text-align: center; }
#dm .gy-form-legal a,
#dm .gy-form-legal a:visited { color: rgb(43, 43, 43) !important; text-decoration: underline !important; display: inline !important; font-weight: 400 !important; }
#dm .gy-form-legal a:hover { color: rgb(177, 47, 47) !important; }

/* ---- Legal pages ----------------------------------------------------------- */
/* Built from /blog's shell (tools/build-review-pages.py). Duda's reset zeroes
   margin on p / ul / h2, so the rhythm is set explicitly. */
#dm .dmBody .gy-legal-row { padding: 60px 40px 70px !important; background-color: rgb(255, 255, 255) !important; }
body.dmMobileBody #dm .dmBody .gy-legal-row { padding: 30px 15px 50px !important; }
#dm .dmBody .gy-legal { max-width: 900px; margin: 0 auto !important; text-align: left; color: rgb(43, 43, 43); }
#dm .dmBody .gy-legal p { margin: 0 0 14px !important; line-height: 1.8 !important; }
#dm .dmBody .gy-legal .gy-legal-date { font-weight: 700; margin-bottom: 20px !important; }
#dm .dmBody .gy-legal h2 { margin: 34px 0 12px !important; font-size: 26px !important; line-height: 1.3 !important; text-align: left; }
#dm .dmBody .gy-legal h3 { margin: 22px 0 10px !important; font-size: 20px !important; line-height: 1.3 !important; text-align: left; }
#dm .dmBody .gy-legal ul { margin: 0 0 14px !important; padding-left: 24px !important; list-style: disc outside !important; }
#dm .dmBody .gy-legal li { margin: 0 0 6px !important; line-height: 1.8 !important; list-style: disc outside !important; }
#dm .dmBody .gy-legal a { color: rgb(177, 47, 47) !important; text-decoration: underline !important; }
body.dmMobileBody #dm .dmBody .gy-legal h2 { font-size: 22px !important; }

/* The borrowed hero's title box is 233-246px wide, sized for the word "BLOG".
   The added pages' longer titles wrapped mid-phrase in it, so on those three
   pages (desktop and tablet; the phone copy is already full width) it is let
   out. Not a gy-added element — scoped by the page's own alias instead. */
body[data-page-alias="privacy-policy"] #dm .dmBody div.u_1657938911,
body[data-page-alias="terms-and-conditions"] #dm .dmBody div.u_1657938911,
body[data-page-alias="blog-search"] #dm .dmBody div.u_1657938911 { max-width: 640px !important; }

/* ---- Blog search results heading ------------------------------------------- */
#dm .dmBody h2.gy-search-head {
  margin: 24px 0 24px !important;
  text-align: left;
  font-size: 26px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
  color: rgb(43, 43, 43) !important;
}
#dm .dmBody h2.gy-search-head strong { font-weight: 700 !important; }
body.dmMobileBody #dm .dmBody h2.gy-search-head { font-size: 22px !important; }