/* fonts */

:root {     --font-reg: inter-variable, sans-serif;   --font-bold: inter-variable, sans-serif; }

h1, h2, h3, h4, h5, h6, .cardCta__title {
    font-weight: 600 !important;
}


/* buttons */

.btnComponent,
.course-selector__buttons {
    border-radius: 6px !important;
}


/* misc */

.no-mt {
    margin-top: 0px !important;
}

input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=text] {
    font: var(--font-regular);
    border-radius: 6px;
}


/* shadow */

.shadow {
    box-shadow: 10px 5px 55px 0 rgba(67,84,101,0.33);
}


/* course headers */

.course .hero__content,
.course .hero__button-wrap {
    max-width: 1152px;
    padding-inline: 0px;
}


/* masthead */

.hero-wrap {
    padding-top: 140px !important;
}

.course .hero-wrap {
    padding-top: 90px !important;
}

.MastHead_logoLink__QjkJ4 {
    max-width: unset;
}

.masthead__logo {
    height: 80px !important;
}

.course .returnButton {
    display: none !important;
}


/* home */

.home h1 {
    text-transform: uppercase !important;
}

.homeLayout__logo img {
    width: 300px !important;
}


/* personalise */

.personalise main,
.auth.login main {
    background-image: url("https://app.prospectus.plus/setu/wp-content/uploads/sites/457/2026/01/personalise_background-scaled.png");
    background-size: cover;
    background-attachment: fixed;
}

.pillSelector,
.course-selector {
    margin-top: 80px !important;
}

.pillComponent {
    border-radius: 12px !important;
    /* border: 2px solid var(--pill-border-colour); */
}

/* .pillComponent:hover {
    border: 2px solid var(--pill-border-colour-hover) !important;
}

.Pill_pillInput__Mctze:checked+.Pill_component__30Haq {
    border: 2px solid var(--pill-border-colour-active);
} */

/* .personalise .pillSelector .btnComponent {
    margin-left: 0px !important;
}

.personalise .pillSelector .selector__button-wrapper {
    margin-left: 0px !important;
    padding: 0px !important;
} */

.cardSelectorComponent__select,
.CardSelector_select__03C9B svg path {
    color: var(--color-primary);
    fill: var(--color-primary);
}

.Card_component__S8VRD.Card_courseSelectorCard__1nNT_.Card_disabled__35n_r .Card_state__COySZ.Card_hasImage__8q3XS:after {
    background: linear-gradient(0deg,var(--card-gradient-colour-active) 0,var(--card-gradient-colour-active) 22%,#222b5800 60%)!important;
}


/* overview */

@media (min-width: 769px) {
.overview .hero__title {
    font-size: 60px;
}
}


/* single pages */

.page .masthead {
    background-color: var(--color-primary);
}

.page .hero__content {
    margin-bottom: 150px;
    min-height: unset !important;
}

.page .hero__button-wrap {
    margin-top: 150px;
}

.page h1.hero__title {
    font-size: 60px;
}

.page svg.mr-1 {
    width: 16px;
    margin-right: 8px !important;
}

.page .returnButton {
    font-size: 24px;
}

@media (max-width: 769px) {
.page .hero__content {
    margin-bottom: 0px !important;
}

.page .returnButton,
.page h1.hero__title {
    font-size: unset;
}

.page svg.mr-1 {
    width: unset;
    margin-right: 0px !important;
}
}


/* login */

.auth.login .returnButton,
.auth.login h1.mt-2.mb-2,
.auth.login p.mt-0.mb-4 {
    color: #fff !important
}

.auth.login .btnComponent {
    background-color: #fff;
}

.auth.login .btnComponent:hover {
    background-color: var(--color-secondary);
}


/* COURSE CSS */

.pill {
    display: inline-block !important;
    padding: 0.75em 1em !important;
    border-radius: 20em !important;
    font-size: 12px !important;
    font-weight: bold !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: white !important;
}

.pill.white {
    background: white !important;
    color: black !important;
}

.no-mb {
    margin-bottom: 0 !important;
}

.meta-flex {
    gap: 1em;
    display: flex
}

.course-content h3, 
.course-content .has-3-font-size{
    margin-bottom: 0 !important;
}

.course-content p {
    color: var(--color-primary);
    line-height: 1.5;
}

.course-facts p {
    color: var(--color-primary);
}

@media (min-width: 769px) {
.course-facts {
    margin-top: -5em !important;
    z-index: 12 !important;
    position: relative !important;
}
}

.tutor--name {
    font-weight: bold !important;
    margin-bottom: 0 !important;
}

.tutor--email {
    margin-top: 0 !important;
}