/* Shared brand button treatments */
*,
*::before,
*::after {
    box-sizing: border-box;
}

.button {
    min-height: 2.55rem;
    padding-block: 0.45rem;
}

.preview-button {
    min-height: 2.55rem;
    padding-block: 0.45rem;
}

.button_secondary,
.cms_public_hero .button_secondary,
.cms_section .button_secondary {
    background: var(--aob-dark-cherry) !important;
    border: 1px solid var(--aob-champagne-gold) !important;
    color: var(--aob-soft-white) !important;
}

.button_primary,
.button_outline,
.home_about_button,
.home_contact_message_button,
.home_follow_story_card_button,
.home_services_button {
    background: transparent !important;
    border-color: var(--aob-champagne-gold) !important;
    color: var(--aob-champagne-gold) !important;
}

.button_primary:hover,
.button_primary:focus-visible,
.button_secondary:hover,
.button_secondary:focus-visible,
.button_outline:hover,
.button_outline:focus-visible,
.home_about_button:hover,
.home_about_button:focus-visible,
.home_contact_message_button:hover,
.home_contact_message_button:focus-visible,
.home_follow_story_card_button:hover,
.home_follow_story_card_button:focus-visible,
.home_services_button:hover,
.home_services_button:focus-visible,
.cms_section_actions .button:hover,
.cms_section_actions .button:focus-visible,
.cms_public_hero_actions .button:hover,
.cms_public_hero_actions .button:focus-visible,
.studio_collage_quote a:hover,
.studio_collage_quote a:focus-visible,
.site_navigation .nav_cta:hover,
.site_navigation .nav_cta:focus-visible {
    background: var(--aob-champagne-gold) !important;
    border-color:var(--aob-champagne-gold) !important;
    color: var(--aob-black) !important;
}

.site_navigation .nav_cta {
    min-height: 2.6rem;
    padding-block: 0.4rem;
    background: var(--aob-dark-cherry) !important;
    border: 1px solid var(--aob-champagne-gold) !important;
    color: var(--aob-soft-white) !important;
}

@media (min-width: 68rem) {
    .site_navigation .nav_cta {
        min-height: 0;
    }
}

.cms_type_feature_images.cms_layout_text-over-image .cms_section_inner {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-height: clamp(520px, 62vw, 760px);
    margin-left: 0;
    padding-right: max(5vw, calc((100% - 76rem) / 2));
    padding-left: max(5vw, calc((100% - 76rem) / 2));
}

.studio_collage {
    box-sizing: border-box;
    width: 100%;
    max-width: 78rem;
    margin-right: auto;
    margin-left: auto;
}

/* Image-overlay card buttons stay distinct until hover. */
.cms_item.has_image_overlay .cms_item_content > .button {
    background: rgba(0, 0, 0, 0.5) !important;
    border: 1px solid var(--aob-soft-white) !important;
    color: var(--aob-soft-white) !important;
}

.cms_item.has_image_overlay .cms_item_content > .button:hover,
.cms_item.has_image_overlay .cms_item_content > .button:focus-visible {
    background: var(--aob-dark-cherry) !important;
    border-color: var(--aob-champagne-gold) !important;
    color: var(--aob-soft-white) !important;
}

/* Keep all remaining shared button hover rules on the same brand palette. */
body a.button:hover,
body a.button:focus-visible,
body button.button:hover,
body button.button:focus-visible {
    background: var(--aob-champagne-gold) !important;
    border: 1px solid var(--aob-gold) !important;
    color: var(--aob-black) !important;
}

/* Transparent muted-gold buttons are champagne until hover, then muted gold. */
body a.button_primary:hover,
body a.button_primary:focus-visible,
body button.button_primary:hover,
body button.button_primary:focus-visible,
body a.button_outline:hover,
body a.button_outline:focus-visible,
body button.button_outline:hover,
body button.button_outline:focus-visible,
body a.home_about_button:hover,
body a.home_about_button:focus-visible,
body button.home_about_button:hover,
body button.home_about_button:focus-visible,
body a.home_contact_message_button:hover,
body a.home_contact_message_button:focus-visible,
body button.home_contact_message_button:hover,
body button.home_contact_message_button:focus-visible,
body a.home_follow_story_card_button:hover,
body a.home_follow_story_card_button:focus-visible,
body button.home_follow_story_card_button:hover,
body button.home_follow_story_card_button:focus-visible,
body a.home_services_button:hover,
body a.home_services_button:focus-visible,
body button.home_services_button:hover,
body button.home_services_button:focus-visible {
    background: var(--aob-gold) !important;
    border-color: var(--aob-champagne-gold) !important;
    color: var(--aob-black) !important;
}

/* Hearts used as list bullets follow the colour of the body copy. */
.cms_editorial_row .cms_section_body li::before,
.studio_collage_copy li::before,
.home_intro_list li::before,
.home_safe_place_feature_heart {
    color: inherit !important;
}

.cms_editorial_row .cms_section_body li::before,
.studio_collage_copy li::before,
.home_intro_list li::before {
    content: "\2665";
}

/* Footer links need clear contrast against the dark footer. */
.footer_links a {
    color: var(--aob-soft-white) !important;
}

/* Keep the live document within the viewport when a section or image overshoots. */
html,
body,
#main_content {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

html,
body {
    margin: 0;
    padding: 0;
}

/* Fit the full desktop menu between the logo and viewport edge. */
@media (min-width: 68rem) and (max-width: 99.99rem) {
    .site_header_inner {
        padding-right: clamp(1rem, 2.8vw, 2.5rem);
        padding-left: clamp(1rem, 2.8vw, 2.5rem);
        gap: clamp(0.75rem, 1.4vw, 1.25rem);
    }

    .site_logo {
        width: clamp(10rem, 15vw, 14rem);
    }

    .site_navigation {
        min-width: 0;
        flex: 1 1 auto;
    }

    .site_navigation ul {
        gap: clamp(0.4rem, 0.8vw, 0.75rem);
    }

    .site_navigation a {
        font-size: clamp(0.5rem, 0.62vw, 0.6rem);
        letter-spacing: 0.06em;
    }

    .site_navigation .nav_cta {
        padding-right: 0.55rem;
        padding-left: 0.55rem;
    }
}

/* The divider lines inherit the same selected colour as their heart. */
.section_divider {
    color: inherit;
}

.section_divider_line {
    background: currentColor !important;
    opacity: 0.72;
}

.home_contact_header .section_divider_line,
.home_follow_story_hero_copy .section_divider_line,
.home_follow_story_card_header .section_divider_line,
.home_safe_place_header .section_divider_line {
    background: var(--aob-gold-deep) !important;
}

.home_client_reviews_divider .section_divider_line {
    background: var(--aob-ivory) !important;
}

.home_about_header_divider span:not(.home_about_header_heart),
.home_about_cta_divider span:not(.home_about_cta_heart),
.home_intro_cta_divider span:not(.home_intro_cta_heart) {
    background: var(--aob-gold-deep) !important;
}

.home_as_seen_in_divider span:not(.home_as_seen_in_heart) {
    background: var(--aob-gold) !important;
}

.home_services_button {
    min-height: 2.55rem;
    padding-block: 0.45rem;
}

@media (max-width: 67.99rem) {
    .site_navigation .nav_cta {
        min-height: 2.6rem;
        padding-block: 0.4rem;
    }
}
