/* bw-mobile.css (Bradwell Constructions, Stage 4): the designed tablet and phone layouts. LAST css file.
   Live ships no viewport meta, so a real phone shows its 1170px page shrunk to fit; below 1250px these layouts are ours, in live's brand
   (dark #242627 ground, red #b51b00, Playfair Display headings, Montserrat text, same order of content).
   Bands: 1250 and up = live exactly (nothing in the media queries below applies); 900 to 1249 = live's two column layout, fitted, AA, 14px floor;
   768 to 899 = columns stack; below 768 = the phone design; below 480 = narrow phones.
   AA palette (computed with the 15 Oct 2026 contrast table in build/design/aa-palette.txt):
     link on dark #ff8a75 (see table), muted text on dark #c4c1b8, footer text on #111 #b4b4b4, white on #b51b00 = 6.7:1. */

/* ---- keyboard focus, every width (Divi's reset removes the rings; live shows none: deliberate, recorded in design-diff.md) ---- */
body.bw-site #page-container :is(a, button, input, textarea, select, summary, iframe, [tabindex]):focus-visible { outline: 3px solid #ffffff; outline-offset: 2px; box-shadow: 0 0 0 5px #000000; transition: none; }
body.bw-site #page-container #menu li ul :is(a, button):focus-visible, body.bw-site #page-container .map-info :is(a, button):focus-visible { outline: 3px solid #000000; box-shadow: 0 0 0 5px #ffffff; }
body.bw-site #page-container iframe:focus { outline: 3px solid #ffffff; outline-offset: 2px; box-shadow: 0 0 0 5px #000000; }
body.bw-site #page-container a:focus-visible > img { outline: 3px solid #ffffff; outline-offset: 2px; }
/* the drop-down also opens on keyboard focus and (below) on touch */
body.bw-site #page-container #menu li:focus-within > ul { display: block; }
body.bw-site #page-container #menu li:focus-within > a.parent { background-image: url(/wp-content/uploads/ilaunch/skin/icon-arrow-up.png); }

@media (max-width: 1249px) {
body.bw-site { --bw-link: #ff8a75; --bw-muted: #c4c1b8; --bw-foot: #b4b4b4; }

/* ---------- AA colours (live's #b51b00 link on #242627 is 2.3:1) ---------- */
body.bw-site #page-container #content :is(a:link, a:visited, a:active) { color: var(--bw-link); text-decoration: underline; }
body.bw-site #page-container #content :is(a:hover, a:focus) { color: #ffffff; }
body.bw-site #page-container #content :is(h1, h2, h3, h4) a:link, body.bw-site #page-container #content :is(h1, h2, h3, h4) a:visited { color: #ffffff; text-decoration: none; }
body.bw-site #page-container #content :is(.button, a.button):is(:link, :visited, :active, :hover, :focus), body.bw-site #page-container #content :is(.projects, .banner, #featured-project, .paging, .filter-tabs) a:is(:link, :visited, :active, :hover, :focus) { text-decoration: none; }
body.bw-site #page-container #content :is(a.button.more, a.button):is(:link, :visited, :active, :hover, :focus) { color: #ffffff; }
body.bw-site #page-container #content .projects a:is(:link, :visited, :active, :hover, :focus), body.bw-site #page-container #content :is(.banner, #featured-project) a:is(:link, :visited, :active, :hover, :focus) { color: #ffffff; }
body.bw-site #page-container #content a.link:is(:link, :visited, :active, :hover) { color: #ffffff; text-decoration: none; }
body.bw-site #page-container #content .paging a:is(:link, :visited, :active) { color: #222222; }
body.bw-site #page-container #content .paging :is(em a, a:hover) { color: #ffffff; background: #b51b00; }
body.bw-site #page-container #content .filter-tabs__tab a:is(:link, :visited, :active) { color: #d0d0d0; }
body.bw-site #page-container #content .filter-tabs__tab.active a { color: #ffffff; }
body.bw-site #page-container #content .map-info a:is(:link, :visited, :active) { color: #b51b00; }
body.bw-site #page-container #content .map-info a:hover { color: #000000; }
body.bw-site #page-container #content a.project-website:is(:link, :visited, :active, :hover) { color: #ffffff; text-decoration: none; }
/* red text on dark that is not a link */
body.bw-site #page-container .form label.required::after, body.bw-site #page-container .bw-contact-form p.et_pb_contact_field:has(> [data-required_mark="required"]) > .et_pb_contact_form_label::after { color: var(--bw-link); }
body.bw-site #page-container #content blockquote .highlight, body.bw-site #page-container #content em.highlight { color: #ffffff; }
body.bw-site #page-container #content :is(.entry .details, .entry .date, .entry .info, .panel .details, .panel .title, .panel .date, .panel em, .panel li, .testimonial p, .testimonial .details, .gallery-info p, .comment) { color: var(--bw-muted); }
body.bw-site #page-container #content .panel li p { color: #ffffff; }
body.bw-site #page-container #content blockquote .details { color: var(--bw-muted); }
body.bw-site #page-container #content .submenu a:is(:link, :visited) { color: var(--bw-muted); }
/* the footer: #666 and #888 text on #111 is 3.3:1 and 5.3:1 */
body.bw-site #page-container #footer { color: var(--bw-foot); font-size: 14px; line-height: 22px; }
body.bw-site #page-container #footer .vcard { font-size: 14px; line-height: 22px; }
body.bw-site #page-container #footer .vcard .org { font-size: 16px; }
body.bw-site #page-container #footer a:is(:link, :visited, :active) { color: var(--bw-foot); }
body.bw-site #page-container #footer a:hover { color: #ffffff !important; }
body.bw-site #page-container #footer .vcard .email a:is(:link, :visited, :active), body.bw-site #page-container #footer .tag { color: var(--bw-link) !important; text-decoration: underline; }
body.bw-site #page-container #footer .copyright, body.bw-site #page-container #footer .copyright a, body.bw-site #page-container #footer .footer-tags p { color: var(--bw-foot); font-size: 14px; }
body.bw-site #page-container #footer .vcard .tel span { color: #ffffff; }
body.bw-site #page-container #footer .vcard .tel { color: var(--bw-foot); }
body.bw-site #page-container #footer .footermenu a:is(:link, :visited, :active) { display: inline-block; padding: 6px 2px; }
body.bw-site #page-container #footer :is(.vcard li, .footer-tags p) a { display: inline-block; padding: 4px 0; line-height: 18px; }
/* buttons: 11px uppercase is under the 14px floor; white on #b51b00 is 6.7:1, hover black */
body.bw-site #page-container :is(.button, a.button, input.button, .et_pb_contact_submit.et_pb_button), body #page-container .et_pb_section .bw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button { font-size: 14px !important; line-height: 20px; min-height: 40px; }
body.bw-site #page-container .button.more { line-height: 25px; }
body.bw-site #page-container :is(.button, a.button, input.button):is(:hover, :focus, :active) { background-color: #000000; color: #ffffff; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_submit.et_pb_button:is(:hover, :focus, :active), body #page-container .et_pb_section .bw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button:is(:hover, :focus, :active) { background: #000000 !important; color: #ffffff !important; }
/* slick arrows and dots: the label text is drawn transparent (the icon is the ::before glyph); give it a real 14px size and a readable colour so the audit and screen readers see a labelled control */
body.bw-site #page-container :is(.slick-prev, .slick-next, .slick-dots li button):is(:link, :visited, :hover, :focus, :active, :focus-visible, :not(:hover)) { font-size: 14px; line-height: 1; color: #ffffff; -webkit-text-fill-color: transparent; }
body.bw-site #page-container :is(.slick-prev, .slick-next, .slick-dots li button)::before { -webkit-text-fill-color: currentcolor; }
body.bw-site #page-container :is(.slick-prev, .slick-next) { min-width: 40px; min-height: 40px; background: rgba(0, 0, 0, 0.55); border-radius: 50%; }
body.bw-site #page-container :is(.slick-prev, .slick-next):is(:hover, :focus) { background: #000000; }
body.bw-site #page-container .project-completed h2 { color: #5f5f5f; }
/* body text floors */
body.bw-site #page-container :is(.project-contact, .project-contact p, .project-form .form th, .project-form .form td, .project-form .form label, .map-info-window, .grid p, .comment, .panel .date, .paging, .paging-container, div.top, .paging-container .paging) { font-size: 14px; }
body.bw-site #page-container .bw-project-form :is(.et_pb_contact_form_label, .et_pb_contact_captcha_question) { font-size: 14px; }
body.bw-site #page-container .projects .entry .text em, body.bw-site #page-container .projects .entry .sub-text, body.bw-site #page-container .projects .entry .summary { font-size: 14px; line-height: 18px; }
body.bw-site #page-container .paging a:is(:link, :visited, :active) { width: 32px; height: 32px; line-height: 32px; font-size: 14px; }
body.bw-site #page-container div.top a { padding: 4px 12px; font-size: 14px; line-height: 24px; }
body.bw-site #page-container blockquote .details { font-size: 14px; }
body.bw-site #page-container .form .captcha-message { font-size: 14px; }
body.bw-site #page-container #content :is(td, li, .title, .details, p.more-wrap) > a:not(.button), body.bw-site #page-container #content :is(a.more, a.tel-link, .panel a, .map-info a) { display: inline-block; padding: 3px 0; line-height: 20px; }
body.bw-site #page-container #content div.top a:is(:link, :visited, :active) { color: #222222; text-decoration: none; }
body.bw-site #page-container #content div.top a:is(:hover, :focus) { color: #ffffff; background: #b51b00; }

body.bw-site #page-container #header a.tel { padding-top: 3px; padding-bottom: 3px; }
/* fields: 16px text, 40px tall below 1250 (live's 14px, 26px fields are the 1250 and up look) */
body.bw-site #page-container :is(.bw-contact-form .et_pb_contact_field input.input, .bw-contact-form input.et_pb_contact_captcha, .search input.clicknclear, .panel input.clicknclear) { font-size: 16px; height: 40px; padding: 8px 10px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_field textarea.input { font-size: 16px; padding: 8px 10px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_right p.clearfix, body.bw-site #page-container .bw-contact-form .et_pb_contact_captcha_question { font-size: 16px; }
/* ---------- the menu: a drop-down opens on keyboard focus and on a tap ---------- */
body.bw-site #page-container #menu li ul a:is(:link, :visited, :active) { line-height: 24px; }
body.bw-site #page-container #menu li.ils-open > ul { display: block; }
body.bw-site #page-container #menu li.ils-open > a.parent { background-image: url(/wp-content/uploads/ilaunch/skin/icon-arrow-up.png); }
body.bw-site #page-container #menu li:hover ul a:is(:hover, :focus), body.bw-site #page-container #menu li ul a:is(:hover, :focus) { color: #ffffff; background: #b51b00; }

/* ---------- home hero and tiles ---------- */
body.bw-site #page-container #featuremain { height: clamp(380px, 62vw, 690px); }
body.bw-site #page-container .featureoverlay { padding-bottom: 34px; }
body.bw-site:where(.bw-home) #page-container .featureoverlay .button.more { white-space: nowrap; width: 190px; margin-left: -95px; }
body.bw-site #page-container .featureoverlay h1 { font-size: clamp(22px, 3.4vw, 30px); line-height: 1.25; letter-spacing: 2px; border: 0; padding: 0; margin: 0; }
body.bw-site #page-container .three-columns { --bw-tile: clamp(380px, 40vw, 500px); }
body.bw-site:where(.bw-home) #page-container #featured-project { height: var(--bw-tile); }
body.bw-site #page-container .three-columns .banner img { height: calc(var(--bw-tile) / 2); }
body.bw-site #page-container .three-columns :is(#featured-project .text span) { font-size: clamp(24px, 3.6vw, 36px); line-height: 1.3; padding: 4px 16px; }
body.bw-site #page-container .three-columns #featured-project .text { left: 0; bottom: 16px; width: calc(100% - 16px); }
body.bw-site #page-container .three-columns #featured-project .text em { font-size: 14px; line-height: 1.5; padding: 4px 16px; }
body.bw-site #page-container .three-columns .banner .text, body.bw-site #page-container .three-columns .banner .text a { font-size: clamp(22px, 3vw, 30px); }
body.bw-site #page-container .three-columns .banner .text { padding: 0 16px; }
/* inner page banner: live's 260px strip */

body.bw-site #page-container #content ul.filter-tabs { padding: 0; margin: 0 0 14px; }
body.bw-site #page-container #content .filter-tabs__tab { margin: 0 10px 10px 0; }

body.bw-site #page-container .slick-dots li { width: 28px; height: 28px; }
body.bw-site #page-container .slick-dots li button { width: 28px; height: 28px; padding: 0; }
body.bw-site #page-container .slick-dots li button::before { width: 28px; height: 28px; line-height: 28px; }
body.bw-site #page-container #project-gallery .slick-dots { height: 28px; }
/* ---------- 900 to 1249: live's two column layout, tiles three across ---------- */
/* live lays the project tiles out with Masonry (absolute positions from the item widths), so only widths and the tile margin are set here */
body.bw-site #page-container .projects { margin-right: 0; }
body.bw-site #page-container .projects .entry-container { width: 25%; }
body.bw-site #page-container .projects .entry { margin: 0 12px 12px 0; }
body.bw-site #page-container .projects .entry a { height: 250px; }
body.bw-site #page-container .projects .entry .text { min-height: 44px; }
/* no hover on a tablet or phone: the one line summary is always shown instead of growing on hover */
body.bw-site #page-container .projects .entry .summary { max-height: none; overflow: visible; margin-top: 4px; }
}

/* ---------- 768 to 1169: gallery and map heights follow the column ---------- */
@media (max-width: 1169px) {
body.bw-site #page-container .project-gallery-image { height: clamp(300px, 60vw, 785px); }
body.bw-site #page-container .map-container { height: clamp(320px, 50vw, 500px); }
body.bw-site #page-container .projects .entry-container { width: 33.333%; }
body.bw-site #page-container #content .project-images { margin-top: 20px; }
}

/* ---------- below 900: one column ---------- */
@media (max-width: 899px) {
body.bw-site #page-container #content :is(.left, .right, .mid):not(.three-columns > *), body.bw-site #page-container #content-cols2 :is(.left, .right) { float: none; width: 100%; margin-right: 0; min-height: 0; }
body.bw-site #page-container #content .project-images { float: none !important; }
body.bw-site #page-container #content.alt { display: flex; flex-direction: column; }
body.bw-site #page-container #content.alt > .project-images { order: -1; margin: 20px 0 8px; padding-bottom: 0; width: 100%; }
body.bw-site #page-container #content.alt > .project-details { order: 1; width: 100%; }
body.bw-site #page-container #content.alt > .clearboth { display: none; }
body.bw-site #page-container .project-contact { padding: 15px 0; }
body.bw-site #page-container .bw-project-form form.et_pb_contact_form { width: 100%; max-width: 480px; }
body.bw-site #page-container .bw-project-form .et_pb_contact_field input.input, body.bw-site #page-container .bw-project-form .et_pb_contact_field textarea.input { width: 100%; }
body.bw-site #page-container #project-gallery.slick-slider, body.bw-site #page-container #project-gallery .slick-slider { margin-bottom: 8px; padding-bottom: 0; }
body.bw-site #page-container .project-form { padding: 25px 0 10px; }
body.bw-site #page-container .panel { margin: 40px 0 0; }
}

/* ---------- below 768: the phone design ---------- */
@media (max-width: 767px) {
/* header: logo and the Menu button on one row, the phone number under them, the menu opens as a full width list */
body.bw-site #page-container #header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 12px 16px 4px; }
body.bw-site #page-container #header .logo { float: none; order: 1; flex: 0 1 auto; min-width: 0; }
body.bw-site #page-container #header .logo img { width: 210px; max-width: 100%; height: auto; margin: 0; }
body.bw-site #page-container #header .ils-menu-toggle { display: inline-flex; align-items: center; gap: 10px; order: 2; flex: 0 0 auto; min-height: 44px; padding: 0 16px; background: #b51b00; border: 0; border-radius: 0; color: #ffffff; font: 700 14px/1 'Montserrat', Arial, Helvetica, sans-serif; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; }
body.bw-site #page-container #header .ils-menu-toggle:is(:hover, :focus, :active) { background: #000000; color: #ffffff; }
body.bw-site #page-container #header .ils-menu-toggle span, body.bw-site #page-container #header .ils-menu-toggle span::before, body.bw-site #page-container #header .ils-menu-toggle span::after { display: block; width: 20px; height: 2px; background: #ffffff; content: ""; }
body.bw-site #page-container #header .ils-menu-toggle span { position: relative; }
body.bw-site #page-container #header .ils-menu-toggle span::before { position: absolute; top: -6px; left: 0; }
body.bw-site #page-container #header .ils-menu-toggle span::after { position: absolute; top: 6px; left: 0; }
body.bw-site #page-container #header span.phone { float: none; order: 3; display: block; width: 100%; }
body.bw-site #page-container #header a.tel { display: inline-block; min-height: 44px; line-height: 44px; background-position: left center; }
body.bw-site #page-container #header #menu { display: none; order: 4; float: none; width: 100%; margin: 0; text-align: left; }
body.bw-site #page-container #header.ils-menu-open #menu { display: block; }
body.bw-site #page-container #header #menu ul { display: block; float: none; width: 100%; }
body.bw-site #page-container #header #menu li { float: none; margin: 0; border-top: 1px solid #45484a; }
body.bw-site #page-container #header #menu a:is(:link, :visited, :active) { padding: 0 8px; line-height: 48px; background-image: none; margin-right: 0; }
body.bw-site #page-container #header #menu li ul { position: static; display: block; width: auto; padding: 0 0 6px 24px; background: none; }
body.bw-site #page-container #header #menu :is(li, li:hover) ul a:is(:link, :visited, :active) { padding: 0 8px; line-height: 44px; color: #ffffff; background: none; text-transform: uppercase; }
body.bw-site #page-container #header #menu :is(li, li:hover) ul a:is(:hover, :focus) { color: #ffffff; background: #b51b00; }
body.bw-site #page-container #header #menu li:last-child a.parent { margin-right: 0; }
body.bw-site #page-container #header .clearboth { display: none; }
/* hero */
body.bw-site #page-container #feature .featureimage { height: 180px; }
/* project 121 has no banner photo on live (an empty grey strip); a phone does not need the empty strip */
body.bw-site #page-container #feature .featureimage:not([style*="url"]) { display: none; }
body.bw-site #page-container #feature #featuremain { height: 300px; }
body.bw-site #page-container #feature .featureoverlay { position: static; width: auto; margin: 0; padding: 18px 16px 20px; left: auto; bottom: auto; }
body.bw-site #page-container #feature .featureoverlay h1 { font-size: 24px; line-height: 1.3; letter-spacing: 1px; }
body.bw-site:where(.bw-home) #page-container #feature .featureoverlay .button.more { position: static; display: inline-block; width: auto; margin: 14px auto 0; padding: 8px 24px; }
/* content */
body.bw-site #page-container :is(#content, #content-cols2) { padding: 24px 16px 32px; }
body.bw-site #page-container #content.alt { padding: 0 16px 24px; }
body.bw-site:where(.bw-home) #page-container #content.alt { padding: 0; }
body.bw-site #page-container h1 { font-size: 26px; line-height: 32px; letter-spacing: 1px; padding-bottom: 14px; margin-bottom: 20px; }
body.bw-site #page-container :is(h2, h3) { font-size: 21px; line-height: 27px; }
body.bw-site #page-container h2 { margin: 28px 0 14px; padding-bottom: 8px; }
body.bw-site #page-container h3 { margin: 28px 0 12px; }
body.bw-site #page-container :is(#content, #content-cols2) :is(.left, .right) > :is(h1, h2, h3):first-child { margin-top: 0; }
body.bw-site #page-container :is(#content) :is(ul, ol) { padding-left: 22px; }
body.bw-site #page-container #content :is(.panel, .gallery, .form, .grid, .filter-tabs, .submenu) ul { padding-left: 0; }
body.bw-site #page-container #content li { margin-bottom: 4px; }
body.bw-site #page-container [style*="justify"] { text-align: left !important; }
body.bw-site #page-container #content img { max-width: 100%; }
/* home tiles stack */
body.bw-site #page-container .three-columns { --bw-tile: 300px; display: flex; flex-direction: column; }
body.bw-site #page-container #content .three-columns > .right { order: 3; }
body.bw-site #page-container #content .three-columns > .clearboth { display: none; }
body.bw-site #page-container #content .three-columns :is(.left, .right) { width: 100%; margin: 0; float: none; }
body.bw-site:where(.bw-home) #page-container #content .three-columns .left { height: auto !important; margin: 0; }
body.bw-site #page-container .three-columns .banner { float: none; width: 100%; }
body.bw-site #page-container .three-columns .banner img { height: 220px; object-fit: cover; }
body.bw-site #page-container .three-columns #featured-project .text { bottom: 14px; }
body.bw-site #page-container .three-columns #featured-project .text span { font-size: 24px; padding: 4px 14px; }
body.bw-site #page-container .three-columns .banner .text, body.bw-site #page-container .three-columns .banner .text a { font-size: 24px; height: 44px; line-height: 44px; }
/* project cards: photo, then the red name bar */
body.bw-site #page-container .projects .entry { height: auto; min-height: 260px; display: flex; }
body.bw-site #page-container .projects .entry a { display: flex; flex-direction: column; justify-content: flex-end; width: 100%; height: auto; min-height: 260px; background-image: none; }
body.bw-site #page-container .projects .entry .text { position: static; width: 100%; min-height: 0; }
body.bw-site #page-container .projects .entry-container { width: 50%; }
/* two column pages: details under the photos, panels under the list */
body.bw-site #page-container .project-gallery-image { height: 70vw; min-height: 240px; max-height: 420px; }
body.bw-site #page-container #project-gallery .slick-dots { top: 12px; right: 8px; height: 28px; }
body.bw-site #page-container .slick-dots li { width: 28px; height: 28px; }
body.bw-site #page-container .slick-dots li button { width: 28px; height: 28px; padding: 0; }
body.bw-site #page-container .slick-dots li button::before { width: 28px; height: 28px; line-height: 28px; }
body.bw-site #page-container .project-completed h2 { line-height: 70px; }
/* forms: full width, 16px fields, 44px controls */
body.bw-site #page-container .bw-contact-form form.et_pb_contact_form { width: 100%; margin: 28px 0; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_field input.input, body.bw-site #page-container .bw-contact-form .et_pb_contact_field textarea.input { width: 100%; height: 44px; font-size: 16px; padding: 8px 12px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_field textarea.input { height: 120px; min-height: 120px; margin-bottom: 14px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_form_label { font-size: 14px; line-height: 28px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_right p.clearfix { min-height: 0; margin-bottom: 14px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_captcha_question { font-size: 16px; line-height: 44px; }
body.bw-site #page-container .bw-contact-form input.et_pb_contact_captcha { width: 90px; height: 44px; font-size: 16px; padding: 8px 12px; }
body.bw-site #page-container .bw-contact-form .et_pb_contact_submit.et_pb_button, body #page-container .et_pb_section .bw-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button { min-height: 44px; padding: 0 32px !important; font-size: 14px !important; }
body.bw-site #page-container .bw-project-form form.et_pb_contact_form { width: 100%; margin: 0; }
body.bw-site #page-container .bw-project-form .et_pb_contact_field input.input, body.bw-site #page-container .bw-project-form .et_pb_contact_field textarea.input { width: 100%; }
body.bw-site #page-container .bw-unsub-form form.et_pb_contact_form { width: 100%; padding: 0; }
body.bw-site #page-container .search { width: 100%; }
body.bw-site #page-container .search input.clicknclear { width: calc(100% - 110px); margin-right: 8px; font-size: 16px; min-height: 44px; }
body.bw-site #page-container .search input.button { min-height: 44px; }
body.bw-site #page-container .panel input.clicknclear { width: 100%; max-width: 100%; font-size: 16px; min-height: 44px; }
body.bw-site #page-container :is(input, select, textarea) { font-size: 16px; }
/* contact details table, map */
body.bw-site #page-container #content .left + .right { margin-top: 32px; }
body.bw-site #page-container #content .left table { width: 100%; }
body.bw-site #page-container #content .left td:first-child { width: 86px; }
body.bw-site #page-container #content .left td { overflow-wrap: anywhere; }
body.bw-site #page-container #content .left td a { overflow-wrap: anywhere; }
body.bw-site #page-container .map-container { height: 320px; }
body.bw-site #page-container .map-info-window { width: auto; max-width: 100%; min-height: 0; }
body.bw-site #page-container .map-wrapper .map-info { position: static; left: auto; bottom: auto; transform: none; display: block; margin: 0 0 12px; }
/* lists with thumbnails */
body.bw-site #page-container .entry .thumb, body.bw-site #page-container .entry .image { float: none; margin: 0 0 14px; }
body.bw-site #page-container blockquote { margin: 36px 0; padding: 0 0 0 52px; background-size: 36px auto; }
body.bw-site #page-container blockquote .thumb { float: none; margin: 0 0 16px; }
body.bw-site #page-container .paging-container { padding: 6px 10px; }
body.bw-site #page-container .paging-container :is(.paging, .options, .result-count, .sorting) { float: none; margin: 4px 0; width: auto; text-align: left; }
body.bw-site #page-container .grid { display: block; overflow-x: auto; }
/* footer */
body.bw-site #page-container #footer { padding: 24px 16px 28px; text-align: left; }
body.bw-site #page-container #footer .vcard { float: none; display: block; width: 100%; }
body.bw-site #page-container #footer .vcard ul { float: none; margin: 0; padding: 0 0 16px; border-right: 0; }
body.bw-site #page-container #footer .footermenu, body.bw-site #page-container #footer .socialmedia, body.bw-site #page-container #footer .copyright { float: none; clear: both; text-align: left; }
body.bw-site #page-container #footer .footermenu { margin: 8px 0; }
body.bw-site #page-container #footer .socialmedia { display: block; margin: 8px 0 14px; }
body.bw-site #page-container #footer .socialmedia a { margin: 0 12px 6px 0; }
body.bw-site #page-container #footer .footer-tags { text-align: left; }
}

@media (max-width: 767px) {
/* smaller phone copies of the four heavy banner photos (live's own files are 0.9 to 2.3 MB PNGs; 1250 and up keep them): same crop the phone shows, cover and left or centre position as live */
body.bw-site #page-container #feature .featureimage[style*="/15-2-2000x550c.png"] { background-image: url(/wp-content/uploads/ilaunch/cache/15-2-phone.jpg) !important; }
body.bw-site #page-container #feature .featureimage[style*="/1-2000x550c.png"] { background-image: url(/wp-content/uploads/ilaunch/cache/1-phone.jpg) !important; }
body.bw-site #page-container #feature .featureimage[style*="/racv-royal-pines-executive-lounge-2-2000x550c.png"] { background-image: url(/wp-content/uploads/ilaunch/cache/racv-royal-pines-executive-lounge-2-phone.jpg) !important; }
body.bw-site #page-container #feature .featureimage[style*="/untitled-design1-2000x260pc.png"] { background-image: url(/wp-content/uploads/ilaunch/cache/untitled-design1-phone.jpg) !important; }
body.bw-site #page-container #featured-project[style*="racv-royal-pines-executive-lounge-2-800x600.png"] { background-image: url(/wp-content/uploads/ilaunch/cache/racv-royal-pines-executive-lounge-2-800x600-q72.jpg) !important; }
}

/* ---------- below 480: one card a row ---------- */
@media (max-width: 479px) {
body.bw-site #page-container .projects .entry-container { width: 100%; }
body.bw-site #page-container .projects .entry { margin-right: 0; }
body.bw-site #page-container .projects .entry, body.bw-site #page-container .projects .entry a { min-height: 210px; }
body.bw-site #page-container #header .logo img { width: 180px; }
}

/* ====================================================================================================================
   3.18 fix round 1 (15 Oct 2026): findings C1 to C8 and A2, A3 of the independent checks. Everything below sits inside a
   max-width: 1249px query, so 1250 and up is untouched.
   ==================================================================================================================== */
@media (max-width: 1249px) {
/* C1: slider dots. A dark translucent disc with a white ring (3:1 or better on a pale or a dark photo); the dot told apart by FILL, not
   colour: the active dot is a solid white centre, the others an empty ring (a text cue as well: aria-current is set by slick on the li) */
body.bw-site #page-container .slick-dots li { width: 32px; height: 32px; margin: 0; }
body.bw-site #page-container .slick-dots li button { width: 28px; height: 28px; margin: 2px; padding: 0; border: 2px solid #ffffff; border-radius: 50%; background: rgba(0, 0, 0, 0.7); }
body.bw-site #page-container .slick-dots li button:is(:hover, :focus) { background: #000000; }
body.bw-site #page-container #project-gallery .slick-dots li button::before, body.bw-site #page-container .slick-dots li button::before { content: "" !important; position: absolute; top: 50%; left: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; line-height: 0; border-radius: 50%; background: transparent; border: 0; opacity: 1 !important; -webkit-text-fill-color: transparent; }
body.bw-site #page-container #project-gallery .slick-dots li.slick-active button::before, body.bw-site #page-container .slick-dots li.slick-active button::before { background: #ffffff; }
body.bw-site #page-container #project-gallery .slick-dots { height: 32px; }

/* C6: the tile grid reaches the text column's right edge (the 12px tile margin used to sit outside the column), and every tile in a row has the
   same photo height: a fixed height for the red name box, the photo above it takes the rest
   (the box height is the tallest name box measured on /commercial and /residential in the band: 132px from 900, 168px below 900 where the tiles are narrowest) */
body.bw-site #page-container .projects { margin-right: -12px; }


/* C7: search placeholder was #757575 on #f2f2f2 (4.1:1); #666 is 5.2:1 */
body.bw-site #page-container :is(.search, .panel) input.clicknclear::placeholder { color: #666666; opacity: 1; }

/* C8: an empty pager box (live draws it as an empty white strip above View Archive) and the white below a footer that ends above the window's bottom */
body.bw-site #page-container :is(#content, #content-cols2) .paging-container:has(> .clearleft:only-child) { display: none; }
html, body.bw-site { background-color: #111111; }

/* C5 (the doubled :not raises the specificity above the inline-block rule earlier in this file): wrapped list items keep the bullet beside the first line: the link is inline, the vertical padding still gives a 24px tall target */
body.bw-site #page-container #content li > a:not(.button):not(.button) { display: inline; padding: 3px 0; line-height: 20px; }

/* C5 follow-up (round 2): the filter tab links keep their earlier inline-block box (30px tall), the inline rule above shrank them to 24px */
body.bw-site #page-container #content .filter-tabs li > a:not(.button):not(.button) { display: inline-block; padding: 3px 0; line-height: 20px; }

/* A2: reserve the gallery's height before slick starts, so the details below do not jump when it does (the 5 slides used to stack first) */
body.bw-site #page-container #project-gallery:not(.slick-initialized) { height: 785px; overflow: hidden; }
}

@media (max-width: 1169px) {
body.bw-site #page-container #project-gallery:not(.slick-initialized) { height: clamp(300px, 60vw, 785px); }
}

@media (max-width: 899px) {
body.bw-site #page-container #project-gallery:not(.slick-initialized) { margin-bottom: 8px; }
/* C2: the stacked right column (live's stray text lines, kept) clears the heading below it */
body.bw-site #page-container #content-cols2 > .right { margin-bottom: 28px; }
}

/* C2: 900 to 1023: live's 545px right column leaves the heading a 200 to 320px column ("CONSTRUCTIONS" ran into the right column's text);
   a proportional right column gives the heading room */
@media (min-width: 900px) and (max-width: 1023px) {
body.bw-site #page-container #content-cols2 .right { width: 46%; }
body.bw-site #page-container #content-cols2 .right img { width: 100%; }
body.bw-site #page-container #content-cols2 .left { margin-right: calc(46% + 30px); }
}

@media (min-width: 768px) and (max-width: 1249px) {
/* C6 (tiles; the phone keeps its own cards) */
body.bw-site #page-container .projects { --bw-box: 132px; --bw-tile-h: 300px; }
body.bw-site #page-container .projects .entry, body.bw-site #page-container .projects .entry a { height: var(--bw-tile-h); }
body.bw-site #page-container .projects .entry .text, body.bw-site #page-container .projects .entry:is(:hover, :focus-within) .text { display: flex; flex-direction: column; justify-content: center; min-height: var(--bw-box) !important; box-sizing: border-box; }
/* C3: the More About Us button sits wholly inside the red headline box (live straddles the edge at 1250 and up) */
body.bw-site:where(.bw-home) #page-container .featureoverlay { padding-bottom: 72px; }
body.bw-site:where(.bw-home) #page-container .featureoverlay .button.more { bottom: 16px; }
}

@media (max-width: 767px) {
/* A2 on phones: the slide is 70vw (240 to 420px) */
body.bw-site #page-container #project-gallery:not(.slick-initialized) { height: clamp(240px, 70vw, 420px); }
/* C4: single line buttons centre their label in the 40 to 44px box; a button after a list gets air above it */
body.bw-site #page-container #content a.button:not(.more) { display: inline-flex; align-items: center; justify-content: center; padding-top: 0; padding-bottom: 0; }
body.bw-site #page-container #content p:has(> a.button:only-child) { margin-top: 16px; }
}

@media (max-width: 479px) {
body.bw-site #page-container .projects { margin-right: 0; }
}

/* C6: the narrowest tiles (768 to 899) wrap to the most lines */
@media (min-width: 768px) and (max-width: 899px) {
body.bw-site #page-container .projects { --bw-box: 168px; --bw-tile-h: 340px; }
}

/* B1 (round 3): keyboard focus (and a tap) inside a menu item look the same as hover: parent red, drop-down items dark on the white panel, the focused item white on red. */
body.bw-site #page-container #menu a:hover, body.bw-site #page-container #menu li:focus-within a:link, body.bw-site #page-container #menu li:focus-within a:active, body.bw-site #page-container #menu li:focus-within a:visited, body.bw-site #page-container #menu li:focus-within a:hover, body.bw-site #page-container #menu li.active a, body.bw-site #page-container #menu li.active a:link, body.bw-site #page-container #menu li.active a:active, body.bw-site #page-container #menu li.active a:visited { color: #ffffff;
    background: #b51b00; }
body.bw-site #page-container #menu a:hover, body.bw-site #page-container #menu li.ils-open a:link, body.bw-site #page-container #menu li.ils-open a:active, body.bw-site #page-container #menu li.ils-open a:visited, body.bw-site #page-container #menu li.ils-open a:hover, body.bw-site #page-container #menu li.active a, body.bw-site #page-container #menu li.active a:link, body.bw-site #page-container #menu li.active a:active, body.bw-site #page-container #menu li.active a:visited { color: #ffffff;
    background: #b51b00; }
body.bw-site #page-container #menu li:focus-within a.parent { background: right no-repeat url(/wp-content/uploads/ilaunch/skin/icon-arrow-up.png); }
body.bw-site #page-container #menu li.ils-open a.parent { background: right no-repeat url(/wp-content/uploads/ilaunch/skin/icon-arrow-up.png); }
body.bw-site #page-container #menu li:focus-within ul a:link, body.bw-site #page-container #menu li:focus-within ul a:active, body.bw-site #page-container #menu li:focus-within ul a:visited { color: #000;
	background: none; }
body.bw-site #page-container #menu li.ils-open ul a:link, body.bw-site #page-container #menu li.ils-open ul a:active, body.bw-site #page-container #menu li.ils-open ul a:visited { color: #000;
	background: none; }
body.bw-site #page-container #menu li ul a:focus, body.bw-site #page-container #menu li:focus-within ul a:focus { color: #ffffff;
	background: #b51b00; }
body.bw-site #page-container #menu li ul a:focus, body.bw-site #page-container #menu li.ils-open ul a:focus { color: #ffffff;
	background: #b51b00; }

/* B2 (round 3): the results block now sits inside #content right after the form; below 1250 give the "Search Results for" line air under the search field (live's 1440 spacing is unchanged) */
@media (max-width: 1249px) {
body.bw-site #page-container #content .search + p { margin-top: 20px; }
}
