/*
 * Shared section-heading system
 *
 * This file is intentionally loaded after page-specific styles. Hero H1s and
 * smaller card headings retain their own hierarchy; section H2s and their
 * eyebrow labels use one consistent treatment throughout the website.
 */

:root {
    --section-heading-color: #111;
    --section-heading-size: clamp(31px, 3vw, 46px);
    --section-heading-size-mobile: clamp(30px, 9vw, 39px);
    --section-eyebrow-color: #f04a14;
    --section-eyebrow-line: #ff8b5d;
    --heading-copy-color: #33424f;
    --heading-copy-size: 16px;
    --heading-copy-weight: 400;
}

/*
 * Early-years page typography
 *
 * Nursery and Playdates/Pre-Nursery were built with a self-contained navy
 * type theme and extra-small card copy. Bring their content back into the
 * site's shared type system while retaining orange as the intentional accent.
 */
:is(.ps-hero, .ps-guide, .ps-proof) {
    color: var(--black, #222) !important;
    font-family: var(--primary-font, "Raleway", Arial, sans-serif) !important;
}

:is(.ps-hero, .ps-guide, .ps-proof) :is(h1, h2, h3, h4, p, blockquote, footer) {
    font-family: inherit;
}

/* Give both early-years routes the same clear heading hierarchy as the site. */
.ps-title {
    max-width: 680px !important;
    font-size: clamp(48px, 5vw, 68px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.08 !important;
}

.ps-title span {
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

main h2.ps-section-title {
    width: min(100%, 960px);
    margin: clamp(28px, 3.5vw, 48px) auto clamp(24px, 2.5vw, 36px) !important;
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.7vw, 40px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.12 !important;
    text-align: center !important;
    text-wrap: balance;
}

main h2.ps-section-title > span {
    min-width: 0;
    max-width: min(100%, 760px);
}

.ps-stories > h2.ps-section-title {
    font-size: clamp(28px, 1.7vw, 40px) !important;
}

.ps-choice-card h3,
.ps-process-card h3,
.ps-benefit h3 {
    min-height: 0 !important;
    margin-bottom: 10px !important;
    text-wrap: balance;
}

.ps-proof-cta h2 {
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.4vw, 38px) !important;
    font-weight: 750 !important;
    letter-spacing: -.03em !important;
    line-height: 1.12 !important;
}

.ps-proof-cta h2 span {
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

.ps-lead,
.ps-choice-card p,
.ps-process-card p,
.ps-benefit p,
.ps-story blockquote,
.ps-story footer,
.ps-proof-cta p {
    color: var(--ink-700, #33424f) !important;
    font-size: clamp(14px, 1vw, 16px) !important;
    line-height: 1.55 !important;
}

.ps-choice-card h3,
.ps-process-card h3,
.ps-benefit h3 {
    color: var(--black, #222) !important;
    font-size: clamp(16px, 1.15vw, 18px) !important;
    line-height: 1.25 !important;
}

.ps-story footer strong,
.ps-proof-trust__item {
    color: var(--black, #222) !important;
    font-size: 14px !important;
}

/* Match the compact, fine-line icon language used by the other categories. */
.ps-benefit__icon {
    width: 44px !important;
    height: 44px !important;
    border: 1px solid rgba(255, 91, 39, .28) !important;
    border-radius: 12px !important;
    background: #fff !important;
}

.ps-benefit__icon svg {
    width: 24px !important;
    height: 24px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.5 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.ps-trust svg,
.ps-guide-note svg,
.ps-proof-trust svg {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.5 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.ps-trust svg,
.ps-proof-trust svg {
    width: 24px !important;
    height: 24px !important;
}

.ps-guide-note svg {
    width: 22px !important;
    height: 22px !important;
}

@media (max-width: 720px) {
    .ps-title {
        font-size: clamp(36px, 10vw, 48px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.12 !important;
        text-wrap: balance;
    }

    main h2.ps-section-title {
        margin-top: 30px !important;
        margin-bottom: 22px !important;
        font-size: clamp(25px, 7.5vw, 34px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.16 !important;
    }

    main h2.ps-section-title > span {
        max-width: calc(100% - 66px);
    }

    .ps-proof-cta h2 {
        font-size: clamp(27px, 8vw, 34px) !important;
        line-height: 1.16 !important;
    }
}

/* University uses the same restrained heading scale as other categories. */
main .university-hero__title {
    font-size: clamp(44px, 3.5vw, 56px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.08 !important;
}

body main h2:is(.university-discovery__heading,
    .university-why__title,
    .university-process__title,
    .university-dream__title,
    .university-feedback__title,
    .university-partners__title) {
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.4vw, 40px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.12 !important;
    text-align: center !important;
    text-transform: none !important;
    text-wrap: balance;
}

/* Match the more generous PQ/PD spacing rhythm between University sections. */
main .university-discovery {
    padding-top: clamp(52px, 5vw, 76px) !important;
    padding-bottom: clamp(56px, 5vw, 80px) !important;
}

main :is(.university-why, .university-process) {
    padding-top: clamp(62px, 5.5vw, 84px) !important;
    padding-bottom: clamp(62px, 5.5vw, 84px) !important;
}

main :is(.university-dream, .university-feedback, .university-partners) {
    padding-top: clamp(58px, 5vw, 78px) !important;
    padding-bottom: clamp(58px, 5vw, 78px) !important;
}

main :is(.university-why__intro,
    .university-process__intro,
    .university-dream__intro,
    .university-feedback__intro,
    .university-partners__intro) {
    margin-top: 14px !important;
    margin-bottom: clamp(32px, 3vw, 44px) !important;
}

main .university-discovery > .university-discovery__inner > .university-discovery__heading {
    margin-top: clamp(42px, 4vw, 58px) !important;
    margin-bottom: 24px !important;
}

main .university-discovery__showcase {
    margin-top: clamp(36px, 3.5vw, 50px) !important;
}

main .university-discovery__support {
    margin-top: clamp(36px, 3.5vw, 50px) !important;
}

main :is(.university-why__grid,
    .university-process__steps,
    .university-dream__layout,
    .university-feedback__cards,
    .university-partners__layout) {
    row-gap: clamp(22px, 2.4vw, 34px) !important;
}

/* University support panel follows the shared primary/secondary CTA order. */
.university-discovery__support {
    min-height: 150px !important;
    padding-block: 20px !important;
    border-color: #f0e1d8 !important;
    background: #fffaf7 !important;
}

body main .university-discovery__support-copy h2 {
    margin-bottom: 10px !important;
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.2vw, 36px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.12 !important;
    text-wrap: balance;
}

.university-discovery__support-copy p {
    color: var(--ink-700, #33424f) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
}

.university-discovery__support-actions {
    align-self: start !important;
    justify-items: stretch;
    padding-top: 2px;
    gap: 10px !important;
}

.university-discovery__support-actions > :is(.consultation-cta-standard, .mia-guidance-standard) {
    width: 100% !important;
    max-width: 270px !important;
}

/*
 * Canonical Mia support portrait
 * Use the transparent headset cutout in guidance/contact panels. Page content
 * must not add circular crops, white discs or avatar shadows. WhatsApp widgets
 * live outside main and deliberately retain their own presentation.
 */
main .mia-support-face,
main img[src*="/favicon.png"],
main img[src*="/call-icon.png"] {
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    clip-path: none !important;
}

.university-discovery__support-visual .mia-support-face {
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    width: 142px !important;
    height: 142px !important;
    margin: 0 !important;
    transform: translate(-50%, -50%);
}

/* Tuition Centre follows the shared page and section heading hierarchy. */
body main .tuition-centre-hero .tc-guide-heading {
    max-width: 680px !important;
    margin-bottom: 20px !important;
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(44px, 3.5vw, 56px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.08 !important;
    text-wrap: balance;
}

body main .tuition-centre-hero .tc-guide-heading > span {
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

body main h2.tc-section-title {
    width: min(100%, 960px);
    margin: 0 auto clamp(24px, 2.5vw, 36px) !important;
    color: var(--section-heading-color, #111) !important;
    font-size: var(--section-heading-size) !important;
    font-weight: 750 !important;
    letter-spacing: -.04em !important;
    line-height: 1.08 !important;
    text-align: center !important;
    text-transform: none !important;
    text-wrap: balance;
}

body main h2.tc-section-title > span {
    max-width: min(100%, 780px);
    overflow-wrap: normal !important;
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

.tc-information .tc-info-section {
    padding-top: clamp(34px, 3vw, 46px) !important;
    padding-bottom: clamp(32px, 3vw, 44px) !important;
}

body main .tc-consultation-copy h2 {
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.2vw, 36px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.12 !important;
    text-wrap: balance;
}

main .tc-consultation-mia {
    width: 120px !important;
    height: 120px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

main .tc-consultation-mia img {
    width: 112px !important;
    height: 112px !important;
}

/* Replace oversized solid university glyphs with compact fine-line icons. */
:is(.university-why__icon-wrap,
    .university-process__icon-wrap,
    .university-dream__icon-wrap,
    .university-partners__benefit-icon,
    .study-areas-modal__icon) {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
    border: 1px solid rgba(255, 91, 39, .28) !important;
    border-radius: 12px !important;
}

/* Font Awesome study-area glyphs retain their meaning without a heavy fill. */
.study-areas-modal__icon i.fa-solid {
    color: #ff5b27 !important;
    font-size: 21px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke-color: currentColor !important;
    -webkit-text-stroke-width: .04em !important;
    paint-order: stroke fill;
}

/* The visible Study Areas carousel uses large filled Font Awesome SVG paths. */
.university-discovery__area > svg {
    box-sizing: border-box;
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    overflow: visible;
    color: #ff5b27 !important;
    border: 1px solid rgba(255, 91, 39, .28);
    border-radius: 12px;
    background: #fff;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.35 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.university-discovery__area > svg path {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.35 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    vector-effect: non-scaling-stroke;
}

.university-why__icon-wrap::after {
    display: none !important;
}

:is(.university-why, .university-process, .university-dream, .university-feedback, .university-partners)
    :is(.university-why__icon,
    .university-process__icon,
    .university-dream__icon,
    .university-process__benefit-icon,
    .university-feedback__stat-icon,
    .university-partners__benefit-icon svg) {
    width: 24px !important;
    height: 24px !important;
    color: #ff5b27 !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    opacity: 1 !important;
}

:is(.university-why, .university-process, .university-dream, .university-feedback, .university-partners)
    :is(.university-why__icon,
    .university-process__icon,
    .university-dream__icon,
    .university-process__benefit-icon,
    .university-feedback__stat-icon,
    .university-partners__benefit-icon svg) :is(path, circle, rect, line, polyline, polygon, use) {
    fill: none !important;
    color: #ff5b27 !important;
    stroke: #ff5b27 !important;
    stroke-width: 1 !important;
    opacity: 1 !important;
}

/* Larger 40/48 viewBoxes need a proportionate stroke to render equally light. */
.university-why .metric-outline-icon,
.university-feedback .university-feedback__stat-icon {
    stroke-width: 1.6 !important;
}

.university-why .metric-outline-icon :is(path, circle, rect),
.university-feedback .university-feedback__stat-icon :is(path, circle, rect) {
    stroke-width: 1.6 !important;
}

.university-dream__icon-badge {
    right: -4px !important;
    bottom: -4px !important;
    width: 20px !important;
    height: 20px !important;
    border: 1px solid rgba(255, 91, 39, .28) !important;
    background: #fff !important;
}

.university-dream__icon-badge svg {
    width: 13px !important;
    height: 13px !important;
    fill: none !important;
    stroke: #ff5b27 !important;
    stroke-width: 1 !important;
}

/* PNG Icons8 artwork for the three main University guidance sections. */
main img.university-icons8 {
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    max-width: none !important;
    object-fit: contain;
    opacity: 1 !important;
}

main .university-dream__icon-wrap img.university-icons8 {
    width: 30px !important;
    height: 30px !important;
}

@media (max-width: 720px) {
    main :is(.university-discovery,
        .university-why,
        .university-process,
        .university-dream,
        .university-feedback,
        .university-partners) {
        padding-top: 44px !important;
        padding-bottom: 48px !important;
    }

    main :is(.university-why__intro,
        .university-process__intro,
        .university-dream__intro,
        .university-feedback__intro,
        .university-partners__intro) {
        margin-bottom: 28px !important;
    }

    main .university-discovery > .university-discovery__inner > .university-discovery__heading {
        margin-top: 36px !important;
        margin-bottom: 20px !important;
    }

    main :is(.university-discovery__showcase, .university-discovery__support) {
        margin-top: 32px !important;
    }

    body main .tuition-centre-hero .tc-guide-heading {
        font-size: clamp(36px, 10vw, 46px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.12 !important;
    }

    body main h2.tc-section-title {
        margin-bottom: 22px !important;
        font-size: var(--section-heading-size-mobile) !important;
        letter-spacing: -.025em !important;
        line-height: 1.16 !important;
    }

    body main h2.tc-section-title > span {
        max-width: calc(100% - 66px);
    }

    main .tc-consultation-mia,
    main .tc-consultation-mia img {
        width: 104px !important;
        height: 104px !important;
    }

    main .university-hero__title {
        font-size: clamp(36px, 10vw, 46px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.12 !important;
    }

    body main h2:is(.university-discovery__heading,
        .university-why__title,
        .university-process__title,
        .university-dream__title,
        .university-feedback__title,
        .university-partners__title) {
        font-size: clamp(27px, 8vw, 34px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.16 !important;
    }

    body main .university-discovery__support-copy h2 {
        font-size: clamp(27px, 8vw, 34px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.16 !important;
    }

    .university-discovery__support-actions {
        justify-items: center;
    }
}

:is(.ps-trust, .ps-guide-note, .ps-proof-trust) svg :is(path, circle, rect, line, polyline, polygon) {
    stroke-width: 1.5 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* White copy belongs only on deliberately dark/orange surfaces. */
.ps-btn--primary,
.ps-proof-tagline {
    color: #fff !important;
}


/* The supplied WhatsApp artwork is the complete button, without a background shell. */
.hero-whatsapp-call,
.corporate-training-page .ct-hero-whatsapp-btn {
    display: block !important;
    width: 64px !important;
    min-width: 64px !important;
    min-height: 0 !important;
    height: 64px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hero-whatsapp-call>img,
.corporate-training-page .ct-hero-whatsapp-btn>img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
}

.hero-whatsapp-call:hover,
.corporate-training-page .ct-hero-whatsapp-btn:hover {
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(-2px);
}

/*
 * All "Ask Mia for Guidance" controls share the quiz-button appearance.
 * Width, height and padding remain owned by each page/component.
 */
[data-open-mia-chat] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border: 1px solid var(--edu-orange, #ff5a16) !important;
    border-radius: 21px !important;
    background: #ffffff !important;
    color: var(--edu-orange, #ff5a16) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: color .25s ease, background .25s ease,
        box-shadow .25s ease, transform .25s ease !important;
}

[data-open-mia-chat] .mia-guidance-icon {
    flex-basis: 24px !important;
    width: 24px !important;
    height: 24px !important;
}

[data-open-mia-chat]:hover {
    background: var(--edu-orange, #ff5a16) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(255, 90, 22, .23) !important;
    transform: translateY(-2px) !important;
}

[data-open-mia-chat]:focus-visible {
    outline: 3px solid rgba(255, 90, 22, .25) !important;
    outline-offset: 3px;
}

/* One shared visual system for all hero CTAs across the website. */
:is(.hero-cta,
    .ps-actions > .ps-btn,
    .university-hero__actions > .university-hero__action,
    .schx-hero__actions > .schx-hero__button,
    .pq2-hero-actions > .btn,
    .career-hero .career-primary,
    .career-hero .career-secondary,
    .contact-hero-actions > a,
    .tc-guide-actions > .btn,
    .standard-page-hero > .container .btn):not(.mia-guidance-standard) {
    box-sizing: border-box !important;
    min-height: 58px !important;
    min-width: 210px;
    padding: 0 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    border: 1px solid #ff5a16 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: #ff5a16 !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: none !important;
    transition: color .25s ease, background .25s ease,
        box-shadow .25s ease, transform .25s ease !important;
}

/* Keep CTA labels and icons at exactly the same visual scale on every hero. */
:is(.hero-cta, .ps-actions > .ps-btn,
    .university-hero__actions > .university-hero__action,
    .schx-hero__actions > .schx-hero__button, .pq2-hero-actions > .btn,
    .career-hero .career-primary, .career-hero .career-secondary,
    .contact-hero-actions > a, .tc-guide-actions > .btn,
    .standard-page-hero > .container .btn):not(.mia-guidance-standard) :is(strong, small, .mia-guidance-label, .ps-btn__copy, .schx-hero__button-copy, .ct-hero-contact-label) {
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

:is(.hero-cta, .ps-actions > .ps-btn,
    .university-hero__actions > .university-hero__action,
    .schx-hero__actions > .schx-hero__button, .pq2-hero-actions > .btn,
    .career-hero .career-primary, .career-hero .career-secondary,
    .contact-hero-actions > a, .tc-guide-actions > .btn,
    .standard-page-hero > .container .btn):not(.mia-guidance-standard) :is(svg, .mia-guidance-icon, i) {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
}

/* Primary hero action. */
:is(.hero-cta,
    .ps-actions > .ps-btn--primary,
    .university-hero__actions > .university-hero__action:not(.university-hero__action--light),
    .schx-hero__actions > .schx-hero__button:not(.schx-hero__button--light),
    .pq2-hero-actions > .btn-primary,
    .career-hero .career-primary,
    .contact-hero-actions > .contact-primary-btn,
    .tc-guide-actions > .tc-guide-primary-btn,
    .standard-page-hero > .container .btn-primary) {
    background: #ff5a16 !important;
    color: #ffffff !important;
}

:is(.hero-cta,
    .ps-actions > .ps-btn,
    .university-hero__actions > .university-hero__action,
    .schx-hero__actions > .schx-hero__button,
    .pq2-hero-actions > .btn,
    .career-hero .career-primary,
    .career-hero .career-secondary,
    .contact-hero-actions > a,
    .tc-guide-actions > .btn,
    .standard-page-hero > .container .btn):not(.mia-guidance-standard):hover {
    background: #e34b10 !important;
    border-color: #e34b10 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(255, 90, 22, .23) !important;
    transform: translateY(-2px) !important;
}

:is(.university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .contact-hero-actions,
    .tc-guide-actions) {
    gap: 12px !important;
}

/*
 * Inner-page hero primary CTA: use its old hover treatment at rest and its
 * old outlined treatment on hover. The home hero and secondary CTAs are not
 * included in this override.
 */
:is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child,
.standard-page-hero > .container > div:first-child > .btn:first-of-type,
.tb-coming__actions > .tb-coming__submit:first-child {
    background: #ff5a16 !important;
    border: 1px solid #ff5a16 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(255, 90, 22, .23) !important;
    transform: none !important;
    transition: none !important;
}

:is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:hover,
.standard-page-hero > .container > div:first-child > .btn:first-of-type:hover,
.tb-coming__actions > .tb-coming__submit:first-child:hover {
    background: #ffffff !important;
    border: 1px solid #ff5a16 !important;
    color: #ff5a16 !important;
    box-shadow: none !important;
}

/* The nursery/pre-school pair uses two equal-height CTA cards. */
.ps-actions>.ps-btn {
    height: 58px !important;
}

@media (max-width: 720px) {

    :is(.hero-cta,
        .ps-actions > .ps-btn,
        .university-hero__actions > .university-hero__action,
        .schx-hero__actions > .schx-hero__button,
        .pq2-hero-actions > .btn,
        .career-hero .career-primary,
        .career-hero .career-secondary,
        .contact-hero-actions > a,
        .tc-guide-actions > .btn,
        .standard-page-hero > .container .btn):not(.mia-guidance-standard) {
        min-height: 54px !important;
        min-width: 0;
        padding: 0 18px !important;
        font-size: 13px !important;
    }

    .ps-actions>.ps-btn {
        height: 58px !important;
    }

    :is(.hero-cta, .ps-actions > .ps-btn,
        .university-hero__actions > .university-hero__action,
        .schx-hero__actions > .schx-hero__button, .pq2-hero-actions > .btn,
        .career-hero .career-primary, .career-hero .career-secondary,
        .contact-hero-actions > a, .tc-guide-actions > .btn,
        .standard-page-hero > .container .btn):not(.mia-guidance-standard) :is(strong, small, .mia-guidance-label, .ps-btn__copy, .schx-hero__button-copy, .ct-hero-contact-label) {
        font-size: 13px !important;
    }
}

/*
 * Mia guidance feature icons
 * Keep category hero cards aligned with the Tuition Centre treatment:
 * compact white tiles, a soft orange outline and lightweight line icons.
 */
.category-mia-card.pq2-mia-panel ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    margin-top: 20px !important;
    padding: 0 !important;
    list-style: none !important;
}

.category-mia-card.pq2-mia-panel li {
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 64px !important;
    margin: 0 !important;
    padding: 11px 14px !important;
    color: #1d2638 !important;
    background: rgba(255, 255, 255, .92) !important;
    border: 1px solid rgba(255, 91, 39, .07) !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 28px rgba(41, 29, 20, .045) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    list-style: none !important;
}

.category-mia-card.pq2-mia-panel li > span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    color: #ff5b27 !important;
    background: #fff !important;
    border: 1px solid rgba(255, 91, 39, .28) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.category-mia-card.pq2-mia-panel li > span svg {
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8 !important;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.category-mia-card .university-hero__mia-list {
    gap: 12px !important;
    padding: 20px !important;
    border-top: 1px solid #f0e5dd;
}

.category-mia-card .university-hero__mia-list > span {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    min-height: 64px !important;
    gap: 12px !important;
    padding: 11px 14px !important;
    color: #1d2638 !important;
    background: rgba(255, 255, 255, .92) !important;
    border: 1px solid rgba(255, 91, 39, .07) !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 28px rgba(41, 29, 20, .045) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.category-mia-card .university-hero__mia-list > span + span {
    border-top: 1px solid rgba(255, 91, 39, .07) !important;
}

.category-mia-card .university-hero__mia-list > span > svg {
    box-sizing: border-box;
    width: 40px !important;
    height: 40px !important;
    padding: 8px;
    color: #ff5b27 !important;
    background: #fff;
    border: 1px solid rgba(255, 91, 39, .28);
    border-radius: 12px;
    stroke-width: 1.8 !important;
}

/* Career Coaching icon language: outlined Font Awesome glyphs with a
   transparent centre, producing the same crisp double-line appearance. */
:is(.category-mia-card.pq2-mia-panel li > span,
    .tc-guide-mia-card .tc-guide-feature-icon)::before,
.category-mia-card .university-hero__mia-list > span::before {
    display: grid;
    place-items: center;
    color: #ff5b27;
    font-family: "Font Awesome 6 Free";
    font-size: 21px;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-color: currentColor;
    -webkit-text-stroke-width: .04em;
    paint-order: stroke fill;
}

:is(.category-mia-card.pq2-mia-panel li > span,
    .tc-guide-mia-card .tc-guide-feature-icon) > svg,
.category-mia-card .university-hero__mia-list > span > svg {
    display: none !important;
}

/* PQ, PD and Corporate Training feature glyphs. */
.category-mia-card.pq2-mia-panel li:nth-child(1) > span::before { content: "\f0c0"; }
.category-mia-card.pq2-mia-panel li:nth-child(2) > span::before { content: "\f017"; }
.category-mia-card.pq2-mia-panel li:nth-child(3) > span::before { content: "\e0e3"; }
.category-mia-card.pq2-mia-panel li:nth-child(4) > span::before { content: "\f21e"; }

.corporate-training-page .category-mia-card.pq2-mia-panel li:nth-child(1) > span::before { content: "\f017"; }
.corporate-training-page .category-mia-card.pq2-mia-panel li:nth-child(2) > span::before { content: "\f1de"; }
.corporate-training-page .category-mia-card.pq2-mia-panel li:nth-child(3) > span::before { content: "\f058"; }

/* Tuition Centre feature glyphs. */
.tc-guide-mia-card .tc-guide-feature-item:nth-child(1) .tc-guide-feature-icon::before { content: "\f3ed"; }
.tc-guide-mia-card .tc-guide-feature-item:nth-child(2) .tc-guide-feature-icon::before { content: "\f0c0"; }
.tc-guide-mia-card .tc-guide-feature-item:nth-child(3) .tc-guide-feature-icon::before { content: "\f140"; }
.tc-guide-mia-card .tc-guide-feature-item:nth-child(4) .tc-guide-feature-icon::before { content: "\f017"; }

/* University guidance feature glyphs. */
.category-mia-card .university-hero__mia-list > span::before {
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid rgba(255, 91, 39, .28);
    border-radius: 12px;
}

.category-mia-card .university-hero__mia-list > span:nth-child(1)::before { content: "\f007"; }
.category-mia-card .university-hero__mia-list > span:nth-child(2)::before { content: "\f19d"; }
.category-mia-card .university-hero__mia-list > span:nth-child(3)::before { content: "\f140"; }
.category-mia-card .university-hero__mia-list > span:nth-child(4)::before { content: "\f15c"; }

/* Icons8 raster icons need contrast-aware colouring. JavaScript applies the
   light variant only when the icon's own inherited foreground becomes light;
   this avoids turning icons white on pale hover/focus surfaces. */
img[src*="icons8-"],
.icons8-thin-icon {
    transition: transform .2s ease;
}

.icons8-auto-contrast--light,
.bp-card.is-open .bp-card-arrow img[src*="icons8-"],
.bp-card.is-open .bp-card-arrow .icons8-thin-icon {
    filter: brightness(0) saturate(100%) invert(100%) !important;
}

/* Browse by Profession uses pale-orange icon tiles, so glyphs stay black. */
.pq2-profession-browse-icons .bp-card:is(:hover, :focus-within, .is-open) .bp-card-icon,
.pq2-profession-browse-icons .bp-card:is(:hover, :focus-within, .is-open) .bp-card-icon i {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
}

.pq2-profession-browse-icons .bp-card:is(:hover, :focus-within, .is-open) .bp-card-icon img {
    filter: brightness(0) saturate(100%) !important;
}

.pq2-profession-browse-icons .bp-card:is(:hover, :focus-within, .is-open) .bp-card-icon svg {
    color: #111 !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}

/* Career Coaching uses the shared compact, fine-outline icon language. */
.career-page .career-hero h1 {
    font-size: clamp(44px, 3.5vw, 56px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.08 !important;
    text-wrap: balance;
}

body main .career-page :is(.career-journey-heading h2,
    .career-services-heading h2,
    #career-transformation-title,
    #career-audience-title,
    #career-why-title,
    #career-feedback-title,
    .career-insights h2) {
    color: var(--section-heading-color, #111) !important;
    font-size: clamp(28px, 2.4vw, 40px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.12 !important;
    text-align: center !important;
    text-transform: none !important;
    text-wrap: balance;
}

.career-page .career-audience-heading {
    width: min(100%, 960px) !important;
    margin-inline: auto !important;
}

.career-page :is(.career-step-icon,
    .career-audience-icon) {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border: 1px solid rgba(255, 91, 39, .28) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.career-page :is(.career-service-icon,
    .career-trust-icon,
    .career-step-icon i,
    .career-audience-icon i) {
    color: #ff5b27 !important;
    font-size: 21px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke-color: currentColor !important;
    -webkit-text-stroke-width: .04em !important;
    paint-order: stroke fill;
}

/* Career Coaching uses one consistent orange, outlined Icons8 family. */
.career-page img.career-icons8 {
    display: block !important;
    flex: 0 0 auto;
    max-width: none !important;
    object-fit: contain;
}

.career-page :is(.career-service-icon, .career-trust-icon).career-icons8 {
    object-fit: contain;
}

.career-page .career-step-icon .career-icons8,
.career-page .career-audience-icon .career-icons8 {
    width: 24px !important;
    height: 24px !important;
}

.career-page .career-target .career-icons8,
.career-page .career-audience-cta-icon .career-icons8 {
    width: 38px !important;
    height: 38px !important;
}

.career-page .coaching-service-icon .career-icons8 {
    width: 64px !important;
    height: 64px !important;
}

.career-page .career-transformation-icon .career-icons8 {
    width: 58px !important;
    height: 58px !important;
}

.career-page .career-transformation-benefit .career-icons8 {
    width: 30px !important;
    height: 30px !important;
}

.career-page .career-why-icon .career-icons8 {
    width: 62px !important;
    height: 62px !important;
}

/* Keep the main-category selector and CTA on one shared control baseline. */
.career-page .why-reference-cta {
    box-sizing: border-box !important;
    display: grid !important;
    width: min(100%, 1060px) !important;
    grid-template-columns: minmax(0, 1fr) 270px !important;
    align-items: end !important;
    gap: 18px !important;
    margin: 28px auto 0 !important;
    padding: 20px !important;
    border: 1px solid #f0e1d8 !important;
    border-radius: 16px !important;
    background: #fffaf7 !important;
    box-shadow: none !important;
}

.career-page .why-category-field label {
    display: block;
    margin-bottom: 9px !important;
    color: var(--section-heading-color, #111) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.career-page .why-category-field select {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 48px 0 18px !important;
    color: #33424f !important;
    border: 1px solid #ead9d0 !important;
    border-radius: 12px !important;
    background-color: #fff !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.career-page .why-reference-cta > .why-guidance-btn {
    width: 270px !important;
    height: 58px !important;
    min-height: 58px !important;
    justify-self: end !important;
    align-self: end !important;
    padding: 0 22px !important;
    border: 1px solid #ff5a16 !important;
    border-radius: 12px !important;
    background: #ff5a16 !important;
    box-shadow: none !important;
}

/* Undo the legacy rule that turns every button span into a round icon. */
.career-page .why-reference-cta > .why-guidance-btn .consultation-cta-standard__text {
    display: inline !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

.career-page .why-reference-cta > .why-guidance-btn .consultation-cta-standard__arrow {
    display: inline-flex !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    min-height: 27px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: #fff !important;
}

@media (max-width: 720px) {
    .career-page .career-hero h1 {
        font-size: clamp(36px, 10vw, 46px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.12 !important;
    }

    body main .career-page :is(.career-journey-heading h2,
        .career-services-heading h2,
        #career-transformation-title,
        #career-audience-title,
        #career-why-title,
        #career-feedback-title,
        .career-insights h2) {
        font-size: clamp(27px, 8vw, 34px) !important;
        letter-spacing: -.025em !important;
        line-height: 1.16 !important;
    }

    .career-page .why-reference-cta {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        padding: 16px !important;
    }

    .career-page .why-reference-cta > .why-guidance-btn {
        width: 100% !important;
        max-width: none !important;
        justify-self: stretch !important;
    }
}

/* Direct contact controls reuse the Home hero call button and compact
   WhatsApp artwork. Contact stays left-aligned; Team Building must not
   stretch the WhatsApp control into a long text box. */
.contact-page .contact-form-direct-actions {
    width: 100%;
    justify-content: flex-start !important;
}

.contact-page .contact-form-direct-actions .hero-image-call {
    margin: 0 !important;
}

.contact-page .contact-form-direct-actions .hero-whatsapp-call,
.tb-coming__actions .tb-coming__whatsapp.hero-whatsapp-call {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.contact-page .contact-form-direct-actions .hero-whatsapp-call::before,
.tb-coming__actions .tb-coming__whatsapp.hero-whatsapp-call::before {
    display: none !important;
}

.contact-page .contact-form-direct-actions .hero-whatsapp-call > img,
.tb-coming__actions .tb-coming__whatsapp.hero-whatsapp-call > img {
    width: 52px !important;
    height: 52px !important;
    display: block;
    object-fit: contain;
}

.tb-coming__actions {
    grid-template-columns: minmax(175px, .9fr) 34px minmax(190px, .95fr) 52px !important;
}

.tb-coming__actions .tb-coming__whatsapp.hero-whatsapp-call {
    justify-self: start;
}

@media (max-width: 720px) {
    .tb-coming__actions {
        grid-template-columns: 1fr !important;
    }

    .tb-coming__actions .tb-coming__whatsapp.hero-whatsapp-call {
        justify-self: start;
    }
}

main h2.site-centered-heading {
    color: var(--section-heading-color) !important;
    font-size: var(--section-heading-size) !important;
    font-weight: 750 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.08 !important;
}

main .site-centered-heading-copy {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Keep highlighted words typographically consistent with their heading. */
main h2.site-centered-heading strong,
main h2.site-centered-heading>span {
    color: inherit !important;
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

/* Nursery/Pre-school labels keep their compact size and use shared side lines. */
main h2.ps-section-title::before,
main h2.ps-section-title::after {
    content: "";
    display: block;
    width: 44px;
    height: 2px;
    flex: 0 0 44px;
    border-radius: 999px;
    background: var(--section-eyebrow-line);
}

main h2.ps-section-title>span {
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    line-height: inherit;
}

/* Use the same compact right-side line for the early-years and School hero labels. */
main :is(.ps-kicker, .schx-hero__kicker):not(.site-centered-eyebrow)::after {
    content: "";
    display: block;
    width: 44px;
    height: 2px;
    flex: 0 0 44px;
    border-radius: 999px;
    background: var(--section-eyebrow-line);
}

/* Matches section-eyebrow, *-eyebrow, *__eyebrow and equivalent kickers. */
main :is(.section-eyebrow,
    [class$="-eyebrow"],
    [class$="__eyebrow"],
    [class$="-kicker"],
    [class$="__kicker"]).site-centered-eyebrow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto 13px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--section-eyebrow-color) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.035em !important;
    line-height: 1.25 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    gap: 13px !important;
}

main :is(.section-eyebrow,
    [class$="-eyebrow"],
    [class$="__eyebrow"],
    [class$="-kicker"],
    [class$="__kicker"]).site-centered-eyebrow::before,
main :is(.section-eyebrow,
    [class$="-eyebrow"],
    [class$="__eyebrow"],
    [class$="-kicker"],
    [class$="__kicker"]).site-centered-eyebrow::after {
    content: "" !important;
    display: block !important;
    width: 44px !important;
    height: 2px !important;
    flex: 0 0 44px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--section-eyebrow-line) !important;
}

@media (max-width: 720px) {
    main h2.site-centered-heading {
        font-size: var(--section-heading-size-mobile) !important;
    }

    main h2.ps-section-title::before,
    main h2.ps-section-title::after {
        width: 23px;
        flex-basis: 23px;
    }

    main :is(.section-eyebrow,
        [class$="-eyebrow"],
        [class$="__eyebrow"],
        [class$="-kicker"],
        [class$="__kicker"]).site-centered-eyebrow {
        gap: 10px !important;
        font-size: 12px !important;
    }

    main :is(.section-eyebrow,
        [class$="-eyebrow"],
        [class$="__eyebrow"],
        [class$="-kicker"],
        [class$="__kicker"]).site-centered-eyebrow::before,
    main :is(.section-eyebrow,
        [class$="-eyebrow"],
        [class$="__eyebrow"],
        [class$="-kicker"],
        [class$="__kicker"]).site-centered-eyebrow::after {
        width: 23px !important;
        flex-basis: 23px !important;
    }
}

.study-areas-modal__item:hover .study-areas-modal__icon i.fa-solid{
    color: #fff !important;
}

.bp-card:hover .bp-card-arrow{
    background-color: #ff5b27 !important;
}

/* Keep heading capitalization consistent across every page and component. */
body :is(h1, h2, h3, h4, h5, h6),
body :is(h1, h2, h3, h4, h5, h6) * {
    text-transform: capitalize !important;
}

/*
 * Use one typography treatment for descriptive copy placed immediately after
 * a heading, without changing unrelated paragraphs elsewhere on the site.
 */
html body :is(h1, h2, h3, h4, h5, h6) + p:not(#site-heading-copy-override) {
    /* color: var(--heading-copy-color) !important; */
    font-size: var(--heading-copy-size) !important;
    /* font-weight: var(--heading-copy-weight) !important; */
    line-height: 1.6 !important;
}

html body :is(h1, h2, h3, h4, h5, h6) + p:not(#site-heading-copy-override) :is(span, strong, b, em, i, a) {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}

/* Final high-specificity override for the first CTA in every inner-page hero. */
html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override),
html body main .standard-page-hero > .container > div:first-child > .btn:first-of-type:not(#inner-hero-primary-override),
html body main .tb-coming__actions > .tb-coming__submit:first-child:not(#inner-hero-primary-override) {
    background: #ff5a16 !important;
    background-image: none !important;
    border: 1px solid #ff5a16 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(255, 90, 22, .23) !important;
    filter: none !important;
    transform: none !important;
    transition: transform .22s ease, box-shadow .22s ease !important;
}

html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override) :is(span, strong, small, i, svg),
html body main .standard-page-hero > .container > div:first-child > .btn:first-of-type:not(#inner-hero-primary-override) :is(span, strong, small, i, svg),
html body main .tb-coming__actions > .tb-coming__submit:first-child:not(#inner-hero-primary-override) :is(span, strong, small, i, svg) {
    color: inherit !important;
}

/* The arrow sits on a white circle, so keep the arrow itself theme orange. */
html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override) .consultation-cta-standard__arrow {
    background: #ffffff !important;
    color: #ff5a16 !important;
    transform: none !important;
    transition: transform .25s ease !important;
}

html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override) .consultation-cta-standard__arrow svg {
    color: #ff5a16 !important;
    fill: none !important;
    stroke: #ff5a16 !important;
}

html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override):hover,
html body main .standard-page-hero > .container > div:first-child > .btn:first-of-type:not(#inner-hero-primary-override):hover,
html body main .tb-coming__actions > .tb-coming__submit:first-child:not(#inner-hero-primary-override):hover {
    background: #ff5a16 !important;
    background-image: none !important;
    border: 1px solid #ff5a16 !important;
    color: #ffffff !important;
    box-shadow: 0 11px 24px rgba(255, 90, 22, .28) !important;
    filter: none !important;
    transform: translateY(-2px) !important;
}

html body main :is(.ps-actions,
    .university-hero__actions,
    .schx-hero__actions,
    .pq2-hero-actions,
    .career-hero .career-actions,
    .contact-hero-actions,
    .tuition-centre-hero .tc-guide-actions) > :first-child:not(#inner-hero-primary-override):hover .consultation-cta-standard__arrow {
    transform: translateX(3px) !important;
}