.public-page {
    --mockup-header-height: 78px;
    min-width: 320px;
    font-family: "Typold", "Century Gothic", "Avenir Next", Arial, sans-serif;
}

.public-page .site-header {
    height: var(--mockup-header-height);
    min-height: var(--mockup-header-height);
    padding: 0 clamp(30px, 7.2vw, 138px);
    gap: 34px;
    border-bottom: 1px solid rgba(0, 41, 87, .08);
    background: #fff;
}

.public-page .brand {
    width: 82px;
    height: 68px;
    overflow: visible;
}

.brand-logo {
    width: 82px;
    height: 68px;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
    object-position: center;
}

.public-page .main-nav {
    gap: clamp(16px, 2vw, 36px);
    white-space: nowrap;
}

.public-page .main-nav > a,
.public-page .nav-dropdown-toggle {
    padding: 28px 0 24px;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
}

.nav-dropdown-toggle { white-space: nowrap; }
.nav-dropdown-toggle::after { content: none; display: none; }
.nav-dropdown-toggle > span { display: none; }

@media (max-width: 1120px) {
    .public-page { --mockup-header-height: 72px; }

    .public-page .site-header {
        height: var(--mockup-header-height);
        min-height: var(--mockup-header-height);
        padding-inline: 24px;
    }

    .public-page .brand,
    .public-page .brand-logo {
        width: 70px;
        height: 60px;
    }

    .public-page .menu-toggle { display: grid; }

    .public-page .main-nav {
        position: fixed;
        inset: var(--mockup-header-height) 0 auto;
        max-height: calc(100svh - var(--mockup-header-height));
        overflow-y: auto;
        padding: 20px 24px 28px;
        display: none;
        align-items: stretch;
        flex-direction: column;
        gap: 0;
        border-top: 1px solid #d9e4ef;
        background: #fff;
        box-shadow: 0 18px 36px rgba(0, 41, 87, .14);
    }

    .public-page .main-nav.open { display: flex; }

    .public-page .main-nav > a,
    .public-page .nav-dropdown-toggle {
        width: 100%;
        border-bottom: 1px solid #d9e4ef;
        padding: 14px 0;
        justify-content: flex-start;
        font-size: .88rem;
        text-align: left;
    }

    .public-page .nav-dropdown { display: block; }
    .public-page .nav-submenu { position: static; width: 100%; border: 0; padding: 0 0 0 18px; box-shadow: none; }
    .public-page .main-nav .language-switch { align-self: flex-start; margin-top: 18px; }
}

@media (min-width: 1121px) and (min-height: 700px) {
    .public-page {
        height: 100svh;
        overflow: hidden;
    }

    .public-page main {
        height: calc(100svh - var(--mockup-header-height));
        min-height: 0;
    }
}

.home-page .home-hero {
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    background: #fff url('../images/home-hero-clean.png') center / 100% 100% no-repeat;
}

.home-page .hero-copy {
    width: 47%;
    padding: 0 0 3vh clamp(44px, 9.4vw, 180px);
}

.home-page .hero-copy h1 {
    max-width: 540px;
    font-size: 3.25rem;
    line-height: 1.08;
}

.home-page .hero-summary {
    max-width: 500px;
    margin: 25px 0 15px;
    font-size: 1.12rem;
    line-height: 1.42;
}

.about-page .about-section {
    display: flex;
    flex-direction: column;
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    padding: 56px clamp(34px, 5vw, 80px) 16px;
}

.about-page .section-heading h1 {
    font-size: 2.35rem;
    line-height: 1.05;
}

.about-page .about-copy {
    width: min(1100px, 100%);
    font-size: .82rem;
    line-height: 1.4;
}

.about-page .compact-levels {
    width: min(1160px, 100%);
    margin: 72px auto 0;
    padding-top: 0;
}

.about-page .level-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.about-page .level-card {
    border-radius: 0 0 6px 6px;
}

.about-page .level-sprite { height: 108px; }

.registration-page .ppdb-page {
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    overflow: hidden;
}

