/* Editorial layer for the non-home public pages. The landing page keeps its own composition. */
.academy-page {
    --academy-blue: #0875f9;
    --academy-ink: #0b2d5a;
    --academy-muted: #526b89;
    --academy-line: #dce8f7;
    background: #fff;
}
.academy-page > main.page-enter { min-height: 0; }

.academy-page .page-hero {
    min-height: 270px;
    display: flex;
    align-items: center;
    background:
        radial-gradient(circle at 12% 90%, rgba(98,177,255,.12), transparent 30%),
        linear-gradient(115deg, #edf6ff 0%, #f9fbff 58%, #eaf4ff 100%);
}
.academy-page .page-hero::before { display: none; }
.academy-page .page-hero::after {
    top: auto;
    right: -100px;
    bottom: -135px;
    width: 290px;
    height: 290px;
    border: 1px solid rgba(8,117,249,.1);
    background: radial-gradient(circle, rgba(8,117,249,.1), rgba(8,117,249,0) 68%);
}
.academy-page .page-hero .container { z-index: 1; }
.academy-page .page-hero h1 { color: var(--academy-ink); text-wrap: balance; }
.academy-page .page-hero p:not(.eyebrow) { color: var(--academy-muted); font-size: 1rem; }
.academy-page .page-hero .eyebrow { display: flex; align-items: center; gap: 9px; }
.academy-page .page-hero .eyebrow::before { width: 23px; height: 2px; border-radius: 4px; background: #1596ff; content: ""; }
.academy-page .page-hero.auth-page-hero { min-height: 220px; }
.academy-page .breadcrumbs { position: relative; z-index: 2; }

.academy-page .section { padding-block: clamp(46px, 7vw, 82px); }
.academy-page .section-heading { margin-bottom: clamp(22px, 4vw, 34px); }
.academy-page .section-heading h2 { color: var(--academy-ink); text-wrap: balance; }
.academy-page .section-heading .eyebrow { margin-bottom: 7px; }
.academy-page .program-grid { gap: 18px; }
.academy-page .program-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: clamp(20px, 2vw, 26px);
    border-color: var(--academy-line);
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(14,54,104,.055);
}
.academy-page .program-card .program-icon { width: 52px; height: 52px; border-radius: 17px; background: linear-gradient(145deg, #e6f2ff, #d7eaff); }
.academy-page .program-card h3 { margin-top: 2px; font-size: 1.04rem; text-wrap: balance; }
.academy-page .program-card p { color: #536b88; }
.academy-page .program-card > a { margin-top: auto; padding-top: 7px; }
.academy-page .surface-card,
.academy-page .prose-card,
.academy-page .form-card {
    border-color: var(--academy-line);
    border-radius: 24px;
    box-shadow: 0 12px 36px rgba(18,56,104,.075);
}
.academy-page .surface-card { padding: clamp(22px, 4vw, 34px); }
.academy-page .prose-card { position: relative; overflow: hidden; }
.academy-page .prose-card::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #0875f9, #35b5ff 58%, #70ddc8);
    content: "";
}
.academy-page .mission-card { box-shadow: 0 22px 48px rgba(8,35,77,.18); }
.academy-page .feature-grid { gap: clamp(24px, 5vw, 68px); }
.academy-page .content-narrow p { max-width: 75ch; }
.academy-page .form-section { background: linear-gradient(160deg, #f4f9ff 0%, #fbfdff 55%, #f0f7ff 100%); }
.academy-page .form-card { padding: clamp(22px, 4vw, 36px); }
.academy-page .field input,
.academy-page .field select,
.academy-page .field textarea { background: #fcfdff; }
.academy-page .button-filled { background: linear-gradient(100deg, #0875f9, #0962d6); }
.academy-page .button-filled:hover { background: linear-gradient(100deg, #0065e5, #074fab); }
.academy-page .button-outlined { border-color: #83b8f4; }
.academy-page .alert-error { border: 1px solid #f6caca; }
.academy-page .faq-item { padding: 19px 20px; }
.academy-page .faq-item summary { min-height: 30px; font-size: .97rem; }
.academy-page .data-table { min-width: 560px; }
.academy-page .data-table th { white-space: nowrap; }

/* The same photographic treatment appears on editorial page heroes at larger sizes. */
@media (min-width: 960px) {
    .academy-page .page-hero { min-height: 356px; padding-block: 54px; }
    .academy-page .page-hero .container { padding-right: min(42%, 485px); }
    .academy-page .page-hero::before {
        position: absolute;
        z-index: 0;
        top: 26px;
        right: max(32px, calc((100vw - 1180px) / 2));
        bottom: 26px;
        display: block;
        width: min(39vw, 440px);
        border: 1px solid rgba(255,255,255,.7);
        border-radius: 25px;
        background:
            linear-gradient(90deg, rgba(237,246,255,.04), rgba(12,48,96,.04)),
            url('../images/homepage-students-classroom.jpg') center 38% / cover;
        box-shadow: 0 22px 55px rgba(16,57,106,.18);
        content: "";
    }
    .academy-page .page-hero::after {
        z-index: 1;
        right: max(48px, calc((100vw - 1148px) / 2));
        bottom: 39px;
        width: auto;
        height: auto;
        padding: 10px 16px;
        border: 1px solid rgba(255,255,255,.74);
        border-radius: 99px;
        background: rgba(255,255,255,.94);
        box-shadow: 0 7px 20px rgba(15,48,89,.13);
        color: #0d3c74;
        content: "LEARN  ·  BUILD  ·  GROW";
        font-size: .66rem;
        font-weight: 850;
        letter-spacing: .12em;
        white-space: nowrap;
        animation: academy-float 7s ease-in-out infinite;
    }
    .academy-page .page-hero.auth-page-hero::before { display: none; }
    .academy-page .page-hero.auth-page-hero .container { padding-right: 0; }
    .academy-page .page-hero.auth-page-hero::after { display: none; }
}

/* Sign-in screens are deliberately separate from the marketing hero. */
.academy-page .auth-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
}
.academy-page .auth-layout .form-card { width: 100%; }
.academy-page .auth-art-panel {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    min-height: 235px;
    flex-direction: column;
    justify-content: flex-end;
    padding: 24px;
    border-radius: 24px;
    background: #0c3265;
    box-shadow: 0 18px 40px rgba(10,43,88,.18);
    color: #fff;
}
.academy-page .auth-art-panel::before {
    position: absolute;
    z-index: -2;
    inset: 0;
    background: url('../images/homepage-hero-student.jpg') 56% 35% / cover;
    content: "";
    transition: transform .6s cubic-bezier(.2,0,0,1);
}
.academy-page .auth-art-panel::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(180deg, rgba(6,30,66,.02) 12%, rgba(5,29,66,.88) 100%);
    content: "";
}
.academy-page .auth-art-panel:hover::before { transform: scale(1.035); }
.academy-page .auth-admin-panel::before { background-image: url('../images/homepage-students-classroom.jpg'); background-position: center 38%; }
.academy-page .auth-art-panel .eyebrow { color: #91d4ff; }
.academy-page .auth-art-panel h2 { max-width: 440px; margin-bottom: 8px; color: #fff; font-size: clamp(1.45rem, 3vw, 2rem); }
.academy-page .auth-art-panel p { max-width: 450px; margin: 0; color: #e2edfa; font-size: .9rem; }
.academy-page .auth-points { display: grid; gap: 10px; margin-top: 18px; }
.academy-page .auth-point { display: flex; align-items: center; gap: 9px; color: #e6f0fc; font-size: .81rem; font-weight: 650; }
.academy-page .auth-point .material-symbols-outlined { color: #8bd0ff; font-size: 19px; }
.academy-page .auth-card-heading { margin: 17px 0 19px; }
.academy-page .auth-card-heading h2 { margin: 0 0 5px; }
.academy-page .auth-card-heading p { margin: 0; }

@keyframes academy-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@media (min-width: 700px) {
    .academy-page .auth-layout { grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: 24px; }
    .academy-page .auth-art-panel { min-height: 100%; padding: 30px; }
}
@media (min-width: 1100px) {
    .academy-page .auth-layout { grid-template-columns: minmax(0, 1fr) minmax(350px, .88fr); gap: 34px; }
    .academy-page .auth-art-panel { min-height: 500px; padding: 38px; }
}
@media (max-width: 699px) {
    .academy-page .auth-art-panel { min-height: 190px; }
}
@media (prefers-reduced-motion: reduce) {
    .academy-page .page-hero::after,
    .academy-page .auth-art-panel::before { animation: none; transition: none; }
}