/* Shared header/footer shell — loaded last on every page.
   The header/footer markup lives in partials/header.php and partials/footer.php;
   its look comes from home-new.css. This file only holds what those two need on
   top of that: sizing that used to be inline on the homepage, and the small
   adjustments inner pages need now that the header floats over their banner. */

.header-logo {
    max-height: 90px;
    object-fit: contain;
}

.header-book-btn {
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
}

.footer-logo {
    max-height: 64px;
    width: auto;
}

/* Footer: all text white (client change request). Several text-cream-XX tones were
   never defined, so those elements fell back to Bootstrap's defaults — links rendered
   the default blue (phone, email, the bottom "Contact"). Whiten every footer text tone
   and force links white. The gold icons/accents use .text-gold and are left untouched. */
footer .text-cream,
footer .text-cream-40,
footer .text-cream-55,
footer .text-cream-65,
footer .text-cream-70,
footer .text-cream-85 { color: #fff !important; }

footer .text-white p { color: #fff !important; }

footer a:not(.text-gold) { color: #fff; }
footer a:not(.text-gold):hover { color: #fff; }

/* The old header sat in the flow, so 35 pages carry a page-level <style> block that
   pushes the banner down to clear it (margin-top: 105px, 115px, 140px, 55px, …).
   The header is fixed and floats over the banner now, so those margins would leave a
   gap above it. Those blocks are inline <style> in the body, which outranks this file
   on specificity alone — hence !important. Killing them here fixes all 35 at once. */
.banner,
.banner img.img-fluid,
.banner .guides,
.banner .test-card img {
    margin-top: 0 !important;
}

/* revamp.css squeezed the banner down to 220px so the logo baked into the middle of
   the old banner image fell outside the frame. The new banner has no logo baked in,
   so the crop is no longer needed — give the banner its full height back. The page-level
   <style> blocks set competing heights, hence !important again. */
.banner img.img-fluid,
.banner .testy img,
.banner .test-card img,
.banner .guides {
    height: 420px !important;
    max-height: 420px !important;
}

.banner img.img-fluid,
.banner .testy img,
.banner .test-card img {
    object-fit: cover;
    object-position: center !important;
}

/* The heading inside the banner still has to clear the floating header. */
.banner .guides {
    padding-top: 90px;
}

@media (max-width: 991px) {
    .banner img.img-fluid,
    .banner .testy img,
    .banner .test-card img,
    .banner .guides {
        height: 300px !important;
        max-height: 300px !important;
    }
}

@media (max-width: 767px) {
    .banner img.img-fluid,
    .banner .testy img,
    .banner .test-card img,
    .banner .guides {
        height: 240px !important;
        max-height: 240px !important;
    }
}

/* The wedding/package pages have no banner, so their header renders solid and fixed
   (data-solid) directly over the page content — the title and Share button were hidden
   behind it. Push the first section clear of the header (124px tall) plus a small gap.
   The sibling selector only matches those pages; every page with a banner is untouched. */
header[data-solid] + section.property-detail {
    padding-top: 150px;
}