@media (max-width: 760px) {
    .public-page {
        height: auto;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .home-page .home-hero,
    .about-page .about-section,
    .registration-page .ppdb-page {
        height: auto;
        min-height: calc(100svh - var(--mockup-header-height));
    }

    .home-page .hero-copy {
        width: 100%;
        padding: 34px 22px 42px;
        background: rgba(255, 255, 255, .5);
    }

    .home-page .hero-copy h1 { font-size: 2.45rem; }
    .about-page .level-cards { grid-template-columns: 1fr; }
    .about-page .about-section { display: block; padding-top: 28px; }
    .about-page .compact-levels { margin-top: 28px; padding-top: 0; }
}

.program-list-page main {
    height: calc(100svh - var(--mockup-header-height));
    overflow: hidden;
}

.program-list-page .program-intro {
    height: 176px;
    min-height: 0;
    grid-template-columns: 43% 57%;
}

.program-list-page .program-intro > div {
    padding: 25px 28px 20px clamp(38px, 7vw, 110px);
    transform: translateY(-6px);
}

.program-list-page .program-intro h1 {
    margin-bottom: 8px;
    font-size: 2.1rem;
}

.program-list-page .program-intro p {
    font-size: .79rem;
    line-height: 1.35;
}

.program-list-page .program-grid {
    height: calc(100% - 176px);
    width: min(1180px, calc(100% - 44px));
    margin: 0 auto;
    padding: 15px 0 18px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 12px 18px;
}

.program-list-page .program-card {
    border-radius: 0;
    box-shadow: 0 4px 12px rgba(0, 41, 87, .14);
}

.program-list-page .program-card-media { height: 84px; }
.program-list-page .program-card-media img { top: -48px; width: 768px; height: 432px; }
.program-list-page .program-card-copy { padding: 9px 12px 10px; }
.program-list-page .program-card h2 { margin-bottom: 4px; font-size: .74rem; }
.program-list-page .program-card p { font-size: .62rem; line-height: 1.28; }
.program-list-page .program-card span { padding-top: 6px; font-size: .56rem; }

.program-detail-page .program-detail {
    position: relative;
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    grid-template-columns: 38% 62%;
    overflow: hidden;
}

.program-detail-page .program-detail::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: -5%;
    right: -5%;
    bottom: -34%;
    height: 50%;
    border-radius: 50% 50% 0 0;
    background: #002957;
    pointer-events: none;
}

.program-detail-page .detail-art,
.program-detail-page .detail-copy {
    position: relative;
    z-index: 1;
    min-height: 0;
}

.program-detail-page .detail-art.mockup-source img {
    top: auto;
    bottom: 0;
    width: auto;
    max-width: none;
    height: 112.27%;
    object-fit: fill;
}

.program-detail-page .detail-copy {
    max-height: 100%;
    overflow: hidden;
    padding: 22px clamp(32px, 5vw, 76px) 22px 4vw;
}

.program-detail-page .detail-kicker { margin-bottom: 4px; font-size: .92rem; }
.program-detail-page .detail-copy h1 { font-size: 2rem; line-height: 1.12; }
.program-detail-page .detail-copy .brand-rule { width: 120px; height: 4px; margin: 12px 0 17px; }
.program-detail-page .detail-body { font-size: .82rem; line-height: 1.38; }
.program-detail-page .detail-list { margin-top: 14px; font-size: .76rem; }

.program-detail-page .program-detail-clean {
    display: block;
    background: #fff;
}

.program-detail-page .program-detail-clean::after { display: none; }

.program-detail-page .program-detail-clean .detail-art {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
}

