/* gw-design.css - Grangewood Court DESKTOP parity layer (Stage 4). Loads after gw-bundle.css + gw-live.css (live's CSS, scoped
   under body.gw-site #page-container) and before gw-mobile.css. Every rule undoes something Divi adds that live iLaunch never
   had, or keeps a Stage 3 functional fix. Adapted from kit ilaunch-divi-parity.template.css ($B = body.gw-site,
   $P = body.gw-site #page-container, $H = body.gw-site.gw-home #page-container, $SC = gw). The kit template's sample form and
   calendar colours are NOT used: this site's own values are below, read from live general.css and live renders. */

/* ---- Stage 3 functional rules (kept) ---- */
/* keyless map embed (kit port_maps.py --css) */
body.gw-site #page-container .map-wrapper { position: relative; }
body.gw-site #page-container .map-container iframe.ils-map { display: block; width: 100%; height: 100%; min-height: 300px; border: 0; }
body.gw-site #page-container .map-wrapper .map-info { display: block; position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 3; background: #fff; padding: 8px 14px; box-shadow: 0 1px 6px rgba(0,0,0,.35); font-size: 14px; line-height: 20px; text-align: center; }
/* Divi's own .container is position:relative; live's .container is static. With relative, home.css's z-index:999 on
   .upper-content .mid-bg .container starts to apply and paints the content column over the booking bar (Book Now untappable).
   (#header .container keeps live's relative: its own live rule carries two ids and wins.) */
body.gw-site #page-container .container { position: static; }
/* The decorative curves (.upper-bg, .lower-bg) are absolutely positioned over the content column and, on short pages (search,
   news), sit on top of the form controls. They carry no content: let clicks pass through. */
body.gw-site #page-container .upper-content .upper-bg, body.gw-site #page-container .upper-content .lower-bg { pointer-events: none; }

/* ---- 1. box sizing: live assumes content-box; Divi sets border-box everywhere ---- */
body.gw-site #page-container, body.gw-site #page-container *, body.gw-site #page-container *::before, body.gw-site #page-container *::after { box-sizing: content-box; }
body.gw-site #page-container .et_pb_contact_form_container, body.gw-site #page-container .et_pb_contact_form_container * { box-sizing: border-box; }
body.gw-site #page-container select, body.gw-site #page-container button,
body.gw-site #page-container input[type=submit], body.gw-site #page-container input[type=button], body.gw-site #page-container input[type=reset], body.gw-site #page-container input[type=image] { box-sizing: border-box; }

/* ---- 2. Divi caps .container at 80% / 1080px; live's .container is a fixed 1170px ---- */
body.gw-site #page-container .container { max-width: none; }

/* ---- 3. Divi pads "#main-content .container" 58px at the top; live's .container has none ---- */
html body.gw-site #main-content .container { padding-top: 0; }
/* Divi's right-sidebar rule draws a 1px vertical line on blog views; not on live */
body.gw-site #main-content .container::before { display: none; }

