/* ConstructIQ Australia Ã¢â‚¬â€ Forest green / sage / white Ã¢â‚¬â€ COLOR ONLY */
:root { --primary-color:#123d32; --accent-color:#0b7958; --accent-secondary-color:#167958; --secondary-color:#fff; --bg-color:#f8f8f3; --text-color:#52655b; --divider-color:#d5e5d9; --dark-divider-color:rgba(255,255,255,.23); }
html,body { background-color:#f8f8f3 !important; color:#52655b; }
/* Existing navigation sizes and layout remain untouched. */
.main-header .header-sticky, .main-header .header-sticky.bg-section, .main-header .header-sticky.active,
.header-sticky.bg-section, header.main-header .header-sticky { background:#fff !important; background-image:none !important; border-color:#d5e5d9 !important; box-shadow:0 12px 33px rgba(18,61,50,.08); }
.main-header .main-menu ul li a, .main-header .main-menu ul li a:visited { color:#123d32 !important; }
.main-header .main-menu ul li a:hover, .main-header .main-menu ul li.current-menu-item>a { color:#0b7958 !important; }
.main-header .main-menu ul ul, .slicknav_menu { background:#123d32 !important; }
.main-header .main-menu ul ul a, .slicknav_nav a { color:#fff !important; }
.slicknav_btn { background:#0b7958 !important; }
.slicknav_icon .slicknav_icon-bar { background-color:#fff !important; }
/* Hero images / video unchanged; the colour overlay is light sage instead of charcoal. */
.hero.hero-video, .hero.hero-video.bg-section, .hero, .hero.bg-section { background-color:#edf5ef !important; }
.hero:before,.hero::before { background:linear-gradient(90deg,rgba(249,251,247,.92) 0%,rgba(239,248,241,.79) 42%,rgba(217,238,224,.31) 100%) !important; }
.hero .section-title h1,.hero .section-title h1 span,.hero .section-title h2,.hero .section-title h2 span,.hero .hero-counter-item h2,.hero .hero-counter-item p,.hero .hero-rating-box-header h3,.hero .hero-rating-box-content p,
.hero .hero-content-box,.hero .hero-counter-box { color:#123d32 !important; }
.hero .section-sub-title,.hero .hero-rating-box-header p i { color:#0b7958 !important; }
.hero .hero-counter-item::before,.hero .hero-counter-footer { border-color:#c3dbcc !important; background-color:#c3dbcc; }
.hero .hero-counter-footer { background-color:transparent; }
/* Content sections, same spacing / grids / components. */
.bg-section:not(.hero):not(.dark-section):not(.page-header), .about-us,.our-service,.our-services,.our-team,.our-testimonial,.our-blog,.who-we-are,.page-about-us,.page-service,.page-services,.page-contact-us,.page-team,.page-pricing,.page-blog,.page-faqs,
.about-section,.service-section,.services-section,.blog-section,.team-section { background-color:#f8f8f3 !important; }
.about-us,.our-service,.our-testimonial,.page-service,.page-contact-us { background-image:none; }
.section-sub-title,.section-title .section-sub-title,.section-title h1 span,.section-title h2 span,
.about-us .section-title h2 span,.our-service .section-title h2 span,.readmore-btn:hover,
.service-item-content h2 a:hover,.post-item-content h2 a:hover,.main-menu ul li a:hover { color:#0b7958 !important; }
.section-title h1,.section-title h2,.section-title h3,.section-title h4,
.about-us-item h3,.about-us-item-content h3,.service-item-content h2 a,.service-item-content h2,
.project-item-content h2 a,.post-item-content h2 a,.blog-item-content h2 a,.readmore-btn,
.faq-accordion .accordion-button,.contact-info-item h2,.contact-info-item h3 { color:#123d32 !important; }
p, .about-us-item-content p, .service-item-content p, .section-title-content p { color:#52655b; }
/* Buttons: hover/focus remain interactive. */
a.btn-default,button.btn-default,.btn-default:not(.btn-highlighted) { background:#0b7958 !important; border-color:#0b7958 !important; color:#fff !important; }
a.btn-default:hover,button.btn-default:hover,.btn-default:not(.btn-highlighted):hover { background:#075d46 !important; border-color:#075d46 !important; color:#fff !important; }
.btn-default.btn-highlighted { background:#fff !important; border-color:#c9ddd0 !important; color:#123d32 !important; }
.btn-default.btn-highlighted:hover { background:#e4f3e9 !important; border-color:#0b7958 !important; color:#0a654d !important; }
.btn-default::after { background-color:#075d46 !important; }
.btn-default::before { filter:brightness(0) invert(1); }
.btn-default.btn-highlighted::before { filter: brightness(0) saturate(100%) invert(22%) sepia(39%) saturate(650%) hue-rotate(111deg) !important; }
.readmore-btn::before,.section-btn .readmore-btn::before { filter: brightness(0) saturate(100%) invert(30%) sepia(47%) saturate(1042%) hue-rotate(112deg); }
/* Content cards, boxes, accordions and forms; no geometry changed. */
.service-item,.about-us-item,.project-item,.post-item,.testimonial-item,.team-member-item,.pricing-item,.contact-info-item,
.contact-form,.page-contact-form,.faq-accordion .accordion-item,.faq-accordion .accordion-button,
.why-choose-item,.sidebar-category-list,.sidebar-cta-box,.hero-rating-box { border-color:#d5e5d9 !important; }
.service-item,.about-us-item,.post-item,.testimonial-item,.team-member-item,.pricing-item,.contact-info-item,
.contact-form,.page-contact-form,.faq-accordion .accordion-item,.why-choose-item { background-color:#fff !important; }
.service-item:hover,.project-item:hover,.team-member-item:hover { border-color:#a8cfb8 !important; }
.service-item .icon-box,.about-us-item .icon-box,.service-item-body .icon-box,.readmore-btn span,
.contact-info-item .icon-box { background-color:#e4f3e9; color:#0b7958; }
/* Intentionally dark showcase/CTA areas: dark forest GREEN, not black/charcoal. */
.dark-section:not(.hero):not(.page-header),.our-project,.our-project.bg-section,.our-fact,.our-fact.bg-section,.cta-box,
.main-footer,footer.main-footer,.footer-main,.footer-copyright,.page-header,.page-header.bg-section {
 background-color:#0b654d !important;
 background-image:none;
}
.our-project .section-title h1,.our-project .section-title h2,.our-project .section-title h2 span,
.our-fact .section-title h2,.our-fact .section-title h2 span,.cta-box .section-title h2,.cta-box .section-title h2 span,
.page-header .section-title h1,.page-header .section-title h2,.main-footer h2,.main-footer h3,.main-footer p,
.main-footer span,.main-footer li,.main-footer a,.main-footer .footer-links a { color:#fff !important; }
.our-project p,.our-fact p,.cta-box p,.page-header p { color:#effaf2 !important; }
.our-project .section-sub-title,.our-fact .section-sub-title,.cta-box .section-sub-title,
.our-project .section-title h2 span,.our-fact .section-title h2 span { color:#ceecda !important; }
.page-header:before,.page-header::before { background:linear-gradient(90deg,rgba(7,79,59,.90),rgba(8,96,70,.56)) !important; }
.footer-links ul li a:hover,.main-footer a:hover,.main-footer .footer-social-links a:hover { color:#cdebd8 !important; }
.constructiq-map-placeholder { background:linear-gradient(135deg,#0a5642,#128365) !important; border-color:#79bd9b !important; }
.constructiq-map-placeholder h3 { color:#fff !important; }
/* Counters, stars, navigation dots, active tags */
.hero-counter-item h2,.about-counter-item h2,.about-counter-item .counter,.counter-item h2 { color:#0b7958; }
.hero .hero-counter-item h2 { color:#123d32 !important; }
.swiper-pagination-bullet-active,.swiper-pagination .swiper-pagination-bullet-active,
.pagination .page-item.active .page-link,.slick-dots li.slick-active button { background:#0b7958 !important; border-color:#0b7958 !important; }
input:not([type=checkbox]):focus,textarea:focus,select:focus,.form-control:focus,.form-select:focus {
 border-color:#0b7958 !important; box-shadow:0 0 0 .2rem rgba(11,121,88,.14) !important;
}
input[type=checkbox],input[type=radio]{accent-color:#0b7958}
::selection{background:#b9e0c9;color:#123d32}


/* =====================================================================
   2026-10-16 Ã¢â‚¬â€ FRONTEND LEGIBILITY PATCH
   Scope: colours, image overlay, and icon colour only.
   Retains page layout, text, photographs, typography and CMS bindings.
   This stylesheet is loaded LAST by Website.php with cache busting.
   ===================================================================== */

/* Preserve the hero photograph/video while keeping light-theme headings
   readable.  Avoid the prior almost-white wash across the entire image. */
.hero.hero-video::before,
.hero.hero-video:before,
.hero.bg-section::before {
  background:linear-gradient(90deg,rgba(248,250,245,.90) 0%,rgba(248,250,245,.70) 32%,rgba(248,250,245,.25) 68%,rgba(248,250,245,.08) 100%) !important;
}
.hero.hero-video .hero-bg-video::before { content:none !important; }
.hero.hero-video .hero-bg-video video { filter: none !important; }

/* Services: return the pale-sage surface to each non-hovered card; icons
   should remain visible even before the card is hovered. */
.our-service .service-item,
.page-services .service-item {
  background-color:#edf5ef !important;
  border-color:#d3e3d8 !important;
}
.our-service .service-item::before,
.page-services .service-item::before {
  background-color:#edf5ef !important;
}
.service-item .service-item-body .icon-box { background:#0b7958 !important; }
.service-item .service-item-body .icon-box::before { background:#09684d !important; }
.service-item .service-item-body .icon-box img { filter:brightness(0) invert(1) !important; }
.service-item:not(.active):not(:hover) .service-item-content h2,
.service-item:not(.active):not(:hover) .service-item-content h2 a,
.service-item:not(.active):not(:hover) .service-item-btn a { color:#123d32 !important; }
.service-item:not(.active):not(:hover) .service-item-content p { color:#52655b !important; }
/* Hover and active cards use photographs with a forest-green overlay.
   The generic title rule previously forced dark text over this image. */
.service-item.active .service-item-content h2,
.service-item.active .service-item-content h2 a,
.service-item:hover .service-item-content h2,
.service-item:hover .service-item-content h2 a,
.service-item.active .service-item-content p,
.service-item:hover .service-item-content p,
.service-item.active .service-item-btn .readmore-btn,
.service-item:hover .service-item-btn .readmore-btn { color:#fff !important; }
.service-item.active .service-item-btn,
.service-item:hover .service-item-btn { border-color:rgba(255,255,255,.5) !important; }
.service-item .service-item-image::after { background-color:#092d24 !important; opacity:.66 !important; }
.service-item .service-item-btn .readmore-btn::before { background-color:#0b7958 !important; }

/* The photo gallery was unreadable because global green text overrides
   applied to captions sitting on a dark image gradient. */
.our-project .project-item-content h2,
.our-project .project-item-content h2 a,
.our-project .project-item-content ul li,
.our-project .project-item-content ul li a,
.project-item .project-item-content h2,
.project-item .project-item-content h2 a,
.project-item .project-item-content ul li { color:#fff !important; }
.project-item .project-item-image figure::before { background:linear-gradient(180deg,rgba(6,39,30,0) 38%,rgba(6,39,30,.92) 100%) !important; }
.our-project .project-item-content ul li::before { background-color:#b5e8cf !important; }
.our-project .section-title h2,
.our-project .section-title h1 { color:#fff !important; }
.our-project .section-title h2 span,
.our-project .section-sub-title { color:#d1f2df !important; }
.our-project .section-footer-text p { color:#edf8f1 !important; }
.our-project .section-footer-text a,
.our-project .section-footer-text p a { color:#fff !important; text-decoration:underline; text-underline-offset:3px; }

/* Facts: light typography on forest green, but dark typography when a
   fact card changes to white on hover. */
.our-fact .fact-item-title,
.our-fact .fact-item-title ul li,
.our-fact .fact-item-counter-content h2,
.our-fact .fact-item-counter-content h2 span,
.our-fact .fact-item-counter-content p { color:#fff !important; }
.our-fact .fact-item-title { border-color:rgba(255,255,255,.42) !important; }
.our-fact .fact-item { border-color:rgba(255,255,255,.55) !important; }
.our-fact .fact-item:hover .fact-item-title,
.our-fact .fact-item:hover .fact-item-title ul li,
.our-fact .fact-item:hover .fact-item-counter-content h2,
.our-fact .fact-item:hover .fact-item-counter-content h2 span,
.our-fact .fact-item:hover .fact-item-counter-content p { color:#123d32 !important; }
.our-fact .fact-item:hover .fact-item-title { border-color:#bdd9c7 !important; }
.our-fact .our-fact-image-content p { color:#123d32 !important; }

/* The previous global .dark-section override removed the original
   video-cover photograph.  Restore that local project asset rather than
   showing a featureless green rectangle. */
.intro-video,
.intro-video.bg-section,
.intro-video.dark-section,
.intro-video.bg-section.dark-section {
  background-color:#0b4d3c !important;
  background-image:url('../images/intro-video-bg-image.jpg') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:cover !important;
}
.intro-video::before,
.intro-video.bg-section::before {
  background:linear-gradient(90deg,rgba(5,45,36,.86) 0%,rgba(5,45,36,.63) 52%,rgba(5,45,36,.34) 100%) !important;
  opacity:1 !important;
}
.intro-video .section-title h2,
.intro-video .section-title h2 span,
.intro-video .section-title h1,
.intro-video .section-title h1 span { color:#fff !important; }
.intro-video .section-sub-title { color:#d6f3e1 !important; }
.intro-video .watch-video-circle a:focus-visible { outline:3px solid #fff; outline-offset:6px; }
/* The circle image has a saturated yellow play symbol; tint only that
   image to the palette without affecting the other site imagery. */
.intro-video .watch-video-circle img { filter:none !important; }

/* The contact call-to-action and newsletter should be readable on their
   dark green panels, including small labels and links. */
.cta-box .section-title h2,
.cta-box .section-title h2 span,
.cta-box .section-title h3,
.cta-box .cta-box-content h2,
.cta-box .cta-box-content h3 { color:#fff !important; }
.cta-box .section-sub-title { color:#d1f2df !important; }
.cta-box .cta-box-content p,
.cta-box .cta-item-content p { color:#e8f7ef !important; }
.cta-box .cta-item-content h3,
.cta-box .cta-item-content h3 a,
.cta-box .cta-item-content a { color:#fff !important; }

/* Footer social links were almost invisible: green-on-green. */
.main-footer .footer-social-links h3,
.main-footer .footer-social-links ul li a,
.main-footer .footer-social-links ul li a i { color:#fff !important; }
.main-footer .footer-social-links ul li a {
  border-color:rgba(255,255,255,.66) !important;
  background-color:rgba(255,255,255,.12) !important;
}
.main-footer .footer-social-links ul li a:hover,
.main-footer .footer-social-links ul li a:focus-visible {
  border-color:#d5f3e2 !important;
  background-color:#e5f5ec !important;
}
.main-footer .footer-social-links ul li a:hover i,
.main-footer .footer-social-links ul li a:focus-visible i { color:#0b5541 !important; }
.main-footer .footer-content p,
.main-footer .about-footer-content p,
.main-footer .footer-links ul li a,
.main-footer .footer-contact-item-content p,
.main-footer .footer-contact-item-content a,
.main-footer .footer-copyright p { color:#f2fcf6 !important; }
.main-footer .footer-newsletter-form input,
.main-footer input[type=email] { color:#fff !important; }
.main-footer .footer-newsletter-form input::placeholder,
.main-footer input[type=email]::placeholder { color:#def1e5 !important; opacity:1; }

/* Other photo-backed dark panels use the same high-contrast captions. */
.dark-section:not(.hero) .section-sub-title { color:#d4f2e0 !important; }
.page-header .section-title h1,
.page-header .section-title h2 { color:#fff !important; }
@media (prefers-reduced-motion:reduce) {
  .intro-video .watch-video-circle img { animation:none !important; }
}

/* Facts section: ONLY change its background to white and heading contrast. */
.our-fact, .our-fact.bg-section { background-color:#ffffff !important; background-image:none !important; }
.our-fact .section-title h1, .our-fact .section-title h2 { color:#123d32 !important; }
.our-fact .section-title h1 span, .our-fact .section-title h2 span,
.our-fact .section-sub-title { color:#0b7958 !important; }

/* FACTS SECTION ONLY: maintain readable statistics on the white background.
   No other page sections are affected. */
.our-fact .fact-item-title,
.our-fact .fact-item-title ul li,
.our-fact .fact-item-counter-content h2,
.our-fact .fact-item-counter-content h2 span,
.our-fact .fact-item-counter-content p {
    color: #123d32 !important;
}
.our-fact .fact-item,
.our-fact .fact-item-title {
    border-color: #d5e5d9 !important;
}


/* =====================================================================
   Facts cards: video-reference hover effect only (2026-10-16)
   Individual statistic cards gently fill white on hover.
   No dimensions, images, typography, layouts or other sections changed.
   ===================================================================== */
.our-fact .fact-item {
    background-color: #f0f5f1 !important;
    border-color: #d5e5d9 !important;
    transition: background-color .4s ease-in-out,
                border-color .4s ease-in-out,
                box-shadow .4s ease-in-out;
}
.our-fact .fact-item::before {
    background-color: #ffffff !important;
    pointer-events: none;
    transition: height .4s ease-in-out;
}
.our-fact .fact-item:hover {
    border-color: #bfd7c8 !important;
    box-shadow: 0 13px 28px rgba(18, 61, 50, .09);
}
.our-fact .fact-item:hover::before {
    height: 100%;
}
.our-fact .fact-item-title,
.our-fact .fact-item-title ul li,
.our-fact .fact-item-counter-content h2,
.our-fact .fact-item-counter-content h2 span,
.our-fact .fact-item-counter-content p,
.our-fact .fact-item:hover .fact-item-title,
.our-fact .fact-item:hover .fact-item-title ul li,
.our-fact .fact-item:hover .fact-item-counter-content h2,
.our-fact .fact-item:hover .fact-item-counter-content h2 span,
.our-fact .fact-item:hover .fact-item-counter-content p {
    color: #123d32 !important;
}
@media (prefers-reduced-motion: reduce) {
    .our-fact .fact-item,
    .our-fact .fact-item::before { transition: none !important; }
}

/* ========================================================================
   QUICK SUPPORT / CONTACT SECTION ONLY â€” reference layout, approved green palette
   No other section, layout, backend or form functionality is changed.
   ======================================================================== */
.cta-box.bg-section.dark-section,
.cta-box.dark-section,
.cta-box.bg-section,
.cta-box {
    background-color: #123d32 !important;
    background-image: url('../images/cta-box-bg-image.jpg') !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
/* Dark photographic overlay to keep white contact details readable. */
.cta-box::before,
.cta-box:before {
    background: linear-gradient(90deg,
        rgba(6,40,31,.79) 0%,
        rgba(8,48,37,.66) 44%,
        rgba(15,76,57,.33) 100%) !important;
    opacity: 1 !important;
}
/* Left title and contact details */
.cta-box .cta-box-content .section-title h2,
.cta-box .cta-box-content .section-title h2 span {
    color: #ffffff !important;
}
.cta-box .cta-box-content .section-title h2 span {
    color: #bce4cc !important;
}
.cta-box .cta-box-content .section-sub-title {
    background-color: rgba(255,255,255,.19) !important;
    color: #ffffff !important;
    border-color: rgba(255,255,255,.25) !important;
}
.cta-box .cta-box-item .icon-box {
    background: #bce4cc !important;
    color: #ffffff !important;
}
.cta-box .cta-box-item .icon-box::before {
    background: #ffffff !important;
}
.cta-box .cta-box-item .icon-box img {
    filter: brightness(0) saturate(100%) !important;
}
.cta-box .cta-box-item-content p,
.cta-box .cta-box-item-content h3,
.cta-box .cta-box-item-content h3 a {
    color: #ffffff !important;
}
.cta-box .cta-box-item-content h3 a:hover {
    color: #ccebd8 !important;
}
.cta-box .cta-box-item:last-child {
    border-color: rgba(255,255,255,.28) !important;
}
/* Right-hand white form card, dark forest-green heading with green italic emphasis. */
.cta-box .cta-form-box {
    background-color: #ffffff !important;
    border-color: rgba(255,255,255,.8) !important;
}
.cta-box .cta-form-box .section-title h2,
.cta-box .cta-form-box .section-title h1 {
    color: #123d32 !important;
}
.cta-box .cta-form-box .section-title h2 span,
.cta-box .cta-form-box .section-title h1 span {
    color: #0b7958 !important;
}
.cta-box .cta-form-box .section-title .section-sub-title {
    background: #e8f2e9 !important;
    color: #123d32 !important;
    border-color: transparent !important;
}
.cta-box .cta-contact-form .form-control {
    background-color: #ffffff !important;
    border-color: #d5e5d9 !important;
    color: #123d32 !important;
    box-shadow: none !important;
}
.cta-box .cta-contact-form .form-control::placeholder {
    color: #61756a !important;
    opacity: 1;
}
.cta-box .cta-contact-form .form-control:focus {
    border-color: #0b7958 !important;
    box-shadow: 0 0 0 .2rem rgba(11,121,88,.13) !important;
}
.cta-box .cta-contact-form-btn .btn-default,
.cta-box .cta-contact-form-btn button.btn-default {
    background-color: #0b7958 !important;
    border-color: #0b7958 !important;
    color: #ffffff !important;
}
.cta-box .cta-contact-form-btn .btn-default:hover,
.cta-box .cta-contact-form-btn button.btn-default:hover {
    background-color: #075d46 !important;
    border-color: #075d46 !important;
    color: #ffffff !important;
}
.cta-box .cta-contact-form-btn .btn-default::after {
    background: #075d46 !important;
}
.cta-box .cta-contact-form-btn .btn-default::before {
    filter: brightness(0) invert(1) !important;
}

/* =======================================================================
   BLOG / LATEST INSIGHTS â€” THREE CARDS BORDER CORRECTION ONLY
   Applies only inside .our-blog and leaves the grid and other pages alone.
   ======================================================================= */

/* No enclosing box around the entire group of three cards. */
.our-blog > .container > .row:not(.section-row),
.our-blog > .container > .row:not(.section-row) > .col-xl-4 {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Each article has its own clean border (forest/sage/white palette). */
.our-blog .post-item {
    background: #ffffff !important;
    border: 1px solid #d5e5d9 !important;
    border-radius: 18px !important;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(18, 61, 50, 0.05) !important;
}

/* Align the existing image and article text neatly inside its own border. */
.our-blog .post-item .post-featured-image {
    margin-bottom: 0;
}
.our-blog .post-item .post-featured-image a,
.our-blog .post-item .post-featured-image figure {
    border-radius: 17px 17px 0 0;
}
.our-blog .post-item .post-item-body {
    padding: 16px 18px 18px;
}

/* Keep the card border green rather than dark grey when hovered. */
.our-blog .post-item:hover {
    border-color: #a6cdb6 !important;
    box-shadow: 0 8px 25px rgba(18, 61, 50, 0.09) !important;
}