.program-detail-page .program-detail-clean .detail-art img {
    position: static;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.program-detail-page .program-detail-clean .detail-copy {
    position: relative;
    z-index: 1;
    width: 62%;
    height: 100%;
    margin-left: 38%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 760px) {
    .program-list-page main,
    .program-detail-page .program-detail {
        height: auto;
        overflow: visible;
    }

    .program-list-page .program-intro {
        height: auto;
        grid-template-columns: 1fr;
    }

    .program-list-page .program-grid {
        width: min(100% - 36px, 430px);
        height: auto;
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .program-list-page .program-card-media { height: 190px; }
    .program-list-page .program-card-copy { padding: 18px 20px 20px; }
    .program-list-page .program-card h2 { font-size: 1rem; }
    .program-list-page .program-card p { font-size: .88rem; -webkit-line-clamp: initial; }
    .program-list-page .program-card span { padding-top: 14px; font-size: .78rem; }

    .program-detail-page .program-detail { grid-template-columns: 1fr; overflow: hidden; }
    .program-detail-page .detail-art { height: 58svh; }
    .program-detail-page .detail-art.mockup-source img { top: -12%; bottom: auto; width: 100%; max-width: 100%; height: 112%; object-fit: cover; object-position: left bottom; }
    .program-detail-page .detail-copy { max-height: none; overflow: visible; padding: 40px 22px 58px; }
    .program-detail-page .detail-copy h1 { font-size: 2rem; }
    .program-detail-page .detail-body { font-size: 1rem; }
    .program-detail-page .detail-list { grid-template-columns: 1fr; font-size: .92rem; }
    .program-detail-page .program-detail-clean { display: grid; }
    .program-detail-page .program-detail-clean .detail-art {
        position: relative;
        inset: auto;
        height: 58svh;
    }
    .program-detail-page .program-detail-clean .detail-art img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: left center;
    }
    .program-detail-page .program-detail-clean .detail-copy {
        width: 100%;
        height: auto;
        margin-left: 0;
    }
}

.vision-page .vision-layout {
    position: relative;
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    display: block;
    background: #fff;
}

.vision-page .vision-art {
    position: absolute;
    inset: 0;
    z-index: 0;
    min-height: 0;
    overflow: hidden;
}

.vision-page .vision-art.mockup-source img {
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: none;
}

.vision-page .vision-copy {
    position: relative;
    z-index: 1;
    width: 52%;
    height: 100%;
    margin-left: 48%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 24px clamp(36px, 7vw, 120px) 24px 5.5vw;
}

.vision-page .vision-copy h1 {
    margin: 0 0 34px;
    font-size: 4.25rem;
    line-height: 1;
}

.vision-page .vision-copy article { margin-bottom: 21px; }
.vision-page .vision-copy h2 { margin: 0 0 7px; font-size: 1.28rem; }
.vision-page .vision-copy p { margin: 0; font-size: 1rem; line-height: 1.38; }

.mission-page .mission-section {
    position: relative;
    height: calc(100svh - var(--mockup-header-height));
    min-height: 0;
    padding: 0;
    background: #fff;
}

.mission-page .mission-section::after { display: none; }

.mission-page .mission-art { opacity: 1; }

.mission-page .mission-art img { filter: none; }

.mission-page .mission-content {
    height: 100%;
    padding: 24px clamp(42px, 8vw, 150px) 28px;
}

.mission-page .mission-heading {
    grid-template-columns: 1fr 1fr;
    gap: 7vw;
    margin-bottom: 20px;
}

.mission-page .mission-heading h1 {
    font-size: 4.5rem;
    line-height: 1;
}

.mission-page .mission-heading p {
    max-width: 510px;
    font-size: 1rem;
    line-height: 1.4;
}

.mission-page .mission-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, 134px);
    grid-auto-flow: column;
    gap: 12px 7%;
}

.mission-page .mission-item {
    height: 134px;
    min-height: 0;
    grid-template-columns: 86px 1fr;
    border-radius: 0;
}

.mission-page .mission-item > span { font-size: 2.65rem; }
.mission-page .mission-item > div { padding: 13px 17px; }
.mission-page .mission-item h2 { margin-bottom: 5px; font-size: 1rem; }
.mission-page .mission-item p { font-size: .78rem; line-height: 1.28; }

@media (max-width: 760px) {
    .vision-page .vision-layout {
        height: auto;
        grid-template-columns: 1fr;
        display: grid;
    }

    .vision-page .vision-art {
        position: relative;
        inset: auto;
        height: 58svh;
    }
    .vision-page .vision-copy {
        width: 100%;
        height: auto;
        margin-left: 0;
        padding: 38px 22px 44px;
    }
    .vision-page .vision-copy h1 { font-size: 3.2rem; }

    .mission-page .mission-section {
        height: auto;
        min-height: calc(100svh - var(--mockup-header-height));
    }

    .mission-page .mission-content { padding: 34px 18px 52px; }
    .mission-page .mission-heading,
    .mission-page .mission-grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        grid-auto-flow: row;
    }

    .mission-page .mission-heading { gap: 12px; }
    .mission-page .mission-heading h1 { font-size: 3.2rem; }
    .mission-page .mission-item { height: auto; min-height: 132px; grid-template-columns: 74px 1fr; }
}

.locations-page .locations-layout {
    height: calc(100svh - var(--mockup-header-height));
    overflow: hidden;
}

.locations-page .locations-hero {
    height: 188px;
    grid-template-columns: 43% 57%;
}

.locations-page .location-unit-grid {
    height: calc(100% - 188px);
    width: min(1180px, calc(100% - 48px));
}

.registration-page .ppdb-stage {
    position: relative;
    width: min(100%, calc((100svh - var(--mockup-header-height)) * 2.0773));
    aspect-ratio: 2742 / 1320;
}

@media (max-width: 760px) {
    .locations-page .locations-layout {
        height: auto;
        overflow: visible;
    }

    .locations-page .location-unit-grid {
        width: min(100% - 32px, 470px);
        height: auto;
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .registration-page .ppdb-stage { width: 100%; }
}
