/* clh-design.css: desktop parity layer for Cairns Holiday Lodge (kit ilaunch-divi-parity.template.css sections 1-4, 6-8, 10, 11, 13-16 expanded for this site; section 5 socialwidgets, 9 forms, 17 home hover and 18 tel links dropped: live has none of them or Stage 4 owns them) */
/* 1. Live iLaunch CSS assumes the browser default content-box; Divi sets * {box-sizing:border-box}, which shrank every padded
      box (header band 125 -> 91px, booking date field, special-offer text, footer container 195 -> 155px). Divi's own
      contact-form module keeps border-box. */
body.clh-site #page-container, body.clh-site #page-container *, body.clh-site #page-container *::before, body.clh-site #page-container *::after { box-sizing: content-box; }
body.clh-site #page-container .et_pb_contact_form_container, body.clh-site #page-container .et_pb_contact_form_container * { box-sizing: border-box; }

/* 2. Footer: with content-box restored the fixed-height .container (155px + 40px padding) gives live's 195px block and
      live's gap under the copyright, so the build-stage padding-bottom on #footer is no longer needed (live: 0). */
body.clh-site #page-container #footer { padding-bottom: 0; }

/* 3. Browser-default spacing the live CSS relies on, which Divi's reset removes. No ids in these selectors, so every
      live rule (body.clh-site #page-container ...) still wins where live sets its own value. */
