/* Native CSS reset (no framework dependency) */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
}

html {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    -webkit-tap-highlight-color: transparent;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
figure,
dl,
dd {
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit;
}

ol,
ul,
menu {
    margin: 0;
    padding: 0;
    list-style: none;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
    vertical-align: middle;
}

img,
video {
    max-width: 100%;
    height: auto;
}

button,
input,
select,
optgroup,
textarea {
    font: inherit;
    letter-spacing: inherit;
    color: inherit;
    background-color: transparent;
    border-radius: 0;
    opacity: 1;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    appearance: button;
}

textarea {
    resize: vertical;
}

table {
    border-color: inherit;
    border-collapse: collapse;
    text-indent: 0;
}

hr {
    height: 0;
    color: inherit;
    border: 0;
    border-top: 1px solid;
}

[hidden] {
    display: none !important;
}

/* Small reusable native utility classes used by the templates/scripts. */
.visible {
    visibility: visible;
}

.static {
    position: static;
}

.hidden {
    display: none;
}

.table {
    display: table;
}

.resize {
    resize: both;
}

.outline {
    outline: 1px solid;
}

/* Foundation course page */
.foundation-course-section {
    background: radial-gradient(circle at 8% 8%, #c89a3d1a, transparent 25%), #f7fafc
}

.foundation-course-intro {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr);
    align-items: center;
    gap: clamp(40px, 6vw, 78px)
}

.course-eyebrow,
.course-learning-card>span {
    color: var(--gold);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase
}

.foundation-course-copy h2,
.course-learning-card h2 {
    color: var(--navy);
    font-family: Georgia, serif;
    line-height: 1.15
}

.foundation-course-copy h2 {
    max-width: 650px;
    margin: 12px 0 20px;
    font-size: clamp(38px, 4.4vw, 56px)
}

.foundation-course-copy p {
    color: #607487;
    margin-bottom: 18px;
    line-height: 1.75
}

.foundation-course-copy .course-lead {
    color: #30495e;
    font-size: 19px
}

.course-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px
}

.course-call {
    color: var(--navy);
    background: #fff;
    border-color: #b8c8d2
}

.foundation-course-image {
    min-height: 500px;
    border-radius: 22px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 26px 65px #052e5233
}

.foundation-course-image:after {
    content: "";
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(transparent, #021c309e)
}

.foundation-course-image>img {
    width: 100%;
    height: 500px;
    object-fit: cover
}

.foundation-course-image figcaption {
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #fff;
    position: absolute;
    right: 26px;
    bottom: 24px;
    left: 26px
}

.foundation-course-image figcaption>svg {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    padding: 12px
}

.foundation-course-image figcaption span,
.course-facts span {
    display: flex;
    flex-direction: column
}

.foundation-course-image figcaption strong {
    font-size: 15px
}

.foundation-course-image figcaption span {
    color: #d7e5ed;
    font-size: 12px
}

.course-facts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 62px 0;
    background: var(--navy);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 16px 42px #052e5226
}

.course-facts>div {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 112px;
    padding: 24px;
    border-right: 1px solid #ffffff1f
}

.course-facts>div:last-child {
    border-right: 0
}

.course-facts svg {
    flex: none;
    color: var(--gold)
}

.course-facts small {
    color: #9fb7c7;
    margin-bottom: 4px;
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase
}

.course-facts strong {
    color: #fff;
    font-size: 14px
}

.course-learning-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 25px
}

.course-learning-card {
    padding: clamp(28px, 4vw, 44px);
    background: #fff;
    border: 1px solid #dce6eb;
    border-radius: 16px;
    box-shadow: 0 16px 45px #052e5212
}

.course-learning-card h2 {
    margin: 10px 0 24px;
    font-size: clamp(27px, 3vw, 35px)
}

.course-learning-card li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #435b6e;
    padding: 13px 0;
    border-bottom: 1px solid #e5ebef
}

.course-learning-card li:last-child {
    border-bottom: 0
}

.course-learning-card li svg {
    width: 22px;
    height: 22px;
    color: var(--gold)
}

.course-subjects {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.course-subjects b {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--navy);
    background: #eef4f7;
    border-radius: 999px;
    padding: 10px 14px;
    font-size: 13px
}

.course-subjects svg {
    width: 17px;
    height: 17px;
    color: #a97924
}

.course-subject-card p {
    color: #607487;
    margin-top: 25px;
    line-height: 1.75
}

@media(max-width:900px) {
    .foundation-course-intro {
        grid-template-columns: 1fr
    }

    .foundation-course-image {
        min-height: 440px
    }

    .foundation-course-image>img {
        height: 440px
    }

    .course-facts {
        grid-template-columns: repeat(2, 1fr)
    }

    .course-facts>div:nth-child(2) {
        border-right: 0
    }

    .course-facts>div:nth-child(-n+2) {
        border-bottom: 1px solid #ffffff1f
    }
}

@media(max-width:640px) {
    .foundation-course-copy .course-lead {
        font-size: 17px
    }

    .course-actions {
        flex-direction: column
    }

    .course-actions .button {
        width: 100%
    }

    .foundation-course-image,
    .foundation-course-image>img {
        min-height: 330px;
        height: 330px
    }

    .foundation-course-image figcaption {
        right: 18px;
        bottom: 18px;
        left: 18px
    }

    .course-facts {
        grid-template-columns: 1fr;
        margin: 42px 0
    }

    .course-facts>div {
        min-height: 92px;
        border-right: 0;
        border-bottom: 1px solid #ffffff1f
    }

    .course-facts>div:last-child {
        border-bottom: 0
    }

    .course-learning-grid {
        grid-template-columns: 1fr
    }
}

.foundation-course-copy strong,
.course-learning-card strong,
.jee-outcome-panel strong {
    color: var(--navy)
}

.course-card-copy {
    color: #607487;
    margin-bottom: 12px;
    line-height: 1.75
}

.jee-outcome-panel {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 24px;
    align-items: start;
    color: #d4e1e9;
    background: linear-gradient(135deg, #052e52, #075078);
    border-radius: 16px;
    margin-top: 25px;
    padding: clamp(28px, 4vw, 44px);
    box-shadow: 0 18px 48px #052e5224
}

.jee-outcome-panel>svg {
    width: 70px;
    height: 70px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    padding: 18px
}

.jee-outcome-panel span {
    color: #e4bb65;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .15em;
    text-transform: uppercase
}

.jee-outcome-panel h2 {
    color: #fff;
    margin: 8px 0 12px;
    font: clamp(27px, 3vw, 36px)/1.2 Georgia, serif
}

.jee-outcome-panel p {
    margin: 0;
    line-height: 1.75
}

.jee-outcome-panel strong {
    color: #fff
}

.jee-course-section .course-subject-card .course-subjects {
    margin-top: 25px
}

@media(max-width:640px) {
    .jee-outcome-panel {
        grid-template-columns: 1fr
    }

    .jee-outcome-panel>svg {
        width: 58px;
        height: 58px;
        padding: 15px
    }
}

.zoology-features-card li {
    align-items: flex-start
}

.zoology-features-card li svg {
    flex: none;
    margin-top: 2px
}

.zoology-subjects b {
    color: #235264;
    background: #edf7f5;
    border: 1px solid #d4e8e3
}

.zoology-outcome-panel {
    background: linear-gradient(135deg, #063b4b, #087278)
}

.zoology-key-features {
    margin-bottom: 25px;
    padding: clamp(30px, 4vw, 48px);
    background: #fff;
    border: 1px solid #dce6eb;
    border-radius: 16px;
    box-shadow: 0 16px 45px #052e5212
}

.zoology-key-heading {
    display: grid;
    grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr);
    gap: 10px 50px;
    margin-bottom: 30px
}

.zoology-key-heading>span {
    color: var(--gold);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
    grid-column: 1/-1
}

.zoology-key-heading h2 {
    color: var(--navy);
    font: clamp(28px, 3vw, 38px)/1.2 Georgia, serif
}

.zoology-key-heading p {
    color: #607487;
    line-height: 1.7
}

.zoology-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px
}

.zoology-feature-grid article {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 15px;
    align-items: start;
    padding: 20px;
    background: #f5f9fa;
    border: 1px solid #e0e9ed;
    border-radius: 11px
}

.zoology-feature-grid article>svg {
    width: 48px;
    height: 48px;
    padding: 12px;
    color: #9a7124;
    background: #f6ead1;
    border-radius: 50%
}

.zoology-feature-grid h3 {
    color: var(--navy);
    margin: 1px 0 6px;
    font-size: 15px
}

.zoology-feature-grid p {
    color: #65798a;
    line-height: 1.55;
    font-size: 13px
}

