/* Shared foundations. Keep page-specific composition in the page templates. */
:root {
    --school-ink: #10243a;
    --school-muted: #526477;
    --school-brand: #155c91;
    --school-brand-dark: #104771;
    --school-accent: #25b5ed;
    --school-surface: #fff;
    --school-canvas: #f5f8fb;
    --school-border: #dce5ed;
    --school-focus: #087cae;
    --school-radius: 1rem;
    --school-radius-sm: .625rem;
    --school-shadow: 0 12px 36px rgb(16 36 58 / 7%);
    --school-container: 76rem;
    --school-space-1: .25rem;
    --school-space-2: .5rem;
    --school-space-3: .75rem;
    --school-space-4: 1rem;
    --school-space-6: 1.5rem;
    --school-space-8: 2rem;
    --school-space-12: 3rem;
    --school-space-16: 4rem;
    --bs-primary: var(--school-brand);
    --bs-primary-rgb: 21, 92, 145;
    --bs-body-color: var(--school-ink);
}

html { scroll-padding-top: 2rem; }
body.school-site {
    color: var(--school-ink);
    background: var(--school-surface);
    font-family: "Source Sans 3", "Segoe UI", Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    letter-spacing: 0;
    overflow-x: visible;
}
.school-site .page-wrapper {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
    flex-direction: column;
    overflow-x: visible;
}
.school-site #main-content { flex: 1; min-width: 0; }
.school-site .container {
    width: 100%;
    max-width: var(--school-container);
    padding-inline: clamp(1rem, 3vw, 2rem);
    margin-inline: auto;
}
.school-site :where(.row > *, .card, .card-body, .school-navigation, .school-brand__text) { min-width: 0; }
.school-site img { max-width: 100%; }
.school-site :where(p, li, td, th, address) { overflow-wrap: anywhere; }
.school-site a { color: var(--school-brand); text-decoration: none; text-underline-offset: .2em; }
.school-site a:hover { color: var(--school-brand-dark); }
.school-site :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--school-focus) !important;
    outline-offset: 4px !important;
}
.school-site [hidden] { display: none !important; }
.school-site .skip-link {
    position: fixed;
    inset: .75rem auto auto .75rem;
    z-index: 10000;
    padding: .75rem 1rem;
    border-radius: var(--school-radius-sm);
    color: var(--school-surface);
    background: var(--school-ink);
    transform: translateY(-160%);
}
.school-site .skip-link:focus { transform: translateY(0); }
.school-site h1, .school-site .h1, .school-site h2, .school-site .h2,
.school-site h3, .school-site .h3, .school-site h4, .school-site .h4,
.school-site h5, .school-site h6 {
    font-family: inherit;
    color: var(--school-ink);
    font-weight: 700;
    letter-spacing: -.035em;
    text-wrap: balance;
}
.school-site h1, .school-site .h1 { font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.12; }
.school-site h2, .school-site .h2 { font-size: clamp(1.65rem, 3vw, 2.5rem); line-height: 1.22; }
.school-site h3, .school-site .h3 { font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.3; }
.school-site h4, .school-site .h4 { font-size: 1.25rem; line-height: 1.4; }
.school-site h5 { font-size: 1.125rem; line-height: 1.4; }
.school-site h6 { font-size: 1rem; line-height: 1.5; }
.school-site .lead, .school-site .section-title p { font-size: 1.0625rem; line-height: 1.8; }
.school-site .section-title { margin-bottom: var(--school-space-8); }
.school-site main > section:not(.banner), .school-site .page-content > section {
    padding-block: clamp(2.5rem, 5vw, 4.5rem);
}
.school-site .page-title { padding-block: clamp(2.5rem, 5vw, 4rem); }
.school-site :where([id]) { scroll-margin-top: 1.5rem; }
.school-site .light-bg { background: var(--school-canvas); }
.school-site .text-theme, .school-site .text-primary { color: var(--school-brand) !important; }
.school-site .theme-bg { background: var(--school-brand); }

/* A single button shape, predictable sizing and explicit semantic variants. */
.school-site .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 2.75rem;
    max-width: 100%;
    padding: .75rem 1.25rem;
    border: 1px solid transparent;
    border-radius: var(--school-radius-sm);
    font: inherit;
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;
    text-align: center;
    box-shadow: none;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.school-site .btn::before, .school-site .btn::after, .school-site .btn span::before { content: none; }