/* ---- 4. browser-default spacing and type the live CSS relies on (zero-id: every live rule still wins) ---- */
body.gw-site { font-weight: normal; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }
body.gw-site :where(.et-l, #main-content) p { padding-bottom: 0; margin-bottom: 1em; }
body.gw-site :where(.et-l, #main-content) ul, body.gw-site :where(.et-l, #main-content) ol { padding: 0 0 0 40px; margin: 1em 0; line-height: inherit; list-style-position: outside; }
body.gw-site :where(.et-l, #main-content) ul { list-style-type: disc; }
body.gw-site :where(.et-l, #main-content) ol { list-style-type: decimal; }
body.gw-site :where(.et-l, #main-content) :is(ul, ol) :is(ul, ol) { margin-top: 0; margin-bottom: 0; }
body.gw-site :where(.et-l, #main-content) ul ul { list-style-type: circle; }
body.gw-site :where(.et-l, #main-content) ul ul ul { list-style-type: square; }
body.gw-site :where(.et-l, #main-content) h5 { font-size: 0.83em; color: inherit; line-height: inherit; }
body.gw-site :where(.et-l, #main-content) h6 { font-size: 0.67em; margin: 2.33em 0; font-weight: bold; color: inherit; line-height: inherit; }
body.gw-site :where(.et-l, #main-content) :is(h1, h2, h3, h4, h5, h6) { padding-bottom: 0; }
body.gw-site :where(.et-l, #main-content) strong, body.gw-site :where(.et-l, #main-content) b { font-weight: bold; }
/* Divi colours every <a> #2ea3f2; live colours only a:link, so name anchors inherit */
body.gw-site :where(#page-container a:not([href])) { color: inherit; }

/* ---- 5. Divi's content-table look is not on live: browser defaults, honouring width/cellpadding attributes ---- */
body.gw-site :where(.et-l, #main-content) table:not(.variations) { border: 0; margin: 0; width: auto; text-align: start; border-collapse: separate; }
body.gw-site :where(.et-l, #main-content) table[width="100%"]:not(.variations) { width: 100%; }
body.gw-site :where(.et-l, #main-content) tr td, body.gw-site :where(.et-l, #main-content) tr th { border-top: 0; padding: 1px; }
body.gw-site :where(.et-l, #main-content) table[cellpadding="0"] tr td, body.gw-site :where(.et-l, #main-content) table[cellpadding="0"] tr th { padding: 0; }

/* ---- 6. Divi draws a 5px rule down the left of every blockquote; live's blockquote is the quote-icon look (reviews) ---- */
body.gw-site :where(.et-l, #main-content) blockquote { border-left: 0; border-top-color: currentColor; border-left-color: currentColor; border-right-color: currentColor; }

/* ---- 7. phone menu button (header fragment; never shown at desktop widths) ---- */
body.gw-site #page-container .ils-menu-toggle { display: none; }

/* ---- 8. booking calendar: appended to <body>, outside #page-container; live's rules unscoped (an earlier V2 site's fix round 1 lesson) ---- */
body.gw-site #datepicker_div, body.gw-site #datepicker_div * { box-sizing: revert; }

/* ---- 9. contact (page 1370) and review (page 1368) forms: Divi's contact-form module dressed as live's table.form, measured on
   live at 1440: a 562px table in .right, label column 111px (5px 10px 5px 5px, 20px line, #444), field column 451px
   (5px 20px 5px 5px), white 426 x 31px inputs (5px 10px, 1px #cbcbcb, 14px #666), 426 x 107px message box (+6px line gap),
   an 85px verification row (live: iLaunch's 3-letter image code; here Divi's maths question, a DELIBERATE difference),
   #00becf 236 x 44px SUBMIT (robotobold 18px, 10px 85px, hover #264c76), and the gold required star 430px 7px into the field
   cell of each required row. Rows: 41, 41, 41, 123, 85, 54 (+ the 32px "Required fields" row on reviews). ---- */
body.gw-site #page-container .gw-contact-form { width: 562px; max-width: 100%; margin: 15px 0 0 0; padding: 0; }
body.gw-site #page-container .gw-contact-form .et-pb-contact-message:empty { display: none; }
body.gw-site #page-container .gw-contact-form .et_pb_contact { padding: 0; margin: 0; }
body.gw-site #page-container .gw-contact-form form.et_pb_contact_form { display: grid; grid-template-columns: 111px 451px; margin: 0; padding: 0; }
body.gw-site #page-container .gw-contact-form p.et_pb_contact_field,
body.gw-site #page-container .gw-contact-form .et_contact_bottom_container,
body.gw-site #page-container .gw-contact-form .et_pb_contact_right { display: contents; }
body.gw-site #page-container .gw-contact-form .et_pb_contact_form_label {
  display: block; grid-column: 1; position: relative; margin: 0; padding: 5px 10px 5px 5px; font: 400 14px/20px 'robotoregular', Arial, Helvetica, sans-serif; color: #444444; text-align: left; }
body.gw-site #page-container .gw-contact-form p.et_pb_contact_field .input {
  grid-column: 2; display: block; width: 426px; max-width: 100%; height: 31px; margin: 5px 20px 5px 5px; padding: 5px 10px; border: 1px solid #cbcbcb; border-radius: 0;
  background: #ffffff; font: 400 14px/normal 'robotoregular', Helvetica, sans-serif; color: #666666; box-shadow: none; }
body.gw-site #page-container .gw-contact-form p.et_pb_contact_field textarea.input { height: 107px; min-height: 107px; margin-bottom: 11px; resize: both; }
body.gw-site #page-container .gw-contact-form p.et_pb_contact_field .input::placeholder { color: transparent; }
body.gw-site #page-container .gw-contact-form .input.et_contact_error { border-color: #e02b20; }
/* required star: live paints it in the field cell at 430px 7px, i.e. 541px right of the label cell's left edge */
body.gw-site #page-container .gw-contact-form p.et_pb_contact_field:has(> [data-required_mark="required"]) > .et_pb_contact_form_label::after {
  content: ""; position: absolute; left: 541px; top: 7px; width: 16px; height: 16px; background: url(/wp-content/uploads/ilaunch/skin/images/icon-required.png) no-repeat 0 0; }
/* verification row (live 85px: the code image and its box, then a two-line note about the red box, which does not apply to
   Divi's maths question and is not shown) */
body.gw-site #page-container .gw-contact-form .et_pb_contact_right p.clearfix {
  grid-column: 2; display: block; float: none; margin: 0; padding: 5px 20px 5px 5px; min-height: 85px; text-align: left; font: 400 14px/31px 'robotoregular', Helvetica, sans-serif; color: #444444; }
body.gw-site.page-id-1368 #page-container .gw-contact-form .et_pb_contact_right p.clearfix { background: url(/wp-content/uploads/ilaunch/skin/images/icon-required.png) no-repeat 430px 7px; }
body.gw-site #page-container .gw-contact-form .et_pb_contact_captcha_question { font: inherit; color: inherit; }
body.gw-site #page-container .gw-contact-form input.et_pb_contact_captcha {
  display: inline-block; width: 62px; max-width: none; height: 31px; margin: 0 0 0 10px; padding: 5px 10px; border: 1px solid #cbcbcb; border-radius: 0; background: #ffffff;
  font: 400 14px/normal 'robotoregular', Helvetica, sans-serif; color: #666666; vertical-align: top; box-shadow: none; }
body.gw-site #page-container .gw-contact-form input.et_pb_contact_captcha.et_contact_error { border-color: #e02b20; }
/* submit: live input.button */
body.gw-site #page-container .et_pb_section .gw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button {
  grid-column: 2; justify-self: start; display: inline-block; width: auto; height: 44px; margin: 5px 0 5px 5px !important; padding: 10px 85px !important; border: 0 !important; border-radius: 0 !important;
  background: #00becf !important; color: #ffffff !important; font: 400 18px/24px 'robotobold', Arial, Helvetica, sans-serif !important; text-transform: uppercase; letter-spacing: 0 !important; cursor: pointer; transition: none; }
body.gw-site #page-container .et_pb_section .gw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button:hover { background: #264c76 !important; color: #ffffff !important; padding: 10px 85px !important; }
body.gw-site #page-container .et_pb_section .gw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button::after { display: none !important; }
/* "Required fields": contact = inside the submit row, right-aligned, star at 430px 7px of the cell (the note is pulled up into the
   row beside the button, and only as wide as its own words, so it never sits over the button); reviews = its own 32px row */
body.gw-site #page-container .upper-content p.ils-required-note {
  position: relative; height: 22px; margin: 0 0 15px 111px; padding: 5px 20px 5px 5px; text-align: right; line-height: 22px;
  background: url(/wp-content/uploads/ilaunch/skin/images/icon-required.png) no-repeat 430px 7px; }
body.gw-site #page-container .upper-content p.ils-required-note em.required { font-size: 11px; font-style: normal; line-height: 18px; color: #979797; }
body.gw-site.page-id-1370 #page-container .upper-content p.ils-required-note { width: auto; height: 44px; margin: -54px 0 15px 469px; padding: 5px 20px 5px 0; background-position: 72px 7px; }
body.gw-site.page-id-1370 #page-container .upper-content p.ils-required-note em.required { display: block; float: right; line-height: 22px; white-space: nowrap; }
/* (fix round 1, 3.18 N4) "Required fields" at 11px is 73.3px wide, so in the old fixed 73px box it wrapped to "Required" over "fields"
   and its first line sat 30px right of live. On one line, in a box that runs to the column's right edge less the star's 20px (as
   the reviews note does; the column starts at a fractional x), it ends exactly where live's does, beside the star. The box is still
   only about 93px wide, so it never sits over the Submit button. Below 1250 the phone layer sets its own width. */
/* once Divi swaps the form for its thank-you line, the note has nothing to sit beside */
body.gw-site #page-container .gw-contact-form:not(:has(form)) + p.ils-required-note { display: none; }

/* ---- 10. posts, archives and other non-builder views: .upper-content's -110px top margin (live: it rides up over the hero's
   lower edge) collapsed out through #main-content and #et-main-area and was lost, so every post sat 110px low. A block
   formatting context on #main-content keeps the margin inside it, as Divi's builder column does on pages. ---- */
body.gw-site #main-content { display: flow-root; }

/* ---- 11. TripAdvisor widget (test page): its own ".cdsROW .cdsLocName a {color:#002b11}" beats live's a:link on live; the
   scoped port of a:link (#page-container) flipped that. Restore the widget's colour (the footer's own #footer a still wins). ---- */
body.gw-site #page-container .cdsROW .cdsLocName a { color: #002b11; }

/* ---- 12. booking calendar parity (an earlier V2 site's fix round 1 lesson): iLaunch appends #datepicker_div to <body>, outside #page-container,
   but the CSS port scoped the plugin's ".datepicker" table rules (width 100%, #ccc ground, centred cells; links as blocks) and live's
   "td" type rules under #page-container. The plugin sizes the calendar from the table's width, so it opened 127px wide where live's
   is 187px. Live's rules, for the calendar only: ---- */
body.gw-site #datepicker_div .datepicker { clear: both; float: left; width: 100%; color: #fff; background: #ccc; text-align: center; font-size: 100%; border-collapse: separate; }
body.gw-site #datepicker_div .datepicker a { display: block; width: 100%; }
body.gw-site #datepicker_div td { font-family: 'robotoregular', Helvetica, sans-serif; font-size: 14px; color: #444444; line-height: 22px; vertical-align: top; }
/* live's generic "select" padding and type reach the calendar's month and year selects on live (scoped away here) */
body.gw-site #datepicker_div select { padding: 4px 8px; font-family: 'robotoregular', Helvetica, sans-serif; }

/* ---- 13. Phone numbers (fix round 1, 3.18 N1; kit rule of 2026-10-07, parity template section 18): live shows "(07) 5538 7782" as
   plain text in the header band, the footer vcard and the contact table, which iOS Safari turns into its own links in its own colours
   (unreadable on this site's dark bands). They are explicit tel: links (class tel-link, written with kit/ilaunch_tel.py; the fax stays
   plain) that keep the surrounding text exactly, with no underline, in every state and at every width, so 1250 and up is
   pixel-identical to live. ilaunch-site.php emits format-detection telephone=no so iOS links nothing else. The class plus the
   attribute out-rank live's ".vcard a { color: #00becf !important }" and the phone layer's ".vcard a:is(...)" colours. ---- */
body.gw-site #page-container a.tel-link[href^="tel:"], body.gw-site #page-container a.tel-link[href^="tel:"]:is(:link, :visited, :hover, :active, :focus),
body.gw-site a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font: inherit; }
/* The header band behind the number is a sibling layer (#header-bg), so contrast tools walk up to the white page and read white on
   white. Measured from pixels with the text hidden, the link's whole box sits on flat #25315a at every width from 320 to 1920
   (fix1-20261007/n1/band_under_tel-*.txt): the link carries that colour as its own ground, invisible (1250 and up pixel-identical to
   live, n1/pix-*.txt), and the tools measure the real pair, white on navy 12.6:1. */
body.gw-site #page-container #header .phone a.tel-link { background-color: #25315a; }

/* ---- 14. Booking bar boxes level (Jake, 2026-10-09): the check-in box grew to 39px (the date input is 29px tall) while the duration box
   stayed 34px, so their borders did not line up. Both boxes now share one fixed border-box height with their contents centred.
   768 and up only; the phone layout already fixes both at 50px. ---- */
@media (min-width: 768px) {
  body.gw-site #page-container .bookingform span.check-in, body.gw-site #page-container .bookingform span.duration {
    box-sizing: border-box; display: flex; align-items: center; height: 38px; padding-bottom: 0; }
  body.gw-site #page-container .bookingform span.check-in .datepicker_wrap { display: flex; align-items: center; }
}