/* Public page canvas only. Layout, navigation and semantic section colors stay
   in their existing stylesheets. Keep all pastel color tuning here. */
:root {
    --page-sky: #B9E4FF;
    --page-lavender: #DFD2FF;
    --page-pink: #FFDEED;
    --page-base-sky: #EDF8FF;
    --page-base-lavender: #F5F1FF;
    --page-base-pink: #FFF1F7;
    --page-paper: rgba(255, 255, 255, 0.96);
    --page-paper-solid: #fff;
    --page-wave-line: rgba(255, 255, 255, 0.55);
    --page-wave-wash: rgba(255, 255, 255, 0.24);
    --page-canvas:
        /* Broad translucent arcs are background layers, never overlays. */
        radial-gradient(ellipse 95% 620px at 48% -80px,
            transparent 99.5%, var(--page-wave-line) 99.7%,
            var(--page-wave-wash) 100%, transparent 125%),
        radial-gradient(ellipse 90% 540px at 32% 1080px,
            transparent 99.5%, var(--page-wave-wash) 99.8%,
            transparent 120%),
        radial-gradient(ellipse 70% 480px at 4% 1170px,
            transparent 99.5%, var(--page-wave-line) 99.8%,
            var(--page-wave-wash) 100%, transparent 123%),
        radial-gradient(ellipse 90% 750px at left 100px,
            var(--page-sky) 0%, transparent 100%),
        radial-gradient(ellipse 80% 800px at left 700px,
            var(--page-lavender) 0%, transparent 100%),
        radial-gradient(ellipse 85% 750px at right 500px,
            var(--page-pink) 0%, transparent 100%),
        linear-gradient(115deg, var(--page-base-sky) 0%, var(--page-base-lavender) 48%, var(--page-base-pink) 100%);
}

/* The first-screen artwork fades into a continuous document-height base.
   No image files, repeated tiles, fixed attachment or pseudo-elements. */
:root body {
    background-color: var(--page-base-lavender);
    background-image: var(--page-canvas);
    background-size: 100% 1900px, 100% 1900px, 100% 1900px,
        100% 1500px, 100% 1500px, 100% 1500px, 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

/* Inspected page wrappers formerly using decorative bitmap/SVG backgrounds.
   Transparent wrappers reveal the same canvas without restarting the gradient. */
body .bg_top,
body .bg_about,
body #about.bg_about,
body .bg_access,
body .bg_request,
body .bg_guidelines,
body .bg_guidelines.guidelines-page,
body .bg_recruitment,
body .guide_bg,
body .course_bg,
body .jobs_bg,
body.nsb-site #main {
    background: transparent;
}

/* Neutral full-width panels in the standalone home page. */
body > main > .hero,
body > main > .courses,
body > main > .sessions,
body > main > .study-section {
    background: transparent;
}

/* Existing translucent reading panels only; retain their dimensions. */
body #about.wrapper,
body #recruitment.wrapper,
body #news.wrapper {
    background-color: var(--page-paper);
}

/* Home-page white reading areas, matching the public site's section grouping.
   Extend the white paint to both viewport edges without changing content width.
   These home-page containers have no existing ::before decoration. */
body > #main > .section.wrap[aria-labelledby="visit-title"],
body > #main > #admissions.section.wrap,
body > #main > #news.section.wrap,
body > #main > #support.section.wrap {
    background-color: var(--page-paper-solid);
    position: relative;
    isolation: isolate;
}

body > #main > .section.wrap[aria-labelledby="visit-title"]::before,
body > #main > #admissions.section.wrap::before,
body > #main > #news.section.wrap::before,
body > #main > #support.section.wrap::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: var(--page-paper-solid);
    box-shadow: 0 0 0 100vmax var(--page-paper-solid);
    /* Clip the decorative paint only, leaving text and focus rings untouched. */
    clip-path: inset(0 -100vmax);
}

/* A separate white band keeps the spacing white without extending the frame.
   Match the public home page's 28px / 20px gap and retain its original borders. */
body > #main > .quick-band {
    padding-top: 28px;
    background: var(--page-paper-solid);
}

body > #main > .quick-band > .quick {
    margin-top: 0;
}

@media (max-width: 760px) {
    body > #main > .quick-band {
        padding-top: 20px;
    }
}

@media print {
    :root body {
        background: #fff;
    }
    body #about.wrapper,
    body #recruitment.wrapper,
    body #news.wrapper {
        background-color: #fff;
    }
}