.school-site .btn + .btn { margin-left: 0; }
.school-site .btn span { padding: 0; }
.school-site .btn-sm { padding: .5rem .875rem; font-size: .875rem; }
.school-site .btn-theme, .school-site .btn-primary { color: #fff; background: var(--school-brand); border-color: var(--school-brand); }
.school-site .btn-theme:hover, .school-site .btn-primary:hover { color: #fff; background: var(--school-brand-dark); border-color: var(--school-brand-dark); }
.school-site .btn-dark { color: #fff; background: var(--school-ink); border-color: var(--school-ink); }
.school-site .btn-dark:hover { color: #fff; background: #213e5b; }
.school-site .btn-white, .school-site .btn-light { color: var(--school-ink) !important; background: #fff; border-color: var(--school-border); }
.school-site .btn-white:hover, .school-site .btn-light:hover { background: #eaf5fc; }
.school-site .btn-secondary { color: var(--school-ink); background: #eaf0f5; border-color: var(--school-border); }
.school-site .btn-secondary:hover { color: var(--school-ink); background: #dce6ef; }
.school-site .btn-success { color: #fff; background: #167447; border-color: #167447; }
.school-site .btn-success:hover { color: #fff; background: #105734; }
.school-site .btn-danger { color: #fff; background: #b82d3d; border-color: #b82d3d; }
.school-site .btn-danger:hover { color: #fff; background: #952334; }
.school-site .btn:disabled, .school-site .btn.disabled { opacity: .6; cursor: not-allowed; }
.school-site .btn-box, .school-site .form-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }

/* Shared surfaces, input rhythm and readable list tables. */
.school-site .card, .school-site .featured-item, .school-site .post {
    border: 1px solid var(--school-border);
    border-radius: var(--school-radius);
    box-shadow: var(--school-shadow);
}
.school-site .card-header {
    padding: 1.125rem 1.5rem;
    border-bottom: 1px solid var(--school-border);
    border-radius: var(--school-radius) var(--school-radius) 0 0;
    color: var(--school-ink) !important;
    background: var(--school-surface) !important;
    font-size: 1.0625rem;
    font-weight: 700;
}
.school-site .card-body { padding: clamp(1rem, 2.5vw, 1.75rem); }
.school-site .post-image { border-radius: var(--school-radius) var(--school-radius) 0 0; overflow: hidden; }
.school-site .post-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.school-site .form-control, .school-site .form-select {
    min-height: 2.875rem;
    padding: .7rem .875rem;
    border: 1px solid #b8c9d8;
    border-radius: var(--school-radius-sm);
    background-color: #fff;
    color: var(--school-ink);
    font: inherit;
    box-shadow: none;
}
.school-site textarea.form-control { min-height: 9rem; }
.school-site .form-control:focus, .school-site .form-select:focus { border-color: var(--school-focus); box-shadow: 0 0 0 .2rem rgb(8 124 174 / 12%); }
.school-site .form-control::placeholder { color: #63798b; }
.school-site label { margin-bottom: .4rem; font-weight: 600; }
.school-site .form-check-input { width: 1.125rem; height: 1.125rem; }
.school-site .form-check-input:checked { background-color: var(--school-brand); border-color: var(--school-brand); }
.school-site .errorlist { margin: .5rem 0; padding-left: 1.25rem; color: #a92134; font-size: .9rem; }
.school-site .helptext, .school-site .form-text { color: var(--school-muted); font-size: .875rem; }
.school-site .table-responsive { max-width: 100%; border-radius: .5rem; }
.school-site .table { margin-bottom: 0; color: var(--school-ink); vertical-align: middle; font-size: .9375rem; }
.school-site .table > :not(caption) > * > * { padding: 1rem; border-bottom-color: var(--school-border); }
.school-site .table thead th { color: var(--school-muted); background: var(--school-canvas); font-size: .8125rem; font-weight: 700; white-space: nowrap; }
.school-site .table tbody td:last-child { min-width: 9rem; }
.school-site .table td .btn { margin-block: .2rem; }
.school-site .badge { padding: .45em .7em; border-radius: .375rem; font-weight: 600; }
.school-site .alert { padding: 1rem 3rem 1rem 1.25rem; border-radius: var(--school-radius-sm); }
.school-messages { margin-top: var(--school-space-6); }

/* Header uses its own selectors, independent of legacy theme dropdown rules. */
.school-topbar { background: var(--school-canvas); border-bottom: 1px solid var(--school-border); font-size: .8125rem; }
.school-topbar__inner, .school-topbar__contact, .school-topbar__links { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1.25rem; }
.school-topbar__inner { justify-content: space-between; padding-block: .5rem; }
.school-topbar a { color: var(--school-ink); font-weight: 600; }
.school-topbar__location { color: var(--school-muted); }
.school-header__main { position: relative; z-index: 1000; background: #fff; border-bottom: 1px solid var(--school-border); }
.school-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 6rem; }
.school-brand { display: inline-flex; flex-shrink: 0; align-items: center; gap: .75rem; color: var(--school-ink) !important; }
.school-brand img { width: 52px; height: 52px; flex-shrink: 0; object-fit: contain; }
.school-brand--footer img { width: 60px; height: 60px; }
.school-brand__text { display: grid; gap: .2rem; }
.school-brand__name { font-size: 1.0625rem; font-weight: 800; letter-spacing: -.035em; line-height: 1.25; }
.school-brand__motto { color: var(--school-muted); font-size: .65rem; line-height: 1.5; }
.school-navigation { display: flex; align-items: center; gap: 1rem; }
.school-navigation__list, .school-dropdown__menu, .account-navigation__links { list-style: none; margin: 0; padding: 0; }
.school-navigation__list { display: flex; align-items: center; gap: .15rem; }
.school-navigation__link { display: flex; align-items: center; gap: .4rem; padding: .625rem .55rem; color: var(--school-ink) !important; border-radius: .5rem; font-size: .8125rem; font-weight: 600; cursor: pointer; white-space: nowrap; line-height: 1.5; }
.school-navigation__link:hover, .school-navigation__link.is-active, .school-dropdown[open] > summary { background: #edf5fb; color: var(--school-brand) !important; }
.school-dropdown { position: relative; }
.school-dropdown > summary { list-style: none; }
.school-dropdown > summary::-webkit-details-marker { display: none; }
.school-caret { display: inline-block; width: .375rem; height: .375rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-top: -.2rem; }
.school-dropdown[open] > summary .school-caret { transform: rotate(225deg); margin-top: .2rem; }
.school-dropdown__menu { position: absolute; z-index: 1100; top: calc(100% + .5rem); left: 0; min-width: 15rem; padding: .5rem; background: #fff; border: 1px solid var(--school-border); border-radius: var(--school-radius-sm); box-shadow: var(--school-shadow); }
.school-dropdown__menu a { display: block; padding: .625rem .75rem; border-radius: .375rem; color: var(--school-ink); font-size: .875rem; line-height: 1.5; }
.school-dropdown__menu a:hover, .school-dropdown__menu a[aria-current] { background: var(--school-canvas); color: var(--school-brand); }
.school-site .school-navigation__cta { font-size: .8125rem; padding-inline: .875rem; white-space: nowrap; }
.school-menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: .625rem; padding: .625rem .75rem; min-height: 2.75rem; border: 1px solid var(--school-border); border-radius: .5rem; color: var(--school-ink); background: #fff; font-size: .8125rem; font-weight: 600; }
.school-menu-toggle__icon { position: relative; display: inline-block; width: 1rem; height: 2px; background: currentColor; }
.school-menu-toggle__icon::before, .school-menu-toggle__icon::after { content: ""; position: absolute; left: 0; width: 100%; height: 2px; background: currentColor; }
.school-menu-toggle__icon::before { top: -5px; }
.school-menu-toggle__icon::after { top: 5px; }

/* The account area reuses the same type, controls and spacing foundations. */
.school-site.account-page { background: var(--school-canvas); }
.account-navigation-wrap { margin-top: var(--school-space-8); }
.account-navigation { border: 1px solid var(--school-border); border-radius: var(--school-radius); background: #fff; box-shadow: var(--school-shadow); }
.account-navigation__heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.25rem; }
.account-navigation__label { color: var(--school-muted); font-size: .8125rem; font-weight: 700; }
.account-navigation__content { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0 .75rem .75rem; }
.account-navigation__links { display: flex; flex-wrap: wrap; gap: .25rem; }
.account-navigation__links a, .account-navigation__logout { display: block; padding: .65rem .75rem; border-radius: .5rem; color: var(--school-ink); font-size: .875rem; font-weight: 600; }
.account-navigation__links a:hover, .account-navigation__links a.is-active { color: var(--school-brand); background: #edf5fb; }
.account-navigation__logout { color: #9e2535 !important; white-space: nowrap; }
.school-site.account-page #main-content { padding-bottom: var(--school-space-12); }
.school-site .profile-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 2rem; margin: 0 0 1.5rem; }
.profile-details dt { color: var(--school-muted); font-size: .8125rem; font-weight: 600; }
.profile-details dd { margin: .3rem 0 0; font-weight: 600; overflow-wrap: anywhere; }

/* Footer contact, links and copyright follow the same content grid. */
.school-footer { margin-top: auto; padding-block: clamp(2.5rem, 5vw, 4rem) 1.25rem; color: #e0eaf3; background: var(--school-ink); }
.school-footer__grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1.4fr; gap: 2.5rem; }
.school-footer .school-brand { color: #fff !important; }
.school-brand--footer img { padding: .35rem; background: #fff; border-radius: 50%; }
.school-footer__identity p { max-width: 33ch; margin: 1.25rem 0; font-size: .9375rem; }
.school-site .school-footer__heading { margin-bottom: 1rem; color: #fff; font-size: .9375rem; letter-spacing: 0; }
.school-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: .625rem; }
.school-footer a { color: #e0eaf3; font-size: .875rem; }
.school-footer a:hover { color: #fff; text-decoration: underline !important; }
.school-footer a:focus-visible { outline-color: var(--school-accent) !important; }
.school-footer__address { display: grid; gap: .75rem; margin-bottom: .75rem; font-size: .875rem; font-style: normal; }
.school-footer__hours { margin: .75rem 0; font-size: .875rem; }
.school-footer__bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid #35495f; font-size: .75rem; }
.school-footer__bottom p { margin: 0; }
.school-footer__bottom > div { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.school-footer__bottom a { font-size: inherit; }
.school-site .scroll-top { z-index: 950; }
.school-site .scroll-top a { width: 2.75rem; height: 2.75rem; line-height: 2.75rem; border-radius: var(--school-radius-sm); }

@media (max-width: 74.999rem) {
    .school-header__inner { flex-wrap: wrap; gap: 0; padding-block: 1rem; min-height: 5.25rem; }
    .school-navigation { flex-basis: 100%; display: block; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid var(--school-border); }
    .school-navigation__list { display: grid; gap: .25rem; }
    .school-navigation__link { justify-content: space-between; min-height: 2.75rem; padding: .75rem; font-size: .9375rem; }
    .school-dropdown__menu { position: static; min-width: 0; margin: .25rem 0 .5rem; padding-left: 1rem; border: 0; box-shadow: none; }
    .school-dropdown__menu a { padding: .75rem; }
    .school-site .school-navigation__cta { margin-top: .75rem; font-size: .9375rem; }
    .account-navigation__content { display: block; padding: 0 .75rem .75rem; }
    .account-navigation__links { display: grid; }
    .account-navigation__logout { margin-top: .5rem; }
    .school-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 47.999rem) {
    .school-topbar__location { display: none; }
    .school-topbar__inner { gap: .5rem; font-size: .75rem; }
    .school-topbar__contact, .school-topbar__links { gap: .75rem; }
    .school-brand { gap: .5rem; }
    .school-brand img { width: 42px; height: 42px; }
    .school-brand__name { font-size: .9375rem; }
    .school-brand__motto { max-width: 22ch; font-size: .6rem; }
    .school-menu-toggle { padding: .5rem .625rem; }
    .school-site .fullscreen-banner .align-center { padding-block: 4rem !important; }
    .school-site .profile-details { grid-template-columns: 1fr; }
    .school-footer__grid { gap: 2rem 1.5rem; }
    .school-footer__identity { grid-column: 1 / -1; }
    .school-footer__grid > :last-child { grid-column: 1 / -1; }
    .school-footer__identity p { max-width: 48ch; }
    .school-site .table > :not(caption) > * > * { padding: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
    .school-site *, .school-site *::before, .school-site *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

.school-page-heading { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin: 2rem 0 1.5rem; }
.school-page-heading h1 { margin-bottom: .5rem; }
.school-page-heading__description { max-width: 60ch; margin: 0; color: var(--school-muted); }
.school-eyebrow { margin-bottom: .5rem; color: var(--school-brand); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.school-site .form-group { margin-bottom: 1.25rem; }

/* Keep hero copy in normal flow; legacy absolute centring clips longer copy. */
.school-site .fullscreen-banner { min-height: 0; height: auto !important; }
.school-site .fullscreen-banner .owl-carousel,
.school-site .fullscreen-banner .owl-stage-outer,
.school-site .fullscreen-banner .owl-stage,
.school-site .fullscreen-banner .owl-item { height: auto; }
.school-site .fullscreen-banner .item { display: flex; align-items: center; min-height: min(42rem, 78svh); }
.school-site .fullscreen-banner .align-center { position: relative; top: auto; transform: none; padding-block: clamp(3rem, 6vw, 5rem) !important; }
@media (max-width: 47.999rem) {
    .school-site .fullscreen-banner .item { min-height: 0; }
}

/* Essential copy and actions must not wait for decorative carousel transitions. */
.school-site .banner-slider :is(h1, h6, p, .btn-box) { opacity: 1; transform: none; transition: none; }
.school-site .dark-bg .section-title .title { color: #fff; }
.school-site .dark-bg a:not(.btn) { color: #bde7fd; }