body.clh-site :where(.et-l, #main-content) p { padding-bottom: 0; margin-bottom: 1em; }
body.clh-site :where(.et-l, #main-content) ul, body.clh-site :where(.et-l, #main-content) ol { padding: 0 0 0 40px; margin: 1em 0; line-height: inherit; }

/* 4. Divi pads "#main-content .container" 58px at the top (meant for its own header); live's .container has no such padding.
      Hidden while Divi's border-box absorbed it into the fixed 340px #topcontainer; content-box exposed it. */
html body.clh-site #main-content .container { padding-top: 0; }


/* 6. Form controls the browser sizes as border-box by default (select, buttons, submit inputs): keep that after rule 1,
      or the booking bar's Duration select and Check Availability button grow by their padding (240 -> 253, 280 -> 310px). */
body.clh-site #page-container select, body.clh-site #page-container button,
body.clh-site #page-container input[type=submit], body.clh-site #page-container input[type=button], body.clh-site #page-container input[type=reset] { box-sizing: border-box; }

/* 7. Divi's content-table look (1px #eee borders, 6px 24px cell padding, width 100%, left align) is not on live. Back to the
      browser defaults, honouring the table's own width="100%" and cellpadding="0" attributes as live does. */
body.clh-site :where(.et-l, #main-content) table:not(.variations) { border: 0; margin: 0; width: auto; text-align: start; }
body.clh-site :where(.et-l, #main-content) table[width="100%"]:not(.variations) { width: 100%; }
body.clh-site :where(.et-l, #main-content) tr td, body.clh-site :where(.et-l, #main-content) tr th { border-top: 0; padding: 1px; }
body.clh-site :where(.et-l, #main-content) table[cellpadding="0"] tr td, body.clh-site :where(.et-l, #main-content) table[cellpadding="0"] tr th { padding: 0; }


/* 8. Divi draws a 5px coloured rule down the left of every blockquote; live has none (reviews). */
body.clh-site :where(.et-l, #main-content) blockquote { border-left: 0; }


/* nested lists: browser default has no vertical margin (site map) */
body.clh-site :where(.et-l, #main-content) :is(ul, ol) :is(ul, ol) { margin-top: 0; margin-bottom: 0; }

/* 10. Divi forces greyscale font smoothing on body; live uses the browser default (slightly heavier text on macOS). */
body.clh-site { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }

/* 11. Divi's right-sidebar layout draws a 1px grey vertical rule (#main-content .container::before) on blog views; not on live. */
body.clh-site:not(.clh-home) #main-content .container::before { display: none; }


/* 13. Booking calendar (appended to <body>, outside #page-container). Stage 4 (10 Oct 2026): the build's copy of this block came from the kit
       template with another site's palette (a gold control bar, a dark green month bar, a light blue current day, Arial 13px days) and the
       CSS port scoped the plugin's own `.datepicker` table rules under #page-container, so the calendar opened 120px wide in the wrong colours
       (live: 185px, live's blue control bar #1d7fba and month bar #259ae0, grey #ccc day grid, grey #999 current day). Here: the plugin's table
       rules unscoped, and live's generic td and select rules (which on live reach every element, the calendar's included) kept at element
       level inside :where() so the calendar's own classes still win, as on live. Live's colours themselves come from clh-live.css. */
body.clh-site #datepicker_div, body.clh-site #datepicker_div * { box-sizing: content-box; }
body.clh-site #datepicker_div .datepicker { clear: both; float: left; width: 100%; color: #ffffff; background: #cccccc; text-align: center; font-size: 100%; }
body.clh-site #datepicker_div .datepicker a { display: block; width: 100%; }
body.clh-site :where(#datepicker_div) td { font-family: 'PT Sans', Arial, Helvetica, sans-serif; font-size: 15px; line-height: 22px; font-weight: 400; color: #555555; vertical-align: top; }
body.clh-site :where(#datepicker_div) select { appearance: none; -webkit-appearance: none; -moz-appearance: none; text-indent: 0.01px; text-overflow: ''; outline: none; font-family: 'PT Sans', Helvetica, sans-serif; }
/* Divi's reset collapses every table border; live (and the calendar's day grid) use the browser default, separate. */
body.clh-site #datepicker_div table, body.clh-site :where(.et-l, #main-content) table:not(.variations) { border-collapse: separate; }

/* 14. Home hero slider before slidepark starts (an earlier iLaunch build 2026-10-06 classification round F1, PSI performance; pairs
      with the hero fragment kit/extract_chrome.py emits). Live's <img>
      slides become background-image slides only once the footer scripts run; until then the first photo showed stretched
      (fill) with the queued slides spilling below the hero. Show it exactly as the slide will be drawn (cover, centred)
      and clip the queue, so the swap changes no pixels (speed index and LCP) and nothing is ever stretched. The list
      also loses the browser's default margin/padding before the slider starts (they pushed the hero 15px down and 40px
      wide). slidepark sets exactly these values inline when it starts, so the running slider looks exactly as before. */
body.clh-site #page-container ul.featuremain.slidepark { position: relative; overflow: hidden; margin: 0; padding: 0; list-style: none; }
body.clh-site #page-container ul.featuremain.slidepark > li > img { object-fit: cover; object-position: center center; }

/* 15. Nested lists (earlier iLaunch build): Divi's `.entry-content ul { list-style-type: disc }` hits every level; live (browser default) shows
   hollow circles at the second level and squares at the third (site map) */
body.clh-site :where(.et-l, #main-content) ul ul { list-style-type: circle; }
body.clh-site :where(.et-l, #main-content) ul ul ul { list-style-type: square; }
/* 16. Form thank-you alignment (earlier iLaunch build): after a successful send Divi replaces the form with its thank-you line; the form's centred 1184px box then
   indented that line to x 128 while the heading and intro above sit at x 35. Without a form the box spans the column. */
body.clh-site #page-container .clh-contact-form:not(:has(form)) { width: auto; max-width: none; margin-left: 0; margin-right: 0; }

/* 19. Divi's .container{width:80%; max-width:1080px; position:relative}: live's is a plain 1170px box (position static; .container.main restores relative). */
body.clh-site #page-container .container { max-width: none; position: static; }

/* 20. Divi's `.et_no_sidebar #main-content .container::before { display: none }` hides home.css's flower (a ::before with no display of its own). */
body.clh-site.clh-home #page-container .content .container::before { display: block; }

/* 21. Live has no viewport meta and `#container-outer { min-width: 1170px }` (the kit port zeroes min-widths of 1000px and up): a phone-sized window shows live's clipped 1170px page.
   Reproduced for the faithful build (a sister site's precedent); Stage 4 resets it below 1250 with the designed phone and tablet layouts. */
body.clh-site #page-container { min-width: 1170px; }

/* 22. Keyless map (kit port_maps.py --css, scoped to this site): the iframe fills live's 720 x 292 map box; the "Get Directions" info block (live's .map-info is display:none until
   a marker is clicked) is shown as a small overlay so the directions link stays usable without live's Maps JavaScript. DELIBERATE. */
body.clh-site #page-container .map-wrapper { position: absolute; }
body.clh-site #page-container .map-container iframe.ils-map { display: block; width: 100%; height: 100%; min-height: 292px; border: 0; }
/* Stage 4 polish: the block sits over the embed's pin as a map info window (white card, soft shadow, pointer to the pin), the way live's own
   marker window opens; the embed's "Open in Maps" box (top left) and its controls (bottom corners) stay clear. The link was white on white
   (#footer a out-ranked the old rule): now live's footer-row blue, 5.6:1. */
body.clh-site #page-container .map-wrapper .map-info { display: block; position: absolute; left: 50%; top: auto; bottom: calc(50% + 40px); transform: translateX(-50%); z-index: 3; width: max-content; max-width: calc(100% - 32px);
  box-sizing: border-box; background: #ffffff; padding: 9px 16px 8px; border-radius: 3px; box-shadow: 0 2px 7px 1px rgba(0, 0, 0, 0.3); font: 400 13px/18px 'PT Sans', Arial, Helvetica, sans-serif; color: #333333; text-align: center; }
body.clh-site #page-container .map-wrapper .map-info::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px; margin-left: -7px; background: #ffffff; transform: rotate(45deg); box-shadow: 3px 3px 4px -1px rgba(0, 0, 0, 0.18); }
body.clh-site #page-container .map-wrapper .map-info-window { position: relative; z-index: 1; }
body.clh-site #page-container .map-wrapper .map-info strong { font-weight: 700; color: #222222; }
body.clh-site #page-container #footer .map-wrapper .map-info a:link, body.clh-site #page-container #footer .map-wrapper .map-info a:visited { color: #196d9e; text-decoration: underline; }
body.clh-site #page-container #footer .map-wrapper .map-info a:hover, body.clh-site #page-container #footer .map-wrapper .map-info a:focus, body.clh-site #page-container #footer .map-wrapper .map-info a:active { color: #072e53; text-decoration: none; }

/* 23. Divi's reset zeroes table border-spacing; live's tables (no cellspacing attribute: newsletter unsubscribe form) keep the browser default 2px. */
body.clh-site :where(.et-l, #main-content) table:not(.variations):not([cellspacing]) { border-spacing: 2px; }

/* ==================== Stage 4 additions (2026-10-10) ==================== */

/* 24. Phone menu button (added to the header fragment for the designed phone and tablet layouts; clh-mobile.css shows it below 1170). */
body.clh-site #page-container .ils-menu-toggle { display: none; }

/* 25. Phone numbers are explicit tel: links (header, footer, /contact) so iOS has nothing of its own to restyle (format-detection meta in the
   head). At every width the link looks exactly like live's plain-text number in every state: its parent's colour, no underline, no box. */
body.clh-site #page-container a.tel-link, body.clh-site #page-container a.tel-link:link, body.clh-site #page-container a.tel-link:visited,
body.clh-site #page-container a.tel-link:hover, body.clh-site #page-container a.tel-link:focus, body.clh-site #page-container a.tel-link:active,
body.clh-site #page-container #footer a.tel-link:hover { color: inherit !important; text-decoration: none !important; background: none; }
@media (max-width: 1249px) { body.clh-site #page-container a.tel-link { white-space: nowrap; display: inline-block; line-height: 24px; } }
@media (max-width: 1249px) { body.clh-site #page-container .map-wrapper .map-info { font-size: 14px; line-height: 20px; } body.clh-site #page-container #footer .map-wrapper .map-info a:link { display: inline-block; line-height: 24px; } }
/* Fix round 1 V6 (10 Oct 2026): Google's embed draws its own place card in the map's top left corner, LARGE (name, address and two round
   buttons, up to about 301 x 104px) whenever the frame is at least about 400px wide and 300px tall, which the designed bands reach (412 to
   767: full width and 360px tall; 768 to 1169: half the page wide and the footer's height); hung over the pin, the Location Map card met it.
   Below 1250 the card hangs UNDER the pin (pointer up), clear of Google's card at the top and of its controls along the bottom. At 1250 and
   up the frame is live's fixed 720 x 292 box, where Google draws only its small "Open in Maps" box (129 x 33px, 106px left of the card), so
   the card stays over the pin as before (build/fix1_mapcard_rule_clh.js measures Google's card per frame size). */
@media (max-width: 1249px) {
  body.clh-site #page-container .map-wrapper .map-info { top: calc(50% + 12px); bottom: auto; }
  body.clh-site #page-container .map-wrapper .map-info::after { top: -7px; bottom: auto; box-shadow: -2px -2px 3px -1px rgba(0, 0, 0, 0.12); }
}

/* 26. Keyboard focus: Divi's `a { outline: 0 }` and `:focus { outline: 0 }` remove the browser's ring that live shows (and live's own select
   rule removes it from the booking select). Back to the browser's own ring for keyboard focus at 1250 and up; an AA ring below 1250
   (clh-mobile.css). Mouse clicks show no ring (:focus-visible). */
body.clh-site :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: revert !important; outline-offset: revert; }
/* the map embed: when keyboard focus moves into it, the frame shows a ring too (live's Maps JS map had its own); inside the frame's edge so it is not cut off */
body.clh-site #page-container iframe.ils-map.ils-map-focus { outline: 3px solid #196d9e !important; outline-offset: -3px !important; }

/* 27. Enquiry form (/contact) and review form (/reviews): DELIBERATE addition on Bryan's call (10 Oct 2026); live shows them only in its
   phone template, so there is no live desktop form to copy. At 1250 and up they are dressed exactly as live's own desktop form, the blog
   comment form on every live post (table.form: one field per row, 115px label cells right-aligned at 37px line height, 236 x 36px fields
   with 8px 15px padding and a 1px #e1e1e1 border in PT Sans 14px #555, a 609 x 90px message box, the required-field star in the field
   cell's right padding 7px from its top, an unlabelled verification row, the yellow uppercase button with the form's 1px border, and
   "Required fields" right-aligned under it; measured on live post 51 at 1440). The button's hover is white on live's header navy (live's sky-blue hover is 3.1:1 and this button has
   no live twin, so it must be AA). Below 1250 the layout is in clh-mobile.css. */
body.clh-site #page-container .et_pb_section.clh-enquiry-form, body.clh-site #page-container .et_pb_section.clh-review-form { padding: 0 0 60px; background: #ffffff; }
body.clh-site #page-container .clh-enquiry-form > .et_pb_row, body.clh-site #page-container .clh-review-form > .et_pb_row { width: auto; max-width: none; margin: 0 auto; padding: 0 24px; }
@media (min-width: 1170px) { body.clh-site #page-container .clh-enquiry-form > .et_pb_row, body.clh-site #page-container .clh-review-form > .et_pb_row { width: 1170px; padding: 0; } }
body.clh-site #page-container .clh-contact-form { margin: 0; padding: 0; background: none; }
body.clh-site #page-container .clh-contact-form .et_pb_contact { padding: 0; }
body.clh-site #page-container .clh-contact-form h1.et_pb_contact_main_title { margin: 0 0 15px; padding: 0; font: 400 24px/28px 'PT Sans', Arial, Helvetica, sans-serif; color: #1d7fba; }
body.clh-site #page-container .clh-contact-form form.et_pb_contact_form { margin: 0; padding: 0; }
body.clh-site #page-container .clh-contact-form p.et_pb_contact_field { margin: 0; padding: 0; width: auto; float: none; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_form_label { display: block; margin: 0; font: 400 15px/37px 'PT Sans', Arial, Helvetica, sans-serif; color: #555555; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_field input.input, body.clh-site #page-container .clh-contact-form .et_pb_contact_field textarea.input {
  display: block; margin: 0; padding: 8px 15px; border: 1px solid #e1e1e1; border-radius: 0; background: #ffffff; box-shadow: none; box-sizing: content-box;
  font: 400 14px/19px 'PT Sans', Helvetica, sans-serif; color: #555555; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_field .input::placeholder { color: transparent; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_field textarea.input { min-height: 0; resize: vertical; }
body.clh-site #page-container .clh-contact-form .et_contact_bottom_container { float: none; margin: 0; text-align: left; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_right { float: none; text-align: left; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_right p.clearfix { position: relative; float: none; margin: 0; padding: 0; font: 400 15px/37px 'PT Sans', Arial, Helvetica, sans-serif; color: #555555; text-align: left; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_right p.clearfix::before { content: "Verification"; display: block; visibility: visible; height: auto; color: #555555; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_right p.clearfix::after { display: none; }
body.clh-site #page-container .clh-contact-form .et_pb_contact_captcha_question { font: 400 15px/37px 'PT Sans', Arial, Helvetica, sans-serif; color: #555555; }
body.clh-site #page-container .clh-contact-form input.et_pb_contact_captcha { display: inline-block; width: 40px; margin: 0 0 0 10px; padding: 8px 15px; border: 1px solid #e1e1e1; border-radius: 0; background: #ffffff;
  box-sizing: content-box; font: 400 14px/19px 'PT Sans', Helvetica, sans-serif; color: #555555; vertical-align: top; }
body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button {
  display: block; width: auto; height: 43px; margin: 0; padding: 0 65px !important; border: 0 !important; border-radius: 0 !important; box-sizing: border-box;
  background: #f3c70e !important; color: #222222 !important; font: 700 14px/43px 'PT Sans', Arial, Helvetica, sans-serif !important; text-transform: uppercase; letter-spacing: 1.5px !important; cursor: pointer; transition: all 1s; }
body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button:hover,
body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button:focus,
body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button:active { background: #072e53 !important; color: #ffffff !important; padding: 0 65px !important; }
body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button::after { display: none !important; }
body.clh-site #page-container .clh-contact-form form.et_pb_contact_form::after { content: "Required fields"; display: block; visibility: visible; height: auto; clear: none; justify-self: start; align-self: center;
  padding-right: 20px; font: 400 11px/22px 'PT Sans', Arial, Helvetica, sans-serif; color: #555555; background: url(/wp-content/uploads/ilaunch/skin/images/icon-required.png) no-repeat right center; }
body.clh-site #page-container .clh-contact-form .et-pb-contact-message, body.clh-site #page-container .clh-contact-form .et-pb-contact-message p { font: 400 15px/22px 'PT Sans', Arial, Helvetica, sans-serif; color: #555555; }
@media (min-width: 1250px) {
  body.clh-site #page-container .clh-contact-form form.et_pb_contact_form { display: grid; grid-template-columns: 115px 634px; grid-auto-rows: auto; column-gap: 0; row-gap: 0; align-items: start; }
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field, body.clh-site #page-container .clh-contact-form .et_contact_bottom_container,
  body.clh-site #page-container .clh-contact-form .et_pb_contact_right { display: contents; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_form_label { grid-column: 1; padding: 5px 10px 5px 5px; text-align: right; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field input.input { grid-column: 2; width: 204px; margin: 5px 20px 5px 5px; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field textarea.input { grid-column: 2; width: 577px; height: 72px; margin: 5px 20px 5px 5px; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field_0 > * { grid-row: 1; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field_1 > * { grid-row: 2; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field_2 > * { grid-row: 3; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_field_3 > * { grid-row: 4; }
  /* the required star: the field paragraph's own ::after (a grid item, the paragraph being display: contents) in the field cell's right padding */
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field:has(> [data-required_mark="required"])::after { content: ""; display: block; width: 16px; height: 16px; margin: 7px 0 0;
    grid-column: 2; justify-self: end; align-self: start; background: url(/wp-content/uploads/ilaunch/skin/images/icon-required.png) no-repeat; visibility: visible; }
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field_0::after { grid-row: 1; }
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field_1::after { grid-row: 2; }
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field_2::after { grid-row: 3; }
  body.clh-site #page-container .clh-contact-form p.et_pb_contact_field_3::after { grid-row: 4; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_right p.clearfix { grid-area: 5 / 2; padding: 5px 20px 5px 5px; }
  body.clh-site #page-container .clh-contact-form .et_pb_contact_right p.clearfix::before { content: none; display: none; }
  body.clh-site #page-container .clh-contact-form input.et_pb_contact_captcha { margin-left: 10px; }
  /* fix round 2 R2-1 (11 Oct 2026): this rule lacked .et_pb_button, so the base rule above (one more class) won and the button was 43px with no
     border; now live's Add Comment button: 45px, live's 0 65px padding, a 1px #e1e1e1 border in every state. Its width follows its own label as
     live's does (Add Comment 242px, Unsubscribe 234px, Submit 189px). Live keeps the rest colours on focus and while pressed (only hover
     changes), so focus and active show the rest look here too (the browser's focus ring, rule 26, marks keyboard focus); hover stays white on
     live's header navy (AA, recorded in design-diff: live's sky-blue hover is 3.1:1). */
  body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button { grid-area: 6 / 2; justify-self: start; height: 45px; margin: 5px 20px 5px 5px !important; border: 1px solid #e1e1e1 !important; line-height: 43px !important; }
  body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button:focus:not(:hover),
  body #page-container .et_pb_section .clh-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button:active:not(:hover) { background: #f3c70e !important; color: #222222 !important; }
  body.clh-site #page-container .clh-contact-form form.et_pb_contact_form::after { grid-area: 7 / 2; justify-self: stretch; align-self: start; min-height: 37px; margin: 0; padding: 5px 20px 5px 5px; text-align: right;
    font-size: 11px; line-height: 16px; background-position: right 0 top 7px; }
}

/* 27b. Newsletter unsubscribe form (/newsletter/unsubscribe, unlinked, reached from old newsletters). Fix round 1 V12 (10 Oct 2026), a DELIBERATE
   launch default on the orchestrator's call (Bryan can override at launch): live's form posts to iLaunch's own newsletter list, which has no
   WordPress endpoint, so here a Divi form (class clh-unsub-form) emails the request to the site's enquiry address and then opens live's
   /newsletter/unsubscribe-complete page ("You have been unsubscribed"), the same way a sister site's was handled. Same single Email
   field as live, plus Divi's maths question (live's form had none). At 1250 and up it is dressed as live's own table.form on this page:
   2px table spacing round the cells, a 115px label cell, a 261px field cell (the 236 x 36px field and the star in its right padding), the
   Unsubscribe button under it; the question sits between the field and the button. No "Required fields" line at any width (live has none). */
body.clh-site #page-container .clh-unsub-form form.et_pb_contact_form::after { content: none; display: none; }
@media (min-width: 1250px) {
  body.clh-site #page-container .clh-unsub-form form.et_pb_contact_form { grid-template-columns: 115px 261px; column-gap: 2px; row-gap: 2px; padding: 2px; }
  body.clh-site #page-container .clh-unsub-form .et_pb_contact_right p.clearfix { grid-area: 2 / 2; }
  body #page-container .et_pb_section .clh-contact-form.clh-unsub-form.et_pb_contact_form_container.et_pb_module .et_pb_contact_submit.et_pb_button { grid-area: 3 / 2; }
  /* live's field is 36px tall (Divi's input line box made it 37); the button's 45px and border come from rule 27 (fix round 2) */
  body.clh-site #page-container .clh-unsub-form .et_pb_contact_field input.input { height: 18px; }
}

/* 28. Live's .socialwidgets block holds Google +1 and Facebook Like placeholders (dead services). Facebook's script still turns the Like
   placeholder into an empty 22px-tall inline box, so for a real visitor every live page with the block is 22px taller (block 42px, here 20px).
   Reproduced as an empty inline box (one 22px line) from 1170px, where live's layout is kept; the designed bands below skip the gap. Stage 3's
   pixel run blocked facebook.net on both sides, which hid this.
   Fix round 1 V3 (10 Oct 2026): four posts (32, 33, 34, 40) also carry live's Like placeholder INSIDE their text (a div.fb-like holding a
   no-break space, which already draws one 22px line here); the added line made those blocks 64px (live 42px) and the four posts 22px taller
   than live at 1440. The line is added only to a block with no placeholder of its own. */
@media (min-width: 1170px) { body.clh-site #page-container .socialwidgets:not(:has(> .fb-like))::after { content: ""; display: inline-block; } }

/* 29. Photo pop-up (fancybox, appended to <body>): the CSS port scoped the shadow pieces' base rule (.fancy-bg: absolute 20 x 20px boxes
   at z-index 1001) under #page-container, so it never reached them and the frame's bottom shadow strip had no height (found by comparing
   the open pop-up with live at 1440, 768 and 390). Live's rule, scoped to the body. */
body.clh-site .fancy-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }