/* Shared public-page edges. Loaded after the homepage bundle and page styles.
 * Panel padding and readable text measures remain component responsibilities.
 */
:root {
    --jd-content-max: 1400px;
    --jd-page-gutter: 24px;
    --jd-content-width: min(calc(100% - var(--jd-page-gutter) * 2), var(--jd-content-max));
}

.jd-site-header .jd-site-header__inner {
    width: var(--jd-content-width);
}

body .jd-container,
body .jd-project-page .jd-project-shell,
body .jd-landscape-page .jd-landscape-shell,
body.jd-home .jd-landscape-shell,
body.jd-home .jd-content-page--about .jd-content-reviews > .jd-landscape-shell,
body.jd-home .jd-content-page--about .jd-content-enquiry > .jd-landscape-shell,
#reviews .jd-landscape-shell,
body .jd-site-footer__container {
    box-sizing: border-box;
    width: var(--jd-content-width);
    max-width: var(--jd-content-max);
    margin-inline: auto;
}

body .jd-container,
body .jd-site-footer__container {
    padding-inline: 0;
}

/* Keep explicitly narrow reading blocks inside the shared page boundary. */
body .jd-container--narrow {
    max-width: 900px;
}

/* Legacy public article and project templates still use Bootstrap containers.
 * Retain their column gutters; align the visible column edges with the header.
 */
body > #content-wrapper .container {
    width: var(--jd-content-width);
    max-width: var(--jd-content-max);
    padding-inline: 0;
}

body > #content-wrapper .banner .container > .row,
body > #content-wrapper .container > .row:has(> .breadcrumb) {
    margin-inline: 0;
}

@media (max-width: 1199px) {
    :root {
        --jd-page-gutter: 18px;
    }

    .jd-site-header .jd-site-header__inner {
        width: 100%;
        padding-inline: var(--jd-page-gutter);
    }
}

@media (max-width: 600px) {
    :root {
        --jd-page-gutter: 12px;
    }

    /* Legacy Bootstrap rows use 15px gutters; keep them within the 12px edge. */
    body > #content-wrapper .container > .row {
        margin-inline: -12px;
    }

    body > #content-wrapper .container > .row > [class*="col-"] {
        padding-inline: 12px;
    }

    body > #content-wrapper .banner .container > .row,
    body > #content-wrapper .container > .row:has(> .breadcrumb) {
        margin-inline: 0;
    }
}

/* Compact public-page rhythm. Navigation gutters and control sizes stay shared. */
:root {
    --jd-section-space: 56px;
    --jd-panel-space: 40px;
    --jd-card-space: 24px;
    --jd-layout-gap: 32px;
    --jd-heading-gap: 28px;
}

body .jd-page--home.jd-content-page > :is(.jd-section, .jd-content-section, .jd-content-enquiry),
body #content-wrapper.jd-landscape-page > :is(
    .jd-content-section, .jd-content-enquiry, .jd-content-stats-band,
    .jd-landscape-intro, .jd-landscape-section, .jd-project-section,
    .jd-subservice-intro, .jd-subservice-highlights, .jd-subservice-body,
    .jd-subservice-planning, .jd-subservice-assurance, .jd-subservice-faq,
    .jd-subservice-related, .jd-article-enquiry, .jd-contact-section, .jd-service-area
),
body > #content-wrapper > .cellpadding {
    padding-block: var(--jd-section-space);
}

/* Compact sections that were already closer together keep a smaller rhythm. */
body .jd-page--home.jd-content-page > .jd-featured-on,
body .jd-page--home.jd-content-page > .jd-trust-marquee {
    padding-block: var(--jd-layout-gap);
}

body #content-wrapper.jd-content-page--faqs > .jd-faq-directory {
    padding-block: var(--jd-panel-space);
}

body #content-wrapper.jd-aircon-general-clean-page .jd-subservice-pricing + .jd-subservice-body {
    padding-top: 24px;
}

body #content-wrapper.jd-landscape-page > .jd-article-content {
    padding-bottom: var(--jd-section-space);
}

body #content-wrapper.jd-landscape-page > .jd-article-hero {
    padding-top: 20px;
    padding-bottom: var(--jd-section-space);
}

body #content-wrapper.jd-project-page > .jd-project-hero {
    padding-bottom: 24px;
}

body > #content-wrapper > .services_01 {
    padding-block: 40px var(--jd-section-space);
}

body > #content-wrapper > .banner {
    padding-block: var(--jd-panel-space);
}

body > #content-wrapper .breadcrumb {
    padding-block: 12px;
}

/* Large banners and panels: reduce padding, not type size or button targets. */
body #content-wrapper.jd-landscape-page :is(
    .jd-content-hero__panel, .jd-page-hero__panel, .jd-project-hero__panel,
    .jd-article-hero__card, .jd-content-story__panel
) {
    min-height: 0;
    padding: var(--jd-panel-space);
}

body #content-wrapper.jd-content-page--articles .jd-content-hero__panel {
    padding-block: 24px;
}

body #content-wrapper.jd-landscape-page .jd-landscape-hero__form-wrap {
    padding: var(--jd-card-space);
}

body #content-wrapper.jd-landscape-page .jd-landscape-hero__copy {
    inset-inline: var(--jd-card-space);
    bottom: var(--jd-card-space);
}

body #content-wrapper.jd-landscape-page :is(
    .jd-landscape-form-card, .jd-content-form-card, .jd-subservice-scope,
    .jd-subservice-checklist, .jd-project-contact-card
),
body.jd-home .jd-content-page--about .jd-content-enquiry .jd-content-form-card {
    padding: var(--jd-card-space);
}

/* Keep room for the homepage statistics that overlap the hero. */
body.jd-home .jd-page--home > .jd-hero {
    padding-bottom: 28px;
}

@media (min-width: 641px) {
    body.jd-home .jd-hero__panel {
        min-height: 0;
        padding-top: 32px;
        padding-inline: var(--jd-panel-space);
    }
}

@media (min-width: 1025px) {
    body.jd-home .jd-hero__panel {
        padding-bottom: 116px;
    }
}

/* Bring headings and paired columns closer without squeezing their content. */
body #content-wrapper.jd-landscape-page :is(
    .jd-content-enquiry__grid, .jd-project-enquiry__grid, .jd-article-enquiry__grid,
    .jd-article-hero__grid, .jd-subservice-planning__grid,
    .jd-subservice-assurance__shell, .jd-content-story__panel,
    .jd-content-section-heading
),
body.jd-home .jd-content-page--about .jd-content-enquiry__grid,
body.jd-home #process .jd-process-layout {
    gap: var(--jd-layout-gap);
}

body #content-wrapper.jd-landscape-page :is(
    .jd-landscape-section-heading, .jd-subservice-heading
),
body.jd-home .jd-page--home .jd-section__intro {
    margin-bottom: var(--jd-heading-gap);
}

body #content-wrapper.jd-landscape-page .jd-subservice-scope {
    margin-top: var(--jd-layout-gap);
}

body.jd-home #process .jd-process-layout {
    margin-top: var(--jd-layout-gap);
}

body.jd-home #process .jd-process-steps .jd-step {
    padding: var(--jd-card-space);
}

body .jd-site-footer {
    padding-top: 32px;
    padding-bottom: 40px;
}

body .jd-site-footer__grid {
    gap: var(--jd-layout-gap);
}

@media (max-width: 1024px) {
    :root {
        --jd-section-space: 40px;
        --jd-panel-space: 32px;
        --jd-card-space: 20px;
        --jd-layout-gap: 24px;
        --jd-heading-gap: 24px;
    }
}

@media (max-width: 640px) {
    :root {
        --jd-section-space: 32px;
        --jd-panel-space: 24px;
        --jd-card-space: 16px;
        --jd-layout-gap: 20px;
        --jd-heading-gap: 20px;
    }

    body #content-wrapper.jd-project-page > .jd-project-hero {
        padding-bottom: 16px;
    }

    body > #content-wrapper > .services_01 {
        padding-top: 10px;
    }

    body .jd-site-footer {
        padding-top: 24px;
    }
}

/* Keep the footer above the existing fixed mobile booking controls. */
@media (max-width: 560px) {
    body .jd-site-footer {
        padding-bottom: calc(112px + env(safe-area-inset-bottom));
    }
}