.zoology-feature-grid .zoology-feature-wide {
    grid-column: 1/-1;
    background: linear-gradient(110deg, #edf7f5, #f8fbfc)
}

@media(max-width:700px) {
    .zoology-key-heading {
        grid-template-columns: 1fr
    }

    .zoology-key-heading>span {
        grid-column: auto
    }

    .zoology-feature-grid {
        grid-template-columns: 1fr
    }

    .zoology-feature-grid .zoology-feature-wide {
        grid-column: auto
    }

    .zoology-feature-grid article {
        grid-template-columns: 42px 1fr;
        padding: 17px
    }

    .zoology-feature-grid article>svg {
        width: 42px;
        height: 42px;
        padding: 10px
    }
}

.about-pillars-section {
    background: linear-gradient(180deg, #f7fafc, #fff)
}

.about-pillar-list {
    display: grid;
    gap: 18px
}

.about-pillar-card {
    display: grid;
    grid-template-columns: 68px 86px minmax(0, 1fr);
    align-items: center;
    gap: 26px;
    padding: clamp(28px, 4vw, 44px);
    background: #fff;
    border: 1px solid #dce6eb;
    border-radius: 16px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 15px 42px #052e520d
}

.about-pillar-card:after {
    content: "";
    width: 180px;
    height: 180px;
    border: 1px solid #c89a3d24;
    border-radius: 50%;
    position: absolute;
    right: -95px;
    bottom: -105px;
    box-shadow: 0 0 0 25px #c89a3d0a
}

.about-pillar-number {
    color: #c89a3d30;
    font: 700 54px Georgia, serif
}

.about-pillar-icon {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    color: var(--gold);
    background: var(--navy);
    border-radius: 50%
}

.about-pillar-icon svg {
    width: 32px;
    height: 32px
}

.about-pillar-copy {
    z-index: 1;
    max-width: 800px
}

.about-pillar-copy>span {
    color: var(--gold);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase
}

.about-pillar-copy h3 {
    color: var(--navy);
    margin: 7px 0 12px;
    font: clamp(25px, 3vw, 34px)/1.2 Georgia, serif
}

.about-pillar-copy p {
    color: #607487;
    margin: 0 0 10px;
    line-height: 1.75
}

.about-pillar-copy p:last-child {
    margin-bottom: 0
}

.about-pillar-copy strong {
    color: #30495e
}

.about-pillar-reverse {
    background: linear-gradient(120deg, #052e52, #075078)
}

.about-pillar-reverse .about-pillar-number {
    color: #ffffff1c
}

.about-pillar-reverse .about-pillar-icon {
    color: var(--navy);
    background: var(--gold)
}

.about-pillar-reverse .about-pillar-copy h3,
.about-pillar-reverse .about-pillar-copy strong {
    color: #fff
}

.about-pillar-reverse .about-pillar-copy p {
    color: #c5d8e3
}

@media(max-width:700px) {
    .about-pillar-card {
        grid-template-columns: 54px 1fr;
        gap: 18px;
        padding: 26px 21px
    }

    .about-pillar-number {
        font-size: 42px
    }

    .about-pillar-icon {
        width: 58px;
        height: 58px
    }

    .about-pillar-icon svg {
        width: 25px;
        height: 25px
    }

    .about-pillar-copy {
        grid-column: 1/-1
    }

    .about-pillar-card:after {
        display: none
    }
}

.method-grid.expanded-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px
}

.expanded-method-grid article {
    display: grid;
    grid-template-columns: 52px 1fr;
    grid-template-rows: auto auto 1fr;
    column-gap: 18px;
    border: 1px solid #dce6eb;
    border-top: 4px solid var(--gold);
    border-radius: 10px;
    box-shadow: 0 10px 30px #052e520a;
    transition: transform .2s, box-shadow .2s
}

.expanded-method-grid article:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 38px #052e5214
}

.expanded-method-grid article>span {
    grid-row: 1/3;
    color: #d5dfe6;
    font-size: 35px
}

.expanded-method-grid article>svg {
    grid-column: 1;
    grid-row: 3;
    width: 30px;
    height: 30px;
    margin: 16px 0 0
}

.expanded-method-grid h3 {
    grid-column: 2;
    margin: 0;
    font-size: 22px
}

.expanded-method-grid p {
    grid-column: 2;
    margin: 10px 0 0
}

.expanded-method-grid article:nth-child(4n+2),
.expanded-method-grid article:nth-child(4n+3) {
    background: #f9fbfc
}

@media(max-width:760px) {
    .method-grid.expanded-method-grid {
        grid-template-columns: 1fr
    }

    .expanded-method-grid article {
        grid-template-columns: 45px 1fr;
        padding: 24px 20px
    }

    .expanded-method-grid article:nth-child(4n+2),
    .expanded-method-grid article:nth-child(4n+3) {
        background: #fff
    }

    .expanded-method-grid article:nth-child(even) {
        background: #f9fbfc
    }
}

.zoology-audience-section {
    margin-top: 25px;
    padding: clamp(30px, 4vw, 48px);
    color: #fff;
    background: linear-gradient(135deg, #052e52, #087278);
    border-radius: 16px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 18px 48px #052e5224
}

.zoology-audience-section:after {
    content: "";
    width: 260px;
    height: 260px;
    border: 1px solid #ffffff14;
    border-radius: 50%;
    position: absolute;
    right: -110px;
    bottom: -150px;
    box-shadow: 0 0 0 35px #ffffff08, 0 0 0 70px #ffffff05
}

.zoology-audience-heading {
    z-index: 1;
    max-width: 780px;
    margin-bottom: 28px;
    position: relative
}

.zoology-audience-heading>span {
    color: #e4bb65;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase
}

.zoology-audience-heading h2 {
    margin: 8px 0 0;
    font: clamp(28px, 3.5vw, 40px)/1.2 Georgia, serif
}

.zoology-audience-grid {
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    position: relative
}

.zoology-audience-grid article {
    display: grid;
    grid-template-columns: 58px 1fr;
    gap: 17px;
    padding: 25px;
    background: #ffffff0d;
    border: 1px solid #ffffff1f;
    border-radius: 12px
}

.zoology-audience-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%
}

.zoology-audience-icon svg {
    width: 26px;
    height: 26px
}

.zoology-audience-grid small {
    color: #9fc3cb;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase
}

.zoology-audience-grid h3 {
    margin: 5px 0 8px;
    font: 23px/1.25 Georgia, serif
}

.zoology-audience-grid p {
    color: #c7dce2;
    margin: 0;
    line-height: 1.65
}

.zoology-audience-grid strong {
    color: #fff
}

@media(max-width:760px) {
    .zoology-audience-grid {
        grid-template-columns: 1fr
    }

    .zoology-audience-grid article {
        grid-template-columns: 48px 1fr;
        padding: 21px
    }

    .zoology-audience-icon {
        width: 48px;
        height: 48px
    }

    .zoology-audience-icon svg {
        width: 22px;
        height: 22px
    }
}

.why-page-hero:after {
    content: "WHY"
}

.why-intro-section {
    background: radial-gradient(circle at 8% 12%, #c89a3d18, transparent 27%), #fff
}

.why-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
    align-items: center;
    gap: clamp(42px, 7vw, 90px)
}

.why-intro-copy>span,
.why-outcomes-grid>div>span {
    color: var(--gold);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase
}

.why-intro-copy h2,
.why-outcomes-grid h2 {
    color: var(--navy);
    margin: 10px 0 18px;
    font: clamp(36px, 4.5vw, 54px)/1.12 Georgia, serif
}

.why-intro-copy p {
    color: #607487;
    max-width: 740px;
    margin-bottom: 17px;
    line-height: 1.75
}

.why-intro-copy .why-lead {
    color: #30495e;
    font-size: 19px
}

.why-intro-copy .button {
    margin-top: 12px
}

.why-promise-card {
    color: #fff;
    background: linear-gradient(145deg, #052e52, #087278);
    border-radius: 18px;
    padding: clamp(32px, 4vw, 48px);
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 60px #052e5228
}

.why-promise-card:after {
    content: "";
    width: 210px;
    height: 210px;
    border: 1px solid #ffffff17;
    border-radius: 50%;
    position: absolute;
    right: -100px;
    bottom: -115px;
    box-shadow: 0 0 0 30px #ffffff09
}

.why-promise-card>svg {
    width: 58px;
    height: 58px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    padding: 15px
}

.why-promise-card>span {
    color: #e4bb65;
    display: block;
    margin-top: 27px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .15em;
    text-transform: uppercase
}

.why-promise-card h3 {
    margin: 8px 0 14px;
    font: clamp(27px, 3vw, 36px)/1.25 Georgia, serif
}

.why-promise-card p {
    color: #c7dae3;
    margin: 0;
    line-height: 1.7
}

.why-reasons-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px
}

.why-reasons-grid article {
    background: #fff;
    border: 1px solid #dce6eb;
    border-top: 4px solid var(--gold);
    border-radius: 10px;
    padding: 28px;
    position: relative;
    box-shadow: 0 12px 35px #052e520b
}

.why-reasons-grid article>svg {
    width: 44px;
    height: 44px;
    color: var(--gold);
    background: #f8f1e3;
    border-radius: 50%;
    padding: 11px
}

.why-reasons-grid article>span {
    color: #e2e8ec;
    font: 36px Georgia, serif;
    position: absolute;
    top: 27px;
    right: 25px
}

.why-reasons-grid h3 {
    color: var(--navy);
    margin: 20px 0 10px;
    font: 24px/1.25 Georgia, serif
}

.why-reasons-grid p {
    color: #647789;
    margin: 0;
    line-height: 1.65
}

.why-outcomes-section {
    color: #fff;
    background: linear-gradient(135deg, #032943, #075078)
}

.why-outcomes-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(400px, .9fr);
    align-items: center;
    gap: 65px
}

.why-outcomes-grid h2 {
    color: #fff
}

.why-outcomes-grid p {
    color: #c5d8e3;
    max-width: 610px;
    line-height: 1.75
}

.why-skill-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

.why-skill-list div {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 78px;
    padding: 18px;
    color: #fff;
    background: #ffffff0d;
    border: 1px solid #ffffff1b;
    border-radius: 9px
}

.why-skill-list svg {
    width: 25px;
    color: var(--gold)
}

@media(max-width:900px) {

    .why-intro-grid,
    .why-outcomes-grid {
        grid-template-columns: 1fr
    }

    .why-reasons-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(max-width:620px) {

    .why-reasons-grid,
    .why-skill-list {
        grid-template-columns: 1fr
    }

    .why-intro-copy .why-lead {
        font-size: 17px
    }

    .why-promise-card {
        padding: 29px 23px
    }
}

.why-reasons-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.why-reasons-grid article>svg {
    width: 50px;
    height: 50px;
    padding: 13px
}

.why-reasons-grid h3 {
    font-size: 21px
}

.why-careers-section {
    background: radial-gradient(circle at 92% 15%, #c89a3d1a, transparent 28%), #fff
}

.why-careers-card {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    padding: clamp(32px, 4vw, 50px);
    background: #f7fafc;
    border: 1px solid #dce6eb;
    border-radius: 18px;
    box-shadow: 0 18px 50px #052e5212
}

.why-careers-icon {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    color: var(--gold);
    background: var(--navy);
    border-radius: 50%
}

.why-careers-icon svg {
    width: 32px;
    height: 32px
}

.why-careers-copy {
    max-width: 760px
}

.why-careers-copy>span {
    color: var(--gold);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase
}

.why-careers-copy h2 {
    color: var(--navy);
    margin: 7px 0 13px;
    font: clamp(30px, 3.5vw, 42px)/1.18 Georgia, serif
}

.why-careers-copy p {
    color: #607487;
    margin: 0 0 9px;
    line-height: 1.7
}

.why-careers-card>.button {
    white-space: nowrap
}

@media(max-width:1100px) {
    .why-reasons-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .why-careers-card {
        grid-template-columns: 72px 1fr
    }

    .why-careers-card>.button {
        grid-column: 2;
        justify-self: start
    }
}

@media(max-width:620px) {
    .why-reasons-grid {
        grid-template-columns: 1fr
    }

    .why-careers-card {
        grid-template-columns: 1fr;
        padding: 28px 22px
    }

    .why-careers-card>.button {
        grid-column: auto;
        width: 100%
    }
}

/* Why Sciencegate: vision page content refinements */
.why-reasons-section:not(.why-philosophy-section) .why-reasons-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.why-philosophy-section {
    background: radial-gradient(circle at 50% 15%, #c89a3d12, transparent 35%), #f5f8fa
}

.why-philosophy-section .section-heading {
    max-width: 820px
}

.why-philosophy-section .why-skill-list {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    margin: 36px auto 30px;
    max-width: 1180px
}

.why-philosophy-section .why-skill-list div {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    min-height: 128px;
    padding: 20px 12px;
    color: var(--navy);
    background: #fff;
    border: 1px solid #dce6eb;
    border-top: 3px solid var(--gold);
    box-shadow: 0 10px 28px #052e520c
}

.why-philosophy-section .why-skill-list svg {
    width: 29px;
    height: 29px
}

.why-philosophy-section .section-heading:last-child {
    margin-top: 0
}

.why-philosophy-section .section-heading:last-child p {
    font-size: 16px;
    line-height: 1.75
}

@media(max-width:1100px) {
    .why-reasons-section:not(.why-philosophy-section) .why-reasons-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .why-philosophy-section .why-skill-list {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@media(max-width:620px) {
    .why-reasons-section:not(.why-philosophy-section) .why-reasons-grid {
        grid-template-columns: 1fr
    }

    .why-philosophy-section .why-skill-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 26px
    }

    .why-philosophy-section .why-skill-list div {
        min-height: 108px
    }

    .why-outcomes-grid {
        gap: 34px
    }

    .why-careers-icon {
        width: 64px;
        height: 64px
    }
}

/* Site-wide visual consistency and responsive hardening */
html {
    overflow-x: clip;
    text-rendering: optimizeLegibility
}

body {
    overflow-x: clip;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.container {
    width: calc(100% - 2.5rem);
    max-width: 1180px
}

h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
    text-wrap: balance
}

p,
li,
label,
input,
textarea,
select {
    overflow-wrap: break-word
}

button,
.button,
.nav-cta,
input,
textarea,
select {
    font-family: inherit
}

svg[data-lucide] {
    flex: none;
    stroke-width: 1.9
}

.button svg,
.nav-cta svg {
    width: 19px;
    height: 19px
}

.menu-button svg {
    width: 27px;
    height: 27px
}

.topbar svg {
    width: 16px;
    height: 16px
}

.footer-socials a {
    width: 38px;
    height: 38px
}

.footer-socials svg {
    width: 17px;
    height: 17px
}

.footer-contact>a>svg {
    width: 40px;
    height: 40px
}

.card-grid>*,
.split>*,
.contact-grid>*,
.contact-main-grid>*,
.admission-layout>*,
.foundation-course-intro>*,
.why-intro-grid>*,
.why-outcomes-grid>*,
.footer-grid>*,
.course-learning-grid>*,
.method-grid>*,
.achievement-grid>*,
.gallery-grid>*,
.journey-grid>*,
.quote-grid>*,
.notice-layout>*,
.why-reasons-grid>* {
    min-width: 0;
    max-width: 100%
}

.card-body,
.contact-form-panel,
.contact-info-panel,
.admission-guide,
.course-learning-card,
.why-careers-copy {
    min-width: 0
}

.card-body h3,
.contact-panel-heading h2,
.contact-info-heading h2,
.admission-guide h2,
.footer-cta h2 {
    max-width: 100%;
    overflow-wrap: anywhere
}

.admission-guide {
    padding-inline: 46px
}

.admission-page-section .contact-form-panel {
    padding: 40px
}

.admission-page-section .contact-form-panel:before {
    content: "Secure enquiry \00B7  No obligation"
}

:where(a, button, input, textarea, select, summary):focus-visible {
    outline: 3px solid #c89a3d;
    outline-offset: 3px
}

@media(max-width:640px) {
    .container {
        width: calc(100% - 1.5rem);
        max-width: 1180px
    }

    .section-heading h2,
    .page-hero h1 {
        overflow-wrap: anywhere
    }

    .footer-cta {
        max-width: calc(100% - 1.5rem);
        margin-inline: auto
    }

    .admission-guide {
        padding: 30px 22px
    }

    .admission-page-section .contact-form-panel {
        padding: 28px 20px
    }

    .content-card,
    .form-card,
    .contact-form-panel,
    .contact-info-panel,
    .why-careers-card {
        max-width: 100%;
        overflow: hidden
    }
}

:root {
    --navy: #052e52;
    --navy2: #0a3d67;
    --gold: #c89a3d;
    --cream: #fbf6ea;
    --ink: #112337;
    --muted: #64748b;
    --line: #e5e7eb;
    color: var(--ink);
    background: #fff;
    font-family: Inter, ui-sans-serif, system-ui
}

* {
    box-sizing: border-box
}

body {
    margin: 0
}

a {
    color: inherit;
    text-decoration: none
}

.container {
    width: min(1180px, 100% - 2.5rem);
    margin: auto
}

.topbar {
    color: #d9e5ef;
    background: #03243f;
    font-size: 12px
}

.topbar-inner {
    align-items: center;
    gap: 28px;
    min-height: 38px;
    display: flex
}

.topbar span,
.footer p {
    align-items: center;
    gap: 8px;
    display: flex
}

.top-address {
    margin-left: auto
}

.header {
    z-index: 50;
    background: #fff;
    border-bottom: 1px solid #e8edf2;
    position: sticky;
    top: 0;
    box-shadow: 0 5px 20px #052e520d
}

.nav-wrap {
    justify-content: space-between;
    align-items: center;
    min-height: 88px;
    display: flex
}

.brand,
.footer-brand {
    align-items: center;
    gap: 12px;
    display: flex
}

.brand img {
    object-fit: contain;
    width: 66px;
    height: 66px
}

.brand span,
.footer-brand div {
    letter-spacing: .13em;
    flex-direction: column;
    display: flex
}

.brand strong {
    color: var(--navy);
    font-family: Georgia, serif;
    font-size: 20px
}

.brand small {
    color: var(--gold);
    font-size: 10px;
    font-weight: 800
}

.nav {
    color: #24384d;
    align-items: center;
    gap: 25px;
    font-size: 13px;
    font-weight: 700;
    display: flex
}

.nav>a:not(.nav-cta) {
    border-bottom: 3px solid #0000;
    padding: 35px 0
}

.nav>a.active:not(.nav-cta),
.nav>a:hover:not(.nav-cta) {
    color: var(--gold);
    border-color: var(--gold)
}

.nav-cta,
.button {
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    gap: 9px;
    font-weight: 800;
    display: inline-flex
}

.nav-cta {
    background: var(--navy);
    color: #fff;
    padding: 13px 17px
}

.menu-button {
    color: var(--navy);
    background: 0 0;
    border: 0;
    display: none
}

.hero {
    background: linear-gradient(112deg, #f8f3e7, #fff 55%, #e8f0f5);
    position: relative;
    overflow: hidden
}

.hero-grid {
    background-image: linear-gradient(#052e5208 1px, #0000 1px), linear-gradient(90deg, #052e5208 1px, #0000 1px);
    background-size: 45px 45px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-mask-image: linear-gradient(90deg, #000, #0000);
    mask-image: linear-gradient(90deg, #000, #0000)
}

.hero-inner {
    grid-template-columns: 1.2fr .8fr;
    align-items: center;
    gap: 50px;
    min-height: 650px;
    display: grid;
    position: relative
}

.pill {
    color: var(--navy);
    text-transform: uppercase;
    letter-spacing: .16em;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 900;
    display: inline-flex
}

.hero h1 {
    color: var(--navy);
    max-width: 800px;
    margin: 22px 0;
    font-family: Georgia, serif;
    font-size: clamp(44px, 5.2vw, 72px);
    line-height: 1.03
}

.hero h1 em {
    color: var(--gold);
    font-style: normal
}

.hero-copy>p {
    color: #526477;
    max-width: 680px;
    font-size: 18px;
    line-height: 1.75
}

.hero-actions {
    gap: 13px;
    margin: 32px 0;
    display: flex
}

.button {
    border: 1px solid #0000;
    padding: 15px 22px
}

.button.gold {
    background: var(--gold);
    color: #10283e
}

.button.outline {
    border-color: var(--navy);
    color: var(--navy)
}

.trust-row {
    text-transform: uppercase;
    letter-spacing: .08em;
    gap: 28px;
    font-size: 12px;
    display: flex
}

.trust-row b:before {
    content: "\2713";
    color: var(--gold);
    margin-right: 7px
}

.hero-visual {
    aspect-ratio: 1;
    place-items: center;
    width: min(440px, 100%);
    margin: auto;
    display: grid;
    position: relative
}

.hero-visual>img {
    filter: drop-shadow(0 25px 30px #052e5235);
    z-index: 2;
    width: 76%
}

.orbit {
    border: 1px solid #c89a3d77;
    border-radius: 50%;
    position: absolute
}

.orbit.one {
    top: 3%;
    right: 3%;
    bottom: 3%;
    left: 3%
}

.orbit.two {
    border-style: dashed;
    top: 13%;
    right: 13%;
    bottom: 13%;
    left: 13%
}

.float-card {
    z-index: 3;
    border-left: 4px solid var(--gold);
    background: #fff;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    display: flex;
    position: absolute;
    bottom: 9%;
    left: -3%;
    box-shadow: 0 12px 40px #052e5229
}

.float-card svg {
    color: var(--gold)
}

.float-card span {
    flex-direction: column;
    display: flex
}

.float-card small {
    color: var(--muted)
}

.stats {
    background: var(--navy);
    color: #fff
}

.stats-grid {
    grid-template-columns: repeat(4, 1fr);
    display: grid
}

.stats-grid div {
    border-right: 1px solid #ffffff20;
    align-items: center;
    gap: 16px;
    padding: 27px;
    display: flex
}

.stats strong {
    color: var(--gold);
    font-family: Georgia, serif;
    font-size: 30px
}

.stats span {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 12px;
    line-height: 1.4
}

.section {
    padding: 95px 0
}

.section.soft {
    background: #f4f7f8
}

.section.navy {
    background: var(--navy);
    color: #fff
}

.section-heading {
    max-width: 690px;
    margin-bottom: 15px
}

.section-heading.center {
    text-align: center;
    margin: 0 auto 45px
}

.section-heading>span {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .17em;
    font-size: 12px;
    font-weight: 900
}

.section-heading h2 {
    color: var(--navy);
    margin: 10px 0 14px;
    font-family: Georgia, serif;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 1.15
}

.navy .section-heading h2 {
    color: #fff
}

.section-heading p {
    color: var(--muted);
    line-height: 1.7
}

.card-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    display: grid
}

.content-card {
    border: 1px solid var(--line);
    background: #fff;
    transition: all .25s;
    overflow: hidden
}

.content-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 15px #052e5218
}

.card-art {
    background: linear-gradient(135deg, var(--navy), #0d527e);
    color: #fff2;
    justify-content: space-between;
    align-items: center;
    height: 150px;
    padding: 24px;
    display: flex
}

.card-art span {
    font-family: Georgia;
    font-size: 58px
}

.card-art svg {
    width: 60px;
    height: 60px;
    color: var(--gold)
}

.card-body {
    padding: 24px
}

.card-body small {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 10px;
    font-weight: 800
}

.card-body h3 {
    color: var(--navy);
    margin: 9px 0;
    font-family: Georgia, serif;
    font-size: 25px
}

.card-body p {
    color: var(--muted);
    line-height: 1.65
}

.card-body b {
    color: var(--navy);
    align-items: center;
    gap: 7px;
    font-size: 13px;
    display: flex
}

.split {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 80px;
    display: grid
}

.lab-panel {
    background: var(--navy);
    min-height: 480px;
    position: relative;
    overflow: hidden
}

.lab-icon {
    background: var(--gold);
    border-radius: 50%;
    place-items: center;
    width: 180px;
    height: 180px;
    display: grid;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%)
}

.lab-icon svg {
    width: 95px;
    height: 95px;
    color: var(--navy)
}

.formula,
.flask,
.atom-mark {
    color: #fff;
    position: absolute
}

.formula {
    font-family: Georgia;
    font-size: 35px;
    top: 14%;
    left: 11%
}

.flask {
    width: 70px;
    height: 70px;
    color: var(--gold);
    top: 12%;
    right: 12%
}

.atom-mark {
    bottom: 10%;
    right: 10%
}

.atom-mark svg {
    width: 95px;
    height: 95px
}

.feature {
    border-bottom: 1px solid #dbe3e8;
    gap: 18px;
    padding: 17px 0;
    display: flex
}

.feature>svg {
    color: var(--gold);
    background: #fff;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    padding: 11px
}

.feature h3 {
    color: var(--navy);
    margin: 0 0 5px
}

.feature p {
    color: var(--muted);
    margin: 0;
    line-height: 1.55
}

.navy .content-card {
    border: 0
}

.notice-layout {
    grid-template-columns: 1.5fr .7fr;
    gap: 70px;
    display: grid
}

.notice-list a {
    border-bottom: 1px solid var(--line);
    grid-template-columns: 50px 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 19px 0;
    display: grid
}

.notice-list>a>span {
    color: var(--gold);
    font-family: Georgia;
    font-size: 24px
}

.notice-list small {
    color: var(--muted)
}

.notice-list h3 {
    color: var(--navy);
    margin: 4px 0
}

.enquiry-card {
    background: var(--navy);
    color: #fff;
    align-self: start;
    padding: 40px
}

.enquiry-card>span {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: 11px;
    font-weight: 900
}

.enquiry-card h2 {
    font-family: Georgia;
    font-size: 34px
}

.enquiry-card p {
    color: #c8d6e1;
    line-height: 1.7
}

.quote-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    display: grid
}

.quote-grid article {
    border-top: 4px solid var(--gold);
    background: #fff;
    padding: 32px
}

.quote-grid svg {
    color: var(--gold)
}

.quote-grid p {
    color: #32465a;
    font-family: Georgia;
    font-size: 20px;
    line-height: 1.6
}

.quote-grid span {
    color: var(--gold);
    margin-top: 7px;
    display: block
}

.faq-list {
    max-width: 850px;
    margin: auto
}

.faq-list details {
    border-bottom: 1px solid var(--line);
    background: #fff;
    padding: 20px 4px
}

.faq-list summary {
    cursor: pointer;
    justify-content: space-between;
    font-weight: 800;
    display: flex
}

.faq-list p {
    color: var(--muted);
    line-height: 1.7
}

.page-hero {
    background: var(--navy);
    color: #fff;
    padding: 80px 0;
    position: relative;
    overflow: hidden
}

.page-hero:after {
    content: "ScienceGate";
    color: #ffffff08;
    font: 700 120px Georgia;
    position: absolute;
    top: 4px;
    right: -20px
}

.page-hero span {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .15em;
    font-size: 11px;
    font-weight: 900
}

.page-hero h1 {
    margin: 10px 0;
    font: 48px Georgia
}

.page-hero p {
    color: #c8d6e1;
    align-items: center;
    gap: 7px;
    display: flex
}

.article {
    max-width: 850px;
    font-size: 17px;
    line-height: 1.8
}

.article .lead {
    color: var(--navy);
    font-size: 22px
}

.article>.button {
    margin-top: 30px
}

.contact-grid {
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    display: grid
}

.contact-grid>div>p {
    color: var(--muted);
    align-items: center;
    gap: 10px;
    display: flex
}

.form-card {
    background: #f4f7f8;
    gap: 16px;
    padding: 32px;
    display: grid
}

.form-card label {
    gap: 7px;
    font-size: 13px;
    font-weight: 800;
    display: grid
}

.form-card input,
.form-card textarea {
    font: inherit;
    background: #fff;
    border: 1px solid #ccd6df;
    padding: 13px
}

.success {
    color: #176536;
    background: #dff6e7;
    padding: 12px
}

.state {
    padding: 100px 0
}

.error {
    color: #a61b1b
}

.footer {
    color: #c3d1dc;
    background: #031f36;
    padding: 75px 0 20px
}

.footer-grid {
    grid-template-columns: 1.5fr .7fr .9fr 1.1fr;
    gap: 55px;
    display: grid
}

.footer h3 {
    color: var(--gold);
    font-family: Georgia
}

.footer-grid>div>a {
    color: #c3d1dc;
    margin: 10px 0;
    display: block
}

.footer-brand img {
    width: 70px
}

.footer-brand b {
    color: #fff
}

.footer-brand span {
    color: var(--gold);
    letter-spacing: .16em;
    font-size: 11px
}

.footer p {
    line-height: 1.65
}

.copyright {
    border-top: 1px solid #ffffff18;
    justify-content: space-between;
    margin-top: 45px;
    padding-top: 20px;
    font-size: 12px;
    display: flex
}

@media(max-width:980px) {
    .menu-button {
        display: block
    }

    .nav {
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        padding: 20px;
        display: none;
        position: absolute;
        top: 88px;
        left: 0;
        right: 0;
        box-shadow: 0 20px 30px #052e5220
    }

    .nav.open {
        display: flex
    }

    .nav>a:not(.nav-cta) {
        padding: 10px
    }

    .hero-inner {
        grid-template-columns: 1fr;
        padding: 70px 0
    }

    .hero-visual {
        max-width: 380px
    }

    .stats-grid,
    .card-grid,
    .quote-grid {
        grid-template-columns: 1fr 1fr
    }

    .split,
    .notice-layout,
    .contact-grid {
        grid-template-columns: 1fr
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:640px) {
    .container {
        width: min(100% - 1.5rem, 1180px)
    }

    .topbar-inner {
        justify-content: center
    }

    .topbar-inner span:not(:first-child) {
        display: none
    }

    .nav-wrap {
        min-height: 74px
    }

    .brand img {
        width: 53px;
        height: 53px
    }

    .nav {
        top: 74px
    }

    .hero-inner {
        min-height: auto;
        padding: 55px 0
    }

    .hero h1 {
        font-size: 43px
    }

    .hero-visual {
        width: 300px
    }

    .trust-row {
        flex-direction: column;
        gap: 9px
    }

    .stats-grid,
    .card-grid,
    .quote-grid,
    .footer-grid {
        grid-template-columns: 1fr
    }

    .stats-grid div {
        border-bottom: 1px solid #ffffff20;
        border-right: 0
    }

    .section {
        padding: 65px 0
    }

    .split {
        gap: 45px
    }

    .lab-panel {
        min-height: 360px
    }

    .notice-layout {
        gap: 40px
    }

    .hero-actions {
        flex-direction: column
    }

    .page-hero {
        padding: 60px 0
    }

    .page-hero h1 {
        font-size: 38px
    }

    .copyright {
        flex-direction: column;
        gap: 15px
    }
}

.brand img,
.footer-brand img,
.hero-visual>img {
    border-radius: 50%
}

.admin-shell {
    background: #f1f5f9;
    grid-template-columns: 260px 1fr;
    min-height: 100vh;
    display: grid
}

.admin-sidebar {
    color: #d7e3ec;
    background: #042842;
    height: 100vh;
    padding: 24px 18px;
    position: sticky;
    top: 0;
    overflow: auto
}

.admin-brand {
    border-bottom: 1px solid #ffffff18;
    align-items: center;
    gap: 10px;
    padding: 0 8px 24px;
    display: flex
}

.admin-brand img {
    border-radius: 50%;
    width: 52px
}

.admin-brand span {
    flex-direction: column;
    display: flex
}

.admin-brand b {
    color: #fff;
    letter-spacing: .08em;
    font-size: 13px
}

.admin-brand small {
    color: var(--gold);
    letter-spacing: .14em;
    font-size: 8px
}

.admin-sidebar nav {
    gap: 3px;
    margin-top: 18px;
    display: grid
}

.admin-sidebar nav a {
    border-radius: 4px;
    padding: 10px 12px;
    font-size: 13px
}

.admin-sidebar nav a:hover {
    color: #fff;
    background: #ffffff12
}

.admin-sidebar h4 {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .16em;
    margin: 22px 12px 6px;
    font-size: 9px
}

.admin-main {
    min-width: 0
}

.admin-top {
    background: #fff;
    border-bottom: 1px solid #dce3e8;
    justify-content: space-between;
    align-items: center;
    height: 94px;
    padding: 18px 30px;
    display: flex
}

.admin-top small {
    color: #8a9aaa
}

.admin-top h1 {
    color: var(--navy);
    margin: 3px 0;
    font: 30px Georgia
}

.admin-user {
    align-items: center;
    gap: 15px;
    font-size: 13px;
    font-weight: 700;
    display: flex
}

.admin-user button {
    background: #fff;
    border: 1px solid #cbd5e1;
    padding: 8px 12px
}

.admin-content {
    padding: 30px
}

.admin-success {
    color: #166534;
    background: #dcfce7;
    margin-bottom: 18px;
    padding: 12px 16px
}

.admin-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    display: grid
}

.admin-stats article {
    border-left: 4px solid var(--gold);
    background: #fff;
    justify-content: space-between;
    align-items: center;
    padding: 24px;
    display: flex
}

.admin-stats span {
    color: #64748b;
    font-size: 13px
}

.admin-stats strong {
    color: var(--navy);
    font: 36px Georgia
}

.admin-welcome {
    background: #fff;
    max-width: 800px;
    margin-top: 22px;
    padding: 30px
}

.admin-welcome h2 {
    color: var(--navy);
    font: 28px Georgia
}

.admin-welcome p {
    color: #64748b;
    line-height: 1.7
}

.admin-welcome a {
    color: #9a7124;
    font-weight: 800
}

.admin-tools {
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 18px;
    display: flex
}

.admin-tools input {
    border: 1px solid #cbd5e1;
    width: min(420px, 60%);
    padding: 12px
}

.admin-tools button,
.admin-modal footer button:last-child {
    background: var(--navy);
    color: #fff;
    border: 0;
    padding: 12px 18px;
    font-weight: 800
}

.admin-table-wrap {
    background: #fff;
    overflow: auto
}

.admin-table {
    border-collapse: collapse;
    width: 100%;
    font-size: 13px
}

.admin-table th {
    text-align: left;
    color: #42566a;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: #eaf0f4;
    padding: 13px;
    font-size: 10px
}

.admin-table td {
    border-bottom: 1px solid #edf1f4;
    padding: 13px
}

.actions {
    white-space: nowrap
}

.actions button,
.status {
    color: #27445d;
    background: #e8eef3;
    border: 0;
    margin-right: 5px;
    padding: 6px 9px
}

.actions .danger {
    color: #991b1b;
    background: #fee2e2
}

.status.on {
    color: #166534;
    background: #dcfce7
}

.admin-pages {
    margin-top: 18px
}

.admin-modal {
    z-index: 100;
    background: #041e32aa;
    place-items: center;
    padding: 20px;
    display: grid;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.admin-modal>form {
    background: #fff;
    width: min(850px, 100%);
    max-height: 90vh;
    overflow: auto
}

.admin-modal header,
.admin-modal footer {
    border-bottom: 1px solid #e2e8f0;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    display: flex
}

.admin-modal header h2 {
    color: var(--navy);
    margin: 0;
    font: 26px Georgia
}

.admin-modal header button {
    background: 0 0;
    border: 0;
    font-size: 30px
}

.admin-modal footer {
    border-top: 1px solid #e2e8f0;
    border-bottom: 0;
    justify-content: flex-end;
    gap: 10px
}

.admin-modal footer button {
    padding: 10px 16px
}

.admin-form {
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    padding: 22px;
    display: grid
}

.admin-form label {
    gap: 7px;
    font-size: 12px;
    font-weight: 800;
    display: grid
}

.admin-form label.wide {
    grid-column: 1/-1
}

.admin-form input:not([type=checkbox]),
.admin-form textarea {
    font: inherit;
    border: 1px solid #cbd5e1;
    padding: 11px;
    font-weight: 400
}

.admin-form small {
    color: #b91c1c
}

.admin-form input[type=checkbox] {
    width: 20px;
    height: 20px
}

@media(max-width:800px) {
    .admin-shell {
        grid-template-columns: 1fr
    }

    .admin-sidebar {
        height: auto;
        position: static
    }

    .admin-sidebar nav {
        grid-template-columns: 1fr 1fr
    }

    .admin-main {
        min-width: 0
    }

    .admin-top,
    .admin-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .admin-stats,
    .admin-form {
        grid-template-columns: 1fr
    }

    .admin-form label.wide {
        grid-column: auto
    }
}

.about-emblem {
    background: var(--cream);
    place-items: center;
    min-height: 420px;
    display: grid
}

.about-emblem img {
    filter: drop-shadow(0 22px 28px #052e5233);
    border-radius: 50%;
    width: min(330px, 80%)
}

.about-emblem.about-certificate {
    background: linear-gradient(145deg, #f8f3e7, #edf4f7);
    padding: 28px
}

.about-emblem.about-certificate img {
    filter: none;
    border: 1px solid #d8dee3;
    border-radius: 2px;
    width: min(430px, 100%);
    box-shadow: 0 22px 45px #052e5226
}

.page-copy,
.dynamic-copy {
    color: #526477;
    white-space: pre-line;
    font-size: 17px;
    line-height: 1.85
}

.method-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    display: grid
}

.method-grid article {
    border-top: 4px solid var(--gold);
    background: #fff;
    padding: 28px
}

.method-grid article>span {
    color: #d8e0e7;
    font: 34px Georgia
}

.method-grid article>svg {
    color: var(--gold);
    margin: 18px 0;
    display: block
}

.method-grid h3 {
    color: var(--navy);
    margin: 0;
    font: 23px Georgia
}

.method-grid p {
    color: var(--muted);
    line-height: 1.6
}

.achievement-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    display: grid
}

.achievement-grid article {
    border: 1px solid var(--line);
    background: #fff;
    padding: 28px
}

.achievement-grid svg {
    color: var(--gold);
    width: 38px;
    height: 38px
}

.achievement-grid small {
    color: var(--muted);
    margin: 18px 0 7px;
    display: block
}

.achievement-grid h3 {
    color: var(--navy);
    margin: 0 0 7px;
    font: 24px Georgia
}

.achievement-grid strong {
    color: var(--gold)
}

.achievement-grid p {
    color: var(--muted);
    line-height: 1.55
}

.gallery-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    display: grid
}

.gallery-grid>a {
    border: 1px solid var(--line);
    background: #fff;
    overflow: hidden
}

.gallery-grid img {
    aspect-ratio: 4/3;
    object-fit: cover;
    background: var(--cream);
    width: 100%
}

.gallery-grid a>div {
    padding: 22px
}

.gallery-grid small {
    color: var(--gold);
    text-transform: uppercase;
    font-weight: 800
}

.gallery-grid h3 {
    color: var(--navy);
    margin: 8px 0;
    font: 24px Georgia
}

.gallery-grid p {
    color: var(--muted);
    line-height: 1.55
}

@media(max-width:900px) {

    .method-grid,
    .achievement-grid,
    .gallery-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:600px) {

    .method-grid,
    .achievement-grid,
    .gallery-grid {
        grid-template-columns: 1fr
    }

    .about-emblem.about-certificate {
        padding: 16px
    }
}

.frontend-loader {
    min-height: 560px;
    color: var(--navy);
    text-align: center;
    background: linear-gradient(135deg, #fbf6ea, #fff, #edf3f6);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex
}

.loader-emblem {
    place-items: center;
    width: 138px;
    height: 138px;
    margin-bottom: 22px;
    display: grid;
    position: relative
}

.loader-emblem img {
    object-fit: cover;
    z-index: 2;
    border-radius: 50%;
    width: 88px;
    height: 88px;
    animation: 1.8s ease-in-out infinite loader-pulse
}

.loader-orbit {
    border: 2px solid #0000;
    border-top-color: var(--gold);
    border-bottom-color: var(--navy);
    border-radius: 50%;
    animation: 1.4s linear infinite loader-spin;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.loader-orbit.orbit-b {
    border-top-color: var(--navy);
    border-bottom-color: var(--gold);
    animation-duration: 1s;
    animation-direction: reverse;
    top: 13px;
    right: 13px;
    bottom: 13px;
    left: 13px
}

.frontend-loader>strong {
    letter-spacing: .18em;
    font: 22px Georgia
}

.frontend-loader>small {
    color: var(--gold);
    letter-spacing: .32em;
    margin: 5px 0 14px;
    font-weight: 900
}

.frontend-loader p {
    color: var(--muted);
    font-size: 13px
}

.loader-dots {
    vertical-align: bottom;
    width: 18px;
    animation: 1.2s steps(4, end) infinite loader-dots;
    display: inline-block;
    overflow: hidden
}

@keyframes loader-spin {
    to {
        transform: rotate(360deg)
    }
}

@keyframes loader-pulse {
    50% {
        opacity: .85;
        transform: scale(.94)
    }
}

@keyframes loader-dots {
    0% {
        width: 0
    }

    to {
        width: 18px
    }
}

@media(prefers-reduced-motion:reduce) {

    .loader-emblem img,
    .loader-orbit,
    .loader-dots {
        animation: none
    }
}

.page-loader {
    z-index: 9999;
    min-height: 100vh;
    transition: opacity .35s, visibility .35s;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.page-loader.loaded {
    opacity: 0;
    visibility: hidden;
    pointer-events: none
}

.journey-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    display: grid
}

.journey-card,
.news-video-card {
    border: 1px solid var(--line);
    background: #fff;
    transition: all .25s;
    overflow: hidden
}

.journey-card:hover,
.news-video-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 44px #052e521b
}

.video-cover {
    aspect-ratio: 16/10;
    background: var(--navy);
    position: relative;
    overflow: hidden
}

.video-cover img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: all .35s
}

.journey-card:hover .video-cover img,
.news-video-card:hover .video-cover img {
    transform: scale(1.04)
}

.video-cover>span {
    background: var(--gold);
    width: 54px;
    height: 54px;
    color: var(--navy);
    border-radius: 50%;
    place-items: center;
    display: grid;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 8px 24px #0004
}

.video-cover>span svg {
    width: 22px
}

.journey-body,
.news-video-body {
    padding: 22px
}

.journey-body>small,
.news-video-body>small {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 10px;
    font-weight: 900
}

.journey-body h3,
.news-video-body h3 {
    color: var(--navy);
    margin: 8px 0;
    font: 24px Georgia
}

.journey-body p,
.news-video-body p {
    color: var(--muted);
    line-height: 1.55
}

.journey-body>div {
    border-top: 1px solid var(--line);
    justify-content: space-between;
    gap: 10px;
    padding-top: 15px;
    display: flex
}

.journey-body>div span {
    color: var(--gold)
}

.news-video-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    display: grid
}

.news-video-body>small {
    align-items: center;
    gap: 7px;
    display: flex
}

.news-video-body>small svg {
    width: 15px
}

.news-video-body>b {
    color: var(--navy);
    border-top: 1px solid var(--line);
    align-items: center;
    gap: 8px;
    padding-top: 16px;
    display: flex
}

.news-video-body>b svg {
    width: 16px
}

@media(max-width:1000px) {

    .journey-grid,
    .news-video-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:620px) {

    .journey-grid,
    .news-video-grid {
        grid-template-columns: 1fr
    }
}

.instructor-section {
    background: #fff
}

.instructor-grid {
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
    gap: 24px;
    max-width: 1080px;
    margin: auto;
    display: grid
}

.instructor-card {
    border: 1px solid var(--line);
    text-align: center;
    background: #fff;
    border-radius: 14px;
    overflow: hidden
}

.instructor-photo {
    aspect-ratio: 1.4;
    background: linear-gradient(145deg, #f7fbfc, #d9f3f1);
    overflow: hidden
}

.instructor-photo img {
    object-fit: cover;
    object-position: center top;
    width: 100%;
    height: 100%
}

.instructor-content {
    padding: 25px 22px 30px
}

.instructor-content small {
    color: #07549a;
    margin-bottom: 7px;
    font-size: 13px;
    display: block
}

.instructor-content h3 {
    color: var(--navy);
    margin: 0 0 12px;
    font: 700 22px Georgia, serif
}

.instructor-content p {
    color: var(--muted);
    margin: 0;
    font-size: 14px;
    line-height: 1.75
}

.instructor-section .section-heading {
    margin-bottom: 48px
}

@media(max-width:900px) {
    .instructor-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:620px) {
    .instructor-grid {
        grid-template-columns: 1fr
    }
}

.carousel-heading {
    justify-content: space-between;
    align-items: flex-end;
    gap: 25px;
    display: flex
}

.carousel-heading .section-heading {
    margin-bottom: 15px
}

.carousel-controls {
    flex: none;
    gap: 12px;
    margin-bottom: 15px;
    display: flex
}

.carousel-controls button {
    border: 1px solid var(--line);
    width: 52px;
    height: 52px;
    color: var(--navy);
    cursor: pointer;
    background: #fff;
    border-radius: 50%;
    place-items: center;
    transition: all .2s;
    display: grid
}

.carousel-controls button:hover {
    background: var(--gold);
    border-color: var(--gold)
}

.carousel-controls svg {
    width: 21px;
    height: 21px
}

.navy .carousel-controls button {
    border-color: #ffffff45
}

.carousel-track {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    display: flex;
    overflow-x: auto
}

.carousel-track::-webkit-scrollbar {
    display: none
}

.carousel-track>* {
    scroll-snap-align: start
}

.instructor-grid.carousel-track {
    max-width: none
}

.instructor-grid.carousel-track>.instructor-card,
.news-video-grid.carousel-track>.news-video-card {
    flex: 0 0 calc(38% - 12px)
}

.journey-grid.carousel-track>.journey-card {
    flex: 0 0 calc(25% - 16.5px)
}

@media(max-width:1000px) {

    .instructor-grid.carousel-track>.instructor-card,
    .news-video-grid.carousel-track>.news-video-card,
    .journey-grid.carousel-track>.journey-card {
        flex-basis: calc(50% - 12px)
    }
}

@media(max-width:620px) {
    .carousel-heading {
        align-items: flex-start
    }

    .carousel-heading .section-heading,
    .carousel-controls {
        margin-bottom: 28px
    }

    .carousel-controls button {
        width: 44px;
        height: 44px
    }

    .instructor-grid.carousel-track>.instructor-card,
    .news-video-grid.carousel-track>.news-video-card,
    .journey-grid.carousel-track>.journey-card {
        flex-basis: 100%
    }
}

.quote-grid.carousel-track>article {
    flex: 0 0 calc(33.3333% - 16px)
}

@media(max-width:1000px) {
    .quote-grid.carousel-track>article {
        flex-basis: calc(50% - 12px)
    }
}

@media(max-width:620px) {
    .quote-grid.carousel-track>article {
        flex-basis: 100%
    }
}

.section.navy {
    background: linear-gradient(135deg, #042842, #073b60 58%, #0a496d)
}

.journey-section {
    background: linear-gradient(#f8fbfd, #eef4f7)
}

.news-section.section.soft {
    background: linear-gradient(#fffaf0, #f7f0df)
}

.testimonials {
    background: linear-gradient(#edf5f7, #e4eef2)
}

.journey-card,
.news-video-card,
.quote-grid article {
    border-color: #d6e1e7;
    box-shadow: 0 8px 28px #052e520a
}

.journey-card {
    border-top: 3px solid #0b527b
}

.news-video-card {
    border-top: 3px solid var(--gold)
}

.testimonials .quote-grid article {
    border-top-color: #b58a35
}

.journey-section .carousel-controls button,
.news-section .carousel-controls button,
.testimonials .carousel-controls button {
    background: #fff;
    border-color: #cbd8df;
    box-shadow: 0 5px 16px #052e5210
}

.top-performers-section {
    background: linear-gradient(#f8fbfd, #edf4f7)
}

.performer-groups {
    gap: 65px;
    display: grid
}

.performer-group-title {
    border-bottom: 1px solid #cfdae1;
    align-items: center;
    gap: 15px;
    margin-bottom: 24px;
    padding-bottom: 15px;
    display: flex
}

.performer-group-title span {
    color: var(--gold);
    font: 28px Georgia, serif
}

.performer-group-title h2 {
    color: var(--navy);
    margin: 0;
    font: 34px Georgia, serif
}

.performer-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    gap: 20px;
    display: grid
}

.performer-card {
    text-align: center;
    background: #fff;
    border: 1px solid #d6e1e7;
    border-radius: 12px;
    flex-direction: column;
    height: 100%;
    transition: all .25s;
    display: flex;
    overflow: hidden;
    box-shadow: 0 8px 28px #052e520b
}

.performer-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 38px #052e5218
}

.performer-photo {
    aspect-ratio: 1;
    background: linear-gradient(145deg, #eff7f8, #dcefed);
    overflow: hidden
}

.performer-photo img {
    object-fit: cover;
    object-position: center top;
    width: 100%;
    height: 100%
}

.performer-content {
    flex-direction: column;
    flex: 1;
    align-items: center;
    padding: 20px;
    display: flex
}

.performer-content small {
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px
}

.performer-content h3 {
    color: var(--navy);
    margin: 7px 0;
    font: 22px Georgia, serif
}

.performer-content strong {
    color: #9a7124;
    display: block
}

.performer-content p {
    color: var(--muted);
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.6;
    display: -webkit-box;
    overflow: hidden
}

.empty-state {
    text-align: center;
    color: var(--muted)
}

@media(max-width:1100px) {
    .performer-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@media(max-width:700px) {
    .performer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@media(max-width:480px) {
    .performer-grid {
        grid-template-columns: 1fr
    }
}

@media(max-width:1200px) {
    .menu-button {
        display: block
    }

    .nav {
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        padding: 20px;
        display: none;
        position: absolute;
        top: 88px;
        left: 0;
        right: 0;
        box-shadow: 0 20px 30px #052e5220
    }

    .nav.open {
        display: flex
    }

    .nav>a:not(.nav-cta) {
        padding: 10px
    }
}

html {
    scroll-behavior: smooth
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    min-width: 320px;
    line-height: 1.5
}

main {
    min-height: 55vh
}

img {
    max-width: 100%
}

button,
input,
textarea,
select {
    font: inherit
}

button,
a {
    -webkit-tap-highlight-color: transparent
}

button {
    cursor: pointer
}

button:disabled {
    cursor: not-allowed;
    opacity: .45
}

a,
button,
input,
textarea,
summary {
    outline-offset: 4px
}

:focus-visible {
    outline-offset: 3px;
    outline: 3px solid #d7aa4c
}

.section-heading h2,
.page-hero h1 {
    text-wrap: balance
}

.section-heading p {
    text-wrap: pretty
}

.content-card,
.quote-grid article,
.gallery-grid>a,
.journey-card,
.news-video-card {
    border-radius: 12px
}

.content-card {
    flex-direction: column;
    height: 100%;
    display: flex
}

.card-body {
    flex-direction: column;
    flex: 1;
    display: flex
}

.card-body p {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.card-body b {
    margin-top: auto;
    padding-top: 12px
}

.card-grid {
    align-items: stretch
}

.button,
.nav-cta {
    transition: transform .2s, background .2s, color .2s, box-shadow .2s
}

.button:hover,
.nav-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px #052e5218
}

.detail-section {
    background: linear-gradient(#f8fbfd, #fff)
}

.detail-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 14px;
    padding: 45px;
    box-shadow: 0 14px 45px #052e520b
}

.detail-card>div {
    color: var(--muted)
}

.article {
    overflow-wrap: anywhere
}

.form-card {
    border: 1px solid #d7e1e7;
    border-radius: 14px;
    box-shadow: 0 16px 45px #052e520c
}

.form-card input,
.form-card textarea {
    border-radius: 7px;
    transition: border-color .2s, box-shadow .2s
}

.form-card input:focus,
.form-card textarea:focus {
    border-color: #0b527b;
    outline: 0;
    box-shadow: 0 0 0 3px #0b527b18
}

.form-card button:disabled {
    box-shadow: none;
    transform: none
}

.form-message {
    border-radius: 7px;
    padding: 12px 14px
}

.form-message.error {
    color: #991b1b;
    background: #feecec
}

.faq-list details {
    border: 1px solid var(--line);
    border-radius: 8px;
    margin-bottom: 8px;
    padding: 20px
}

.faq-list details[open] {
    box-shadow: 0 8px 25px #052e520a
}

.faq-list summary span {
    color: var(--gold);
    font-size: 20px
}

.empty-state {
    text-align: center;
    width: 100%;
    color: var(--muted);
    background: #fff;
    border: 1px dashed #bdccd5;
    border-radius: 12px;
    grid-column: 1/-1;
    padding: 45px 25px
}

.carousel-controls button:disabled:hover {
    border-color: var(--line);
    background: #fff
}

.performer-grid-all {
    align-items: stretch
}

.performer-category {
    color: #07517a;
    letter-spacing: .07em;
    text-transform: uppercase;
    background: #e8f1f5;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    min-height: 25px;
    margin-bottom: 9px;
    padding: 4px 9px;
    font-size: 10px;
    font-weight: 800;
    display: inline-flex
}

.footer-grid>div>a,
.copyright a {
    transition: color .2s
}

.footer-grid>div>a:hover,
.copyright a:hover {
    color: var(--gold)
}

.error-page {
    background: linear-gradient(135deg, #f8f3e7, #edf4f7);
    place-items: center;
    min-height: 65vh;
    display: grid
}

.error-page-content {
    text-align: center;
    max-width: 700px
}

.error-page-content>span {
    color: #052e5212;
    font: 900 clamp(80px, 16vw, 170px)/.8 Georgia, serif
}

.error-page h1 {
    color: var(--navy);
    margin: 25px 0 12px;
    font: clamp(35px, 5vw, 58px) Georgia, serif
}

.error-page p {
    color: var(--muted);
    margin-bottom: 28px
}

.admin-sidebar nav a,
.admin-table,
.admin-tools input,
.admin-modal>form {
    transition: all .2s
}

.admin-sidebar nav a:focus-visible {
    outline-color: var(--gold)
}

.admin-tools input,
.admin-form input:not([type=checkbox]),
.admin-form textarea {
    border-radius: 6px
}

.admin-tools input:focus,
.admin-form input:focus,
.admin-form textarea:focus {
    border-color: #0b527b;
    outline: 0;
    box-shadow: 0 0 0 3px #0b527b16
}

.admin-table-wrap,
.admin-welcome,
.admin-stats article,
.admin-modal>form {
    border-radius: 10px;
    box-shadow: 0 7px 25px #052e5208
}

.admin-table tbody tr:hover {
    background: #f8fafc
}

nav[role=navigation] {
    margin-top: 28px
}

nav[role=navigation] a,
nav[role=navigation] span {
    border-radius: 5px
}

@media(max-width:1200px) {
    .nav {
        z-index: 60;
        border-top: 1px solid var(--line);
        max-height: calc(100vh - 88px);
        overflow-y: auto
    }

    .nav.open {
        animation: .18s ease-out nav-reveal;
        display: flex
    }

    .nav-cta {
        margin-top: 5px
    }

    @keyframes nav-reveal {
        0% {
            opacity: 0;
            transform: translateY(-8px)
        }

        to {
            opacity: 1;
            transform: none
        }
    }
}

@media(max-width:760px) {
    .section {
        padding: 58px 0
    }

    .section-heading {
        margin-bottom: 30px
    }

    .section-heading.center {
        margin-bottom: 34px
    }

    .section-heading h2 {
        font-size: clamp(31px, 10vw, 40px)
    }

    .detail-card {
        padding: 26px 22px
    }

    .page-hero:after {
        font-size: 75px
    }

    .contact-grid {
        gap: 40px
    }

    .form-card {
        padding: 24px 18px
    }

    .performer-groups {
        gap: 45px
    }

    .admin-content {
        padding-top: 20px
    }

    .admin-tools {
        flex-direction: column;
        align-items: stretch
    }

    .admin-tools input {
        width: 100%
    }

    .admin-tools button {
        align-self: flex-start
    }
}

.contact-page-section {
    background: linear-gradient(#f7fafc, #fff)
}

.contact-intro {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 48px
}

.contact-intro>span,
.contact-panel-heading>span,
.contact-location-heading span,
.contact-info-heading>span {
    color: var(--gold);
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.contact-intro h2,
.contact-panel-heading h2,
.contact-location-heading h2,
.contact-info-heading h2 {
    color: var(--navy);
    font-family: Georgia, serif
}

.contact-intro h2 {
    margin: 10px 0 14px;
    font-size: clamp(34px, 4vw, 48px)
}

.contact-intro p,
.contact-panel-heading p,
.contact-location-heading p {
    color: var(--muted);
    line-height: 1.75
}

.contact-main-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(330px, .88fr);
    align-items: stretch;
    gap: 32px;
    display: grid
}

.contact-form-panel {
    background: #fff;
    border: 1px solid #dce6eb;
    border-radius: 16px;
    padding: 40px;
    box-shadow: 0 20px 55px #052e520d
}

.contact-panel-heading {
    margin-bottom: 28px
}

.contact-panel-heading h2 {
    margin: 7px 0 5px;
    font-size: 34px
}

.contact-panel-heading p {
    margin: 0
}

.contact-form-panel .form-card {
    box-shadow: none;
    background: 0 0;
    border: 0;
    border-radius: 0;
    padding: 0
}

.contact-form-panel .form-card input,
.contact-form-panel .form-card textarea {
    background: #fbfdfe;
    padding: 14px 15px
}

.contact-form-panel .form-card textarea {
    resize: vertical;
    min-height: 135px
}

.contact-form-panel .form-card .button {
    justify-self: start;
    min-width: 170px
}

.contact-info-panel {
    color: #fff;
    background: linear-gradient(145deg, #032943, #075078);
    border-radius: 16px;
    padding: 15px 38px;
    box-shadow: 0 22px 55px #052e5225
}

.contact-info-heading {
    border-bottom: 1px solid #ffffff20;
    padding-bottom: 22px
}

.contact-info-heading h2 {
    color: #fff;
    margin: 8px 0 10px;
    font-size: 32px
}

.contact-info-heading p {
    color: #c9dbe6;
    margin: 0;
    line-height: 1.65
}

.contact-info-card {
    border-bottom: 1px solid #ffffff1d;
    grid-template-columns: 48px 1fr;
    align-items: start;
    gap: 16px;
    padding: 23px 0;
    display: grid
}

.contact-info-card:last-child {
    border-bottom: 0;
    padding-bottom: 0
}

.contact-info-icon {
    width: 48px;
    height: 48px;
    color: var(--gold);
    background: #ffffff12;
    border-radius: 50%;
    place-items: center;
    display: grid
}

.contact-info-card small {
    color: #a9c1d1;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-size: 10px;
    font-weight: 800;
    display: block
}

.contact-info-card p,
.contact-info-card a {
    color: #fff;
    overflow-wrap: anywhere;
    margin: 0;
    line-height: 1.6;
    display: block
}

.contact-info-card a:hover {
    color: #f0c86f
}

.contact-location-section {
    background: #fff;
    padding-top: 82px
}

.contact-location-heading {
    justify-content: space-between;
    align-items: end;
    gap: 30px;
    margin-bottom: 28px;
    display: flex
}

.contact-location-heading h2 {
    margin: 8px 0 0;
    font-size: clamp(32px, 4vw, 44px)
}

.contact-location-heading p {
    max-width: 390px;
    margin: 0
}

.contact-map-wrap {
    border: 1px solid #d7e2e8;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 50px #052e5212
}

.contact-map-wrap iframe {
    border: 0;
    width: 100%;
    height: 430px;
    display: block
}

.contact-branch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin-top: 28px;
    display: grid
}

.contact-branch-card {
    background: #fff;
    border: 1px solid #dce5ea;
    border-radius: 12px;
    grid-template-columns: 15px 1fr;
    gap: 17px;
    padding: 26px;
    display: grid
}

.contact-branch-card>svg {
    color: var(--gold)
}

.contact-branch-card small {
    color: var(--gold);
    letter-spacing: .12em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 900
}

.contact-branch-card h3 {
    color: var(--navy);
    margin: 4px 0 7px;
    font: 24px Georgia, serif
}

.contact-branch-card p {
    color: var(--muted);
    margin: 0 0 8px;
    line-height: 1.6
}

.contact-branch-card a {
    color: var(--navy);
    font-weight: 700;
    display: block
}

.contact-branch-card .branch-map-link {
    color: #986e1e;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    font-size: 13px;
    display: inline-flex
}

.contact-branch-card .branch-map-link svg {
    width: 16px
}

@media(max-width:900px) {
    .contact-main-grid {
        grid-template-columns: 1fr
    }

    .contact-info-panel {
        padding: 36px
    }

    .contact-branch-grid {
        grid-template-columns: 1fr
    }
}

@media(max-width:620px) {

    .contact-form-panel,
    .contact-info-panel {
        padding: 27px 21px
    }

    .contact-location-heading {
        display: block
    }

    .contact-location-heading p {
        margin-top: 12px
    }

    .contact-map-wrap iframe {
        height: 340px
    }

    .contact-branch-card {
        padding: 22px 18px
    }

    .contact-form-panel .form-card .button {
        width: 100%
    }
}

.admin-menu-settings {
    background: #fff;
    border-radius: 10px;
    grid-template-columns: minmax(250px, .75fr) minmax(420px, 1.25fr);
    gap: 32px;
    margin-bottom: 24px;
    padding: 28px;
    display: grid;
    box-shadow: 0 7px 25px #052e5208
}

.admin-menu-settings small {
    color: var(--gold);
    letter-spacing: .13em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 900
}

.admin-menu-settings h2 {
    color: var(--navy);
    margin: 6px 0 8px;
    font: 26px Georgia, serif
}

.admin-menu-settings p {
    color: var(--muted);
    margin: 0;
    line-height: 1.6
}

.admin-menu-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    display: grid
}

.admin-menu-checks label {
    color: #30475a;
    cursor: pointer;
    background: #f8fafc;
    border: 1px solid #dce4e9;
    border-radius: 7px;
    align-items: center;
    gap: 11px;
    min-height: 45px;
    padding: 10px 13px;
    font-size: 13px;
    font-weight: 700;
    display: flex
}

.admin-menu-checks input {
    width: 19px;
    height: 19px;
    accent-color: var(--navy)
}

@media(max-width:900px) {
    .admin-menu-settings {
        grid-template-columns: 1fr
    }

    .admin-menu-checks {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:600px) {
    .admin-menu-checks {
        grid-template-columns: 1fr
    }
}

.admission-page-section {
    background: radial-gradient(circle at 8% 10%, #c89a3d12 0, #0000 28%), linear-gradient(145deg, #f7fafc, #eef4f7)
}

.admission-layout {
    grid-template-columns: minmax(0, .9fr) minmax(480px, 1.1fr);
    align-items: stretch;
    gap: 34px;
    display: grid
}

.admission-guide {
    color: #fff;
    background: linear-gradient(145deg, #032943, #075078);
    border-radius: 18px;
    padding: 46px 15px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 60px #052e5228
}

.admission-guide:after {
    content: "";
    border: 1px solid #ffffff17;
    border-radius: 50%;
    width: 280px;
    height: 280px;
    position: absolute;
    bottom: -110px;
    right: -100px;
    box-shadow: 0 0 0 35px #ffffff08, 0 0 0 70px #ffffff05
}

.admission-eyebrow {
    z-index: 1;
    color: #e1b85e;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900;
    position: relative
}

.admission-guide>h2 {
    z-index: 1;
    margin: 11px 0 15px;
    font: clamp(34px, 4vw, 47px)/1.14 Georgia, serif;
    position: relative
}

.admission-lead {
    z-index: 1;
    color: #c9dbe6;
    margin: 0;
    line-height: 1.75;
    position: relative
}

.admission-benefits {
    z-index: 1;
    gap: 5px;
    margin: 30px 0;
    display: grid;
    position: relative
}

.admission-benefits article {
    border-top: 1px solid #ffffff1c;
    grid-template-columns: 46px 1fr;
    gap: 15px;
    padding: 17px 0;
    display: grid
}

.admission-benefits article>svg {
    width: 46px;
    height: 46px;
    color: var(--gold);
    background: #ffffff10;
    border-radius: 50%;
    padding: 11px
}

.admission-benefits h3 {
    margin: 0 0 4px;
    font-size: 15px
}

.admission-benefits p {
    color: #bcd0dc;
    margin: 0;
    font-size: 13px;
    line-height: 1.55
}

.admission-contact {
    z-index: 1;
    background: #ffffff0d;
    border: 1px solid #ffffff18;
    border-radius: 10px;
    padding: 20px;
    position: relative
}

.admission-contact small,
.admission-contact span {
    color: #b9cfdb;
    display: block
}

.admission-contact a {
    color: #fff;
    align-items: center;
    gap: 9px;
    margin: 6px 0;
    font-size: 20px;
    font-weight: 800;
    display: flex
}

.admission-contact a svg {
    width: 19px;
    color: var(--gold)
}

.admission-form-heading h2 {
    font-size: 38px
}

.admission-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px
}

.admission-form .form-message,
.admission-form .form-wide,
.admission-form button {
    grid-column: 1/-1
}

.admission-form select {
    width: 100%;
    color: var(--ink);
    background: #fbfdfe;
    border: 1px solid #ccd6df;
    border-radius: 7px;
    padding: 14px 15px;
    transition: border-color .2s, box-shadow .2s
}

.admission-form select:focus {
    border-color: #0b527b;
    outline: 0;
    box-shadow: 0 0 0 3px #0b527b18
}

.admission-form textarea {
    min-height: 125px
}

.admission-form button {
    width: 100%;
    margin-top: 2px
}

.admission-page-section .contact-form-panel {
    padding: 15px
}

.admission-page-section .contact-form-panel:before {
    content: "Secure enquiry · No obligation";
    color: #607487;
    letter-spacing: .08em;
    text-align: right;
    text-transform: uppercase;
    border-bottom: 1px solid #e5ebef;
    margin-bottom: 20px;
    padding-bottom: 14px;
    font-size: 11px;
    font-weight: 800;
    display: block
}

@media(max-width:980px) {
    .admission-layout {
        grid-template-columns: 1fr
    }

    .admission-guide {
        padding: 38px
    }
}

@media(max-width:620px) {
    .admission-guide {
        padding: 30px 22px
    }

    .admission-page-section .contact-form-panel {
        padding: 28px 20px
    }

    .admission-form {
        grid-template-columns: 1fr
    }

    .admission-form .form-message,
    .admission-form .form-wide,
    .admission-form button {
        grid-column: auto
    }

    .admission-form-heading h2 {
        font-size: 32px
    }
}

.footer {
    color: #bdd0dc;
    background: linear-gradient(145deg, #021c30, #043452 65%, #063e5e);
    padding: 0 0 22px;
    position: relative
}

.footer:before {
    content: "";
    pointer-events: none;
    background-image: linear-gradient(#ffffff06 1px, #0000 1px), linear-gradient(90deg, #ffffff06 1px, #0000 1px);
    background-size: 50px 50px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-mask-image: linear-gradient(#000, #0000 70%);
    mask-image: linear-gradient(#000, #0000 70%)
}

.footer>.container {
    position: relative
}

.footer-cta {
    color: #102b41;
    background: linear-gradient(115deg, #c39438, #e2b95e);
    justify-content: space-between;
    align-items: center;
    gap: 36px;
    padding: 34px 38px;
    display: flex;
    top: -1px;
    box-shadow: 0 18px 45px #00152244
}

.footer-cta>div {
    max-width: 730px
}

.footer-cta span {
    letter-spacing: .15em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 900
}

.footer-cta h2 {
    margin: 5px 0;
    font: clamp(28px, 3vw, 38px) Georgia, serif
}

.footer-cta p {
    color: #30475a;
    margin: 0;
    display: block
}

.footer-cta .button {
    color: #fff;
    background: #052e52;
    flex: none
}

.footer-grid {
    grid-template-columns: 1.35fr .68fr .85fr 1.2fr;
    gap: 58px;
    padding-top: 72px
}

.footer-brand {
    width: max-content
}

.footer-brand img {
    border: 3px solid #ffffff17;
    width: 72px;
    height: 72px
}

.footer-brand b {
    letter-spacing: .13em;
    font-size: 16px
}

.footer-brand span {
    margin-top: 3px
}

.footer-about>p {
    color: #aebfca;
    max-width: 330px;
    margin: 22px 0;
    line-height: 1.75;
    display: block
}

.footer h3 {
    color: #fff;
    margin: 0 0 24px;
    font: 21px Georgia, serif
}

.footer h3:after {
    content: "";
    background: var(--gold);
    width: 34px;
    height: 2px;
    margin-top: 10px;
    display: block
}

.footer-links>a {
    color: #bdccd6;
    margin: 0;
    padding: 7px 0 7px 15px;
    display: block;
    position: relative
}

.footer-links>a:before {
    content: "";
    background: #a97d2d;
    border-radius: 50%;
    width: 5px;
    height: 5px;
    position: absolute;
    top: 15px;
    left: 0
}

.footer-links>a:hover {
    color: #fff;
    padding-left: 19px
}

.footer-socials {
    gap: 10px;
    display: flex
}

.footer-socials a {
    color: #fff;
    background: #ffffff09;
    border: 1px solid #fff2;
    border-radius: 50%;
    place-items: center;
    width: 15px;
    height: 15px;
    transition: all .2s;
    display: grid
}

.footer-socials a:hover {
    border-color: var(--gold);
    background: var(--gold);
    color: #092d47;
    transform: translateY(-3px)
}

.footer-socials svg {
    width: 18px;
    height: 18px
}

.footer-contact>a {
    color: #d4e0e7;
    overflow-wrap: anywhere;
    grid-template-columns: 38px 1fr;
    align-items: start;
    gap: 12px;
    margin-bottom: 20px;
    line-height: 1.55;
    display: grid
}

.footer-contact>a>svg {
    width: 38px;
    height: 38px;
    color: var(--gold);
    background: #ffffff0c;
    border-radius: 50%;
    padding: 9px
}

.footer-contact small {
    color: #8fa9b9;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 2px;
    font-size: 9px;
    font-weight: 900;
    display: block
}

.footer-contact a:hover {
    color: #fff
}

.copyright {
    color: #91a9b7;
    align-items: center;
    margin-top: 55px;
    padding-top: 23px
}

.copyright>span:last-child {
    align-items: center;
    gap: 13px;
    display: flex
}

.copyright i {
    background: var(--gold);
    border-radius: 50%;
    width: 3px;
    height: 3px;
    display: block
}

@media(max-width:980px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr
    }

    .footer-cta {
        margin-inline: 1.25rem
    }
}

@media(max-width:640px) {
    .footer-cta {
        margin-inline: .75rem;
        padding: 28px 23px;
        display: block
    }

    .footer-cta .button {
        width: 100%;
        margin-top: 20px
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 38px;
        padding-top: 55px
    }

    .footer-about>p {
        max-width: none
    }

    .copyright>span:last-child {
        flex-wrap: wrap
    }

    .copyright i {
        display: none
    }
}

.footer-grid-no-learning {
    grid-template-columns: 1.35fr .8fr 1.2fr
}

.nav-dropdown {
    align-self: stretch;
    align-items: center;
    display: flex;
    position: relative
}

.nav-dropdown-trigger {
    border-bottom: 3px solid #0000;
    align-items: center;
    height: 100%;
    display: flex
}

.nav-dropdown-trigger>a {
    align-items: center;
    height: 100%;
    display: flex
}

.nav-dropdown-trigger button {
    color: inherit;
    background: 0 0;
    border: 0;
    place-items: center;
    padding: 5px 0 5px 4px;
    display: grid
}

.nav-dropdown-trigger button svg {
    width: 15px;
    height: 15px;
    transition: transform .2s
}

.nav-dropdown.active .nav-dropdown-trigger,
.nav-dropdown:hover .nav-dropdown-trigger,
.nav-dropdown:focus-within .nav-dropdown-trigger {
    color: var(--gold);
    border-color: var(--gold)
}

.nav-submenu {
    z-index: 60;
    border: 1px solid #dfe7ec;
    border-top: 3px solid var(--gold);
    opacity: 0;
    visibility: hidden;
    background: #fff;
    border-radius: 0 0 10px 10px;
    width: 260px;
    padding: 10px;
    transition: all .2s;
    position: absolute;
    top: calc(100% - 1px);
    left: -20px;
    transform: translateY(8px);
    box-shadow: 0 18px 38px #052e5224
}

.nav-dropdown:hover .nav-submenu,
.nav-dropdown:focus-within .nav-submenu,
.nav-dropdown.open .nav-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.nav-dropdown.open .nav-dropdown-trigger button svg {
    transform: rotate(180deg)
}

.nav-submenu a {
    color: #30475a;
    border-radius: 6px;
    padding: 11px 13px;
    line-height: 1.35;
    display: block
}

.nav-submenu a:first-child {
    color: #926918;
    font-weight: 900
}

.nav-submenu a:hover,
.nav-submenu a:focus-visible {
    color: var(--navy);
    background: #f4f7f8
}

@media(max-width:980px) {
    .nav-dropdown {
        width: 100%;
        display: block
    }

    .nav-dropdown-trigger {
        border: 0;
        justify-content: space-between;
        height: auto
    }

    .nav-dropdown-trigger>a {
        flex: 1;
        padding: 10px
    }

    .nav-dropdown-trigger button {
        width: 44px;
        height: 44px
    }

    .nav-submenu {
        border: 0;
        border-left: 2px solid var(--gold);
        width: auto;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        border-radius: 0;
        margin: 0 0 8px 14px;
        padding: 5px;
        display: none;
        position: static;
        transform: none
    }

    .nav-dropdown.open .nav-submenu {
        display: block
    }

    .nav-dropdown:hover:not(.open) .nav-submenu {
        display: none
    }

    .nav-dropdown.open .nav-dropdown-trigger {
        color: var(--gold)
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    .nav.open {
        animation: none
    }

    .content-card,
    .button,
    .nav-cta,
    .performer-card {
        transition: none
    }
}

.footer-grid .footer-contact>a {
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    display: grid
}

.scroll-to-top {
    z-index: 45;
    background: var(--gold);
    width: 48px;
    height: 48px;
    color: var(--navy);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    border: 1px solid #ffffff30;
    border-radius: 50%;
    place-items: center;
    padding: 0;
    transition: opacity .2s, transform .2s, visibility .2s, background .2s;
    display: grid;
    position: fixed;
    bottom: 24px;
    right: 24px;
    transform: translateY(14px);
    box-shadow: 0 10px 28px #00152255
}

.scroll-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.scroll-to-top:hover {
    background: #e2b95e
}

.scroll-to-top:focus-visible {
    outline-offset: 3px;
    outline: 3px solid #fff
}

.scroll-to-top svg {
    stroke-width: 2.5px;
    width: 22px;
    height: 22px
}

@media(max-width:640px) {
    .scroll-to-top {
        width: 44px;
        height: 44px;
        bottom: 16px;
        right: 16px
    }
}

@media(prefers-reduced-motion:reduce) {
    .scroll-to-top {
        transition: none
    }
}

.lab-panel.certificate-panel {
    background: linear-gradient(145deg, #f8f3e7, #edf4f7);
    place-items: center;
    padding: 28px;
    display: grid
}

.certificate-panel>img {
    border: 1px solid #d8dee3;
    width: auto;
    max-width: 100%;
    max-height: 560px;
    display: block;
    box-shadow: 0 22px 45px #052e5226
}

@media(max-width:640px) {
    .lab-panel.certificate-panel {
        padding: 16px
    }

    .certificate-panel>img {
        max-height: none
    }
}

.dynamic-page-section {
    background: linear-gradient(#f7fafc 0, #fff)
}

.article.dynamic-page-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 14px;
    width: min(1180px, 100% - 2.5rem);
    max-width: 1180px;
    margin-inline: auto;
    padding: clamp(30px, 4vw, 52px);
    box-shadow: 0 14px 45px #052e520b
}

.dynamic-page-eyebrow {
    color: var(--gold);
    letter-spacing: .15em;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-size: 11px;
    font-weight: 900;
    display: block
}

.dynamic-page-card .lead {
    max-width: 900px;
    color: var(--navy);
    margin: 0 0 24px;
    font: clamp(21px, 2.4vw, 28px)/1.5 Georgia, serif
}

.dynamic-copy {
    color: #526477;
    overflow-wrap: anywhere;
    white-space: pre-line;
    max-width: none;
    font-size: 16px;
    line-height: 1.85
}

.dynamic-copy>:first-child {
    margin-top: 0
}

.dynamic-copy>:last-child {
    margin-bottom: 0
}

.dynamic-copy h2,
.dynamic-copy h3,
.dynamic-copy h4 {
    color: var(--navy);
    font-family: Georgia, serif;
    line-height: 1.3
}

.dynamic-copy h2 {
    margin: 32px 0 12px;
    font-size: 30px
}

.dynamic-copy h3 {
    margin: 26px 0 10px;
    font-size: 23px
}

.dynamic-copy p {
    margin: 0 0 18px
}

.dynamic-copy ul,
.dynamic-copy ol {
    padding-left: 24px
}

.dynamic-copy li {
    margin-bottom: 8px
}

.dynamic-copy a {
    color: #08628f;
    text-underline-offset: 3px;
    text-decoration: underline
}

.dynamic-copy img {
    border-radius: 10px;
    height: auto
}

.dynamic-copy table {
    border-collapse: collapse;
    width: 100%;
    display: block;
    overflow-x: auto
}

.dynamic-copy th,
.dynamic-copy td {
    border: 1px solid var(--line);
    text-align: left;
    min-width: 140px;
    padding: 12px
}

.dynamic-copy th {
    color: var(--navy);
    background: #eef4f7
}

.detail-card .detail-action {
    margin-top: 32px
}

@media(max-width:760px) {
    .article.dynamic-page-card {
        width: min(100% - 2rem, 1180px);
        padding: 26px 20px
    }

    .dynamic-copy {
        font-size: 15px;
        line-height: 1.75
    }

    .dynamic-copy h2 {
        font-size: 25px
    }

    .dynamic-copy h3 {
        font-size: 21px
    }

    .detail-card .detail-action {
        white-space: normal;
        text-align: center;
        width: 100%;
        display: flex
    }
}

@media(max-width:420px) {
    .article.dynamic-page-card {
        width: min(100% - 1.25rem, 1180px);
        padding: 22px 16px
    }

    .dynamic-page-eyebrow {
        letter-spacing: .11em;
        font-size: 10px
    }

    .dynamic-page-card .lead {
        font-size: 20px
    }
}

/* Final shared overrides: kept last to normalize all page modules. */
.container {
    width: calc(100% - 2.5rem);
    max-width: 1180px
}

svg[data-lucide] {
    flex: none;
    stroke-width: 1.9
}

.button svg,
.nav-cta svg {
    width: 19px;
    height: 19px
}

.menu-button svg {
    width: 27px;
    height: 27px
}

.topbar svg {
    width: 16px;
    height: 16px
}

.footer-socials a {
    width: 38px;
    height: 38px
}

.footer-socials svg {
    width: 17px;
    height: 17px
}

.footer-contact>a>svg {
    width: 40px;
    height: 40px
}

.admission-guide {
    padding-inline: 46px
}

.admission-page-section .contact-form-panel {
    padding: 40px
}

.admission-page-section .contact-form-panel:before {
    content: "Secure enquiry \00B7  No obligation"
}

@media(max-width:640px) {
    .container {
        width: calc(100% - 1.5rem);
        max-width: 1180px
    }

    .footer-cta {
        max-width: calc(100% - 1.5rem);
        margin-inline: auto
    }

    .admission-guide {
        padding: 30px 22px
    }

    .admission-page-section .contact-form-panel {
        padding: 28px 20px
    }
}

/* Keep the desktop navigation visible while the page scrolls. */
@media(min-width:981px) {
    .header {
        position: sticky;
        top: 0;
        z-index: 1000;
        width: 100%;
        background: #fff;
        box-shadow: 0 7px 24px #052e5217;
    }
}

/* Homepage founder profile */
.founder-profile-section {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 8% 15%, #c89a3d1c 0, transparent 28%), radial-gradient(circle at 92% 85%, #08727812 0, transparent 30%), linear-gradient(135deg, #f8f3e8 0, #f7fafc 48%, #edf4f6 100%);
}
.founder-profile-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient(#052e5205 1px, transparent 1px), linear-gradient(90deg, #052e5205 1px, transparent 1px);
    background-size: 48px 48px;
    -webkit-mask-image: linear-gradient(90deg, #000 0, transparent 65%);
    mask-image: linear-gradient(90deg, #000 0, transparent 65%);
}
.founder-profile-section .split {
    position: relative;
    z-index: 1;
    grid-template-columns: minmax(320px, .88fr) minmax(0, 1.12fr);
    gap: clamp(38px, 6vw, 78px);
}
.founder-profile-section .instructor-photo {
    aspect-ratio: 4/4.65;
    min-height: 0;
    border: 8px solid #fff;
    border-radius: 22px;
    position: relative;
    box-shadow: 0 26px 65px #052e5230;
}
.founder-profile-section .instructor-photo::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 28%;
    pointer-events: none;
    background: linear-gradient(transparent, #052e5245);
}
.founder-profile-section .instructor-photo img {
    object-position: center 18%;
    transition: transform .45s ease;
}
.founder-profile-section .instructor-photo:hover img { transform: scale(1.025); }
.founder-profile-section .split>div:last-child {
    min-width: 0;
    padding: clamp(30px, 4vw, 50px);
    background: #ffffffd9;
    border: 1px solid #dce6eb;
    border-left: 5px solid var(--gold);
    border-radius: 16px;
    box-shadow: 0 20px 55px #052e5214;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.founder-profile-section .section-heading { max-width: 680px; margin-bottom: 22px; }
.founder-profile-section .section-heading h2 { font-size: clamp(36px, 4.2vw, 54px); }
.founder-profile-section .section-heading p { font-size: 17px; line-height: 1.75; }
.founder-profile-section .page-copy { color: #53697b; white-space: normal; font-size: 16px; line-height: 1.85; }
.founder-profile-section .button { margin-top: 28px; box-shadow: 0 12px 28px #c89a3d2b; }
@media(max-width:980px) {
    .founder-profile-section .split { grid-template-columns: 1fr; max-width: 760px; }
    .founder-profile-section .instructor-photo { aspect-ratio: 4/3.7; max-height: 660px; }
}
@media(max-width:640px) {
    .founder-profile-section .split { gap: 24px; }
    .founder-profile-section .instructor-photo { aspect-ratio: 4/4.35; border-width: 5px; border-radius: 15px; }
    .founder-profile-section .split>div:last-child { padding: 27px 21px; border-left-width: 4px; }
    .founder-profile-section .section-heading h2 { font-size: 34px; }
    .founder-profile-section .section-heading p { font-size: 16px; }
    .founder-profile-section .button { width: 100%; }
}
@media(prefers-reduced-motion:reduce) { .founder-profile-section .instructor-photo img { transition: none; } }

/* Faculty opportunity card actions */
.news-video-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: auto;
    padding-top: 20px;
}
.news-video-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 42px;
    padding: 10px 13px;
    color: #fff;
    background: var(--navy);
    border: 1px solid var(--navy);
    border-radius: 5px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.25;
    transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.news-video-actions a.whatsapp-action {
    color: #fff;
    background: #167c4b;
    border-color: #167c4b;
}
.news-video-actions a:hover { color: #fff; background: #0a456f; transform: translateY(-2px); }
.news-video-actions a.whatsapp-action:hover { background: #11633c; border-color: #11633c; }
.news-video-actions svg { width: 17px; height: 17px; }
.news-video-card .news-video-body { display: flex; flex-direction: column; }
@media(max-width:480px) {
    .news-video-actions { flex-direction: column; }
    .news-video-actions a { width: 100%; }
}

/* Rich policy and dynamic-page lists */
.dynamic-copy ul { list-style: disc; }
.dynamic-copy ol { list-style: decimal; }
.dynamic-copy ul,
.dynamic-copy ol { margin: 0 0 22px; padding-left: 25px; }
.dynamic-copy li { padding-left: 4px; }
.dynamic-copy strong { color: var(--navy); }

/* Compact rhythm for structured legal and policy content */
.dynamic-copy:has(> h2) {
    white-space: normal;
    line-height: 1.72;
}
.dynamic-copy:has(> h2) p {
    margin: 0 0 13px;
}
.dynamic-copy:has(> h2) h2 {
    margin: 34px 0 11px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5ebef;
    font-size: 28px;
}
.dynamic-copy:has(> h2) h3 {
    margin: 23px 0 9px;
    font-size: 21px;
}
.dynamic-copy:has(> h2) ul,
.dynamic-copy:has(> h2) ol {
    margin: 4px 0 17px;
}
.dynamic-copy:has(> h2) li {
    margin-bottom: 5px;
    line-height: 1.6;
}
.dynamic-copy:has(> h2)>h2:first-of-type {
    margin-top: 27px;
}
@media(max-width:640px) {
    .dynamic-copy:has(> h2) h2 { margin-top: 29px; font-size: 24px; }
    .dynamic-copy:has(> h2) h3 { margin-top: 20px; font-size: 20px; }
    .dynamic-copy:has(> h2) p { margin-bottom: 11px; }
}

/* Homepage fees payment */
.fee-payment-section {
    background: radial-gradient(circle at 90% 15%, #c89a3d20, transparent 28%), linear-gradient(135deg, #032943, #075078);
}
.fee-payment-card {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr);
    align-items: center;
    gap: clamp(38px, 6vw, 75px);
    color: #fff;
    position: relative;
}
.fee-payment-copy>span {
    color: #e4bb65;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.fee-payment-copy h2 {
    margin: 9px 0 17px;
    font: clamp(38px, 4.5vw, 54px)/1.12 Georgia, serif;
}
.fee-payment-copy p { max-width: 690px; color: #c8dae4; line-height: 1.75; }
.fee-payment-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 27px; }
.fee-payment-actions .fee-whatsapp { color: #fff; background: #167c4b; border-color: #249460; }
.fee-payment-actions .fee-whatsapp:hover { background: #11633c; }
.fee-payment-steps { display: grid; gap: 12px; }
.fee-payment-steps>div {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 88px;
    padding: 18px 21px;
    background: #ffffff0d;
    border: 1px solid #ffffff20;
    border-radius: 11px;
}
.fee-payment-steps>div>svg { width: 44px; height: 44px; padding: 10px; color: var(--navy); background: var(--gold); border-radius: 50%; }
.fee-payment-steps span { display: flex; flex-direction: column; }
.fee-payment-steps small { margin-bottom: 3px; color: #9fc2d2; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.fee-payment-steps strong { color: #fff; }
.fee-payment-note {
    grid-column: 1/-1;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding-top: 22px;
    color: #b9ced9;
    border-top: 1px solid #ffffff1c;
    font-size: 13px;
}
.fee-payment-note svg { width: 18px; height: 18px; color: var(--gold); }
@media(max-width:900px) { .fee-payment-card { grid-template-columns: 1fr; } }
@media(max-width:640px) {
    .fee-payment-card { gap: 30px; }
    .fee-payment-actions { flex-direction: column; }
    .fee-payment-actions .button { width: 100%; }
.fee-payment-note { align-items: flex-start; }
}

/* Homepage student admission and query */
.student-enquiry-section { background: radial-gradient(circle at 8% 20%, #c89a3d1a, transparent 25%), #fff; }
.student-enquiry-card {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    padding: clamp(34px, 4.5vw, 54px);
    background: linear-gradient(120deg, #f8fbfc, #eef5f7);
    border: 1px solid #d9e5ea;
    border-radius: 18px;
    box-shadow: 0 20px 55px #052e5212;
}
.student-enquiry-icon { display: grid; place-items: center; width: 78px; height: 78px; color: var(--gold); background: var(--navy); border-radius: 50%; }
.student-enquiry-icon svg { width: 34px; height: 34px; }
.student-enquiry-copy { max-width: 750px; }
.student-enquiry-copy>span { color: var(--gold); font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.student-enquiry-copy h2 { color: var(--navy); margin: 7px 0 12px; font: clamp(31px, 3.8vw, 44px)/1.17 Georgia, serif; }
.student-enquiry-copy p { color: #607487; margin: 0; line-height: 1.72; }
.student-enquiry-card>.button { white-space: nowrap; }
.student-enquiry-points { grid-column: 2/-1; display: flex; flex-wrap: wrap; gap: 10px 24px; padding-top: 22px; border-top: 1px solid #dbe5e9; }
.student-enquiry-points span { display: inline-flex; align-items: center; gap: 8px; color: #385468; font-size: 13px; font-weight: 800; }
.student-enquiry-points svg { width: 18px; height: 18px; color: var(--gold); }
@media(max-width:1050px) {
    .student-enquiry-card { grid-template-columns: 72px 1fr; }
    .student-enquiry-card>.button { grid-column: 2; justify-self: start; }
    .student-enquiry-points { grid-column: 2; }
}
@media(max-width:640px) {
    .student-enquiry-card { grid-template-columns: 1fr; gap: 21px; padding: 29px 22px; }
    .student-enquiry-icon { width: 64px; height: 64px; }
    .student-enquiry-card>.button, .student-enquiry-points { grid-column: auto; width: 100%; }
    .student-enquiry-points { flex-direction: column; padding-top: 19px; }
}

/* Student login links */
.student-login-cta {
    color: var(--navy);
    background: var(--gold);
    border: 1px solid var(--gold);
    white-space: nowrap;
}
.student-login-cta:hover {
    color: #fff;
    background: #a97924;
    border-color: #a97924;
}
.student-login-cta svg { width: 18px; height: 18px; }
.footer-links>a.footer-student-login {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #e4bb65;
    font-weight: 800;
}
.footer-links>a.footer-student-login::before { display: none; }
.footer-student-login svg { width: 16px; height: 16px; }
@media(min-width:981px) {
    .nav { gap: 16px; }
    .student-login-cta { padding-inline: 14px; }
}

/* Homepage offers and promotions */
.offers-section {
    background: radial-gradient(circle at 10% 12%, #c89a3d1b, transparent 25%), linear-gradient(180deg, #fbf7ee, #f4f8fa);
}
.offers-heading { max-width: 780px; margin-bottom: 0; }
.offers-carousel-heading { align-items: flex-end; margin-bottom: 34px; }
.offers-grid {
    display: flex;
    gap: 22px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 4px 2px 20px;
}
.offers-grid::-webkit-scrollbar { display: none; }
.offer-card {
    flex: 0 0 calc(38% - 12px);
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #dce6eb;
    border-top: 4px solid var(--gold);
    border-radius: 13px;
    overflow: hidden;
    scroll-snap-align: start;
    box-shadow: 0 15px 42px #052e520d;
    transition: transform .22s ease, box-shadow .22s ease;
}
.offer-card:hover { transform: translateY(-5px); box-shadow: 0 21px 48px #052e5218; }
.offer-image {
    height: 210px;
    flex: 0 0 210px;
    background: linear-gradient(135deg, #eaf1f4, #f8f3e7);
    position: relative;
    overflow: hidden;
}
.offer-image img { display: block; width: 100%; height: 100%; padding: 0; object-fit: cover; object-position: center; transition: transform .35s ease; }
.offer-card:hover .offer-image img { transform: scale(1.04); }
.offer-image span { position: absolute; left: 18px; bottom: 17px; color: var(--navy); background: var(--gold); border-radius: 999px; padding: 7px 11px; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; box-shadow: 0 6px 18px #052e5230; }
.offer-body { display: flex; flex: 1; flex-direction: column; padding: 25px 25px 28px; }
.offer-body h3 { color: var(--navy); margin: 0 0 11px; font: 26px/1.25 Georgia, serif; }
.offer-body p { color: #627688; margin: 0; line-height: 1.68; }
.offers-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 25px;
    margin-top: 30px;
    padding: 24px 27px;
    background: #fff;
    border: 1px solid #dce6eb;
    border-radius: 11px;
}
.offers-action p { color: #607487; margin: 0; }
.offers-action .button { flex: none; }
@media(max-width:900px) { .offer-card { flex-basis: 58%; } }
@media(max-width:640px) {
    .offers-carousel-heading { align-items: flex-end; }
    .offer-card { flex-basis: 88%; }
    .offer-image { height: 190px; flex-basis: 190px; }
    .offer-body { padding: 23px 20px 26px; }
    .offers-action { align-items: stretch; flex-direction: column; padding: 23px 20px; }
    .offers-action .button { width: 100%; }
}