/* Bloom CSS Logistics: brilliant-subjects */
/*
 * Brilliant Maths Tutors — Services / Subjects v1.0 — BELOW FOLD
 * CSS Logistics path: below-fold/pages/custom/brilliant-subjects.css
 * Assignment: Subjects page only | Strategy: deferred | Priority: 70
 * Requires brilliant-subjects-hero.css for tokens/base primitives.
 */

.bmt-section { padding-block: clamp(72px, 8vw, 112px); }
.bmt-heading { max-width: 830px; margin-bottom: 48px; }
.bmt-heading--center { margin-inline: auto; text-align: center; }
.bmt-heading h2,
.bmt-gap h2,
.bmt-levels h2,
.bmt-clarity h2,
.bmt-subject-faq h2 {
    margin-bottom: 18px;
    color: var(--bmt-navy);
    font-size: clamp(2.45rem, 4.8vw, 4.45rem);
    letter-spacing: -.055em;
}
.bmt-heading > p:last-child,
.bmt-levels__grid > div:first-child > p:last-child,
.bmt-subject-faq__grid > div:first-child > p:last-child { margin-bottom: 0; color: var(--bmt-muted); font-size: 1.06rem; }

/* Subjects */
.bmt-subjects { background: var(--bmt-mist); border-bottom: 1px solid var(--bmt-line); }
.bmt-subject-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.bmt-subject-card {
    position: relative;
    min-height: 630px;
    display: flex;
    flex-direction: column;
    padding: 32px;
    border: 1px solid var(--bmt-line);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(2,48,71,.06);
}
.bmt-subject-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 38px; }
.bmt-subject-card__code {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--bmt-navy);
    color: #fff;
    font-size: .75rem;
    font-weight: 950;
}
.bmt-subject-card__symbol { color: rgba(2,48,71,.12); font-family: Georgia, serif; font-size: 4rem; font-weight: 900; line-height: 1; }
.bmt-subject-card__eyebrow { margin-bottom: 9px; color: var(--bmt-blue); font-size: .72rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.bmt-subject-card h3 { margin-bottom: 17px; color: var(--bmt-navy); font-size: 2rem; letter-spacing: -.045em; }
.bmt-subject-card > p:not(.bmt-subject-card__eyebrow) { margin-bottom: 22px; color: var(--bmt-muted); }
.bmt-subject-card ul { margin: 0 0 30px; padding: 0; display: grid; gap: 11px; list-style: none; }
.bmt-subject-card li { position: relative; padding-left: 20px; color: #405562; font-size: .92rem; }
.bmt-subject-card li::before { content: ""; position: absolute; left: 0; top: .72em; width: 7px; height: 7px; border-radius: 50%; background: var(--bmt-yellow); }
.bmt-subject-card > a { margin-top: auto; color: var(--bmt-navy); text-decoration: none; font-weight: 900; font-size: .88rem; }
.bmt-subject-card > a span { color: var(--bmt-orange); }
.bmt-subject-card--maths { background: #eaf8fc; }
.bmt-subject-card--literacy { background: #fff3c3; }
.bmt-subject-card--science { background: var(--bmt-navy); border-color: var(--bmt-navy); }
.bmt-subject-card--science .bmt-subject-card__code { background: var(--bmt-yellow); color: var(--bmt-navy-2); }
.bmt-subject-card--science .bmt-subject-card__symbol { color: rgba(255,255,255,.11); }
.bmt-subject-card--science .bmt-subject-card__eyebrow { color: var(--bmt-yellow); }
.bmt-subject-card--science h3 { color: #fff; }
.bmt-subject-card--science > p:not(.bmt-subject-card__eyebrow),
.bmt-subject-card--science li { color: #c7e4ed; }
.bmt-subject-card--science > a { color: #fff; }

/* Gap process */
.bmt-gap {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--bmt-navy);
    color: #d5eaf1;
}
.bmt-gap::after {
    content: "√";
    position: absolute;
    right: -25px;
    bottom: -120px;
    z-index: -1;
    color: rgba(255,255,255,.045);
    font-family: Georgia, serif;
    font-size: 26rem;
    line-height: 1;
}
.bmt-gap__grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(48px, 8vw, 100px); align-items: start; }
.bmt-gap__copy { position: sticky; top: 124px; }
.bmt-gap h2 { color: #fff; }
.bmt-gap__copy > p:not(.bmt-kicker) { margin-bottom: 28px; color: #bcdde7; }
.bmt-step-list { margin: 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.bmt-step-list li {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 18px;
    align-items: start;
    padding: 24px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 18px;
    background: rgba(255,255,255,.055);
}
.bmt-step-list > li > span {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--bmt-yellow);
    color: var(--bmt-navy-2);
    font-weight: 950;
}
.bmt-step-list strong { display: block; margin: 1px 0 5px; color: #fff; }
.bmt-step-list p { margin: 0; color: #bcdde7; font-size: .93rem; }

/* Levels */
.bmt-levels { background: #fff; }
.bmt-levels__grid { display: grid; grid-template-columns: .77fr 1.23fr; gap: clamp(45px, 7vw, 88px); align-items: start; }
.bmt-levels__grid > div:first-child { position: sticky; top: 124px; }
.bmt-level-map { display: grid; gap: 13px; }
.bmt-level-map article {
    display: grid;
    grid-template-columns: 58px 1fr auto;
    gap: 20px;
    align-items: center;
    padding: 25px 26px;
    border: 1px solid var(--bmt-line);
    border-radius: 20px;
    background: #fbfdfe;
}
.bmt-level-map article > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: var(--bmt-navy); color: #fff; font-size: .73rem; font-weight: 950; }
.bmt-level-map small { display: block; margin-bottom: 5px; color: var(--bmt-blue); font-size: .68rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.bmt-level-map h3 { margin: 0 0 7px; color: var(--bmt-navy); font-size: 1.35rem; }
.bmt-level-map p { margin: 0; color: var(--bmt-muted); font-size: .9rem; }
.bmt-level-map article > strong { max-width: 130px; padding: 8px 12px; border-radius: 999px; background: #e8f6fa; color: var(--bmt-navy); font-size: .72rem; line-height: 1.2; text-align: center; }
.bmt-level-map article:last-child { background: #fff8d8; }
.bmt-level-map article:last-child > span { background: var(--bmt-yellow); color: var(--bmt-navy-2); }

/* Formats */
.bmt-formats { background: var(--bmt-mist); border-block: 1px solid var(--bmt-line); }
.bmt-format-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.bmt-format-grid article { position: relative; min-height: 380px; padding: 30px; border: 1px solid var(--bmt-line); border-radius: 24px; background: #fff; }
.bmt-format-grid__number { display: inline-grid; place-items: center; width: 44px; height: 44px; margin-bottom: 34px; border-radius: 50%; background: var(--bmt-yellow); color: var(--bmt-navy-2); font-size: .75rem; font-weight: 950; }
.bmt-format-grid__eyebrow { margin-bottom: 7px; color: var(--bmt-blue); font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.bmt-format-grid h3 { margin-bottom: 15px; color: var(--bmt-navy); font-size: 1.7rem; }
.bmt-format-grid article > p:not(.bmt-format-grid__eyebrow) { margin-bottom: 20px; color: var(--bmt-muted); }
.bmt-format-grid ul { margin: 0; padding-left: 20px; color: #405562; font-size: .9rem; }
.bmt-format-grid li + li { margin-top: 7px; }
.bmt-format-grid article:nth-child(2) { background: var(--bmt-navy); border-color: var(--bmt-navy); }
.bmt-format-grid article:nth-child(2) .bmt-format-grid__eyebrow { color: var(--bmt-yellow); }
.bmt-format-grid article:nth-child(2) h3 { color: #fff; }
.bmt-format-grid article:nth-child(2) > p:not(.bmt-format-grid__eyebrow),
.bmt-format-grid article:nth-child(2) ul { color: #c7e4ed; }
.bmt-format-note { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 20px; padding: 26px 28px; border: 1px solid var(--bmt-line); border-radius: 22px; background: #fff; }
.bmt-format-note p { margin-bottom: 0; color: var(--bmt-muted); }
.bmt-format-note .bmt-script { margin-bottom: 4px; color: var(--bmt-blue); }

/* Clarity outcomes */
.bmt-clarity { background: #fff; }
.bmt-clarity__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(44px, 7vw, 88px); align-items: start; }
.bmt-clarity__grid > div:first-child { position: sticky; top: 124px; }
.bmt-clarity__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bmt-clarity__cards article { min-height: 230px; padding: 27px; border: 1px solid var(--bmt-line); border-radius: 20px; background: #fbfdfe; }
.bmt-clarity__cards span { width: 40px; height: 40px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 50%; background: var(--bmt-navy); color: #fff; font-size: .72rem; font-weight: 950; }
.bmt-clarity__cards article:nth-child(2) { background: #fff3c3; }
.bmt-clarity__cards article:nth-child(3) { background: #eaf8fc; }
.bmt-clarity__cards article:nth-child(4) { background: var(--bmt-navy); border-color: var(--bmt-navy); }
.bmt-clarity__cards article:nth-child(4) span { background: var(--bmt-yellow); color: var(--bmt-navy-2); }
.bmt-clarity__cards h3 { margin-bottom: 10px; color: var(--bmt-navy); font-size: 1.32rem; }
.bmt-clarity__cards p { margin: 0; color: var(--bmt-muted); }
.bmt-clarity__cards article:nth-child(4) h3 { color: #fff; }
.bmt-clarity__cards article:nth-child(4) p { color: #c7e4ed; }

/* FAQ */
.bmt-subject-faq { background: #f9fcfd; border-top: 1px solid var(--bmt-line); }
.bmt-subject-faq__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(44px, 7vw, 88px); align-items: start; }
.bmt-subject-faq__grid > div:first-child { position: sticky; top: 124px; }
.bmt-faq-list { display: grid; gap: 10px; }
.bmt-faq-list details { border: 1px solid var(--bmt-line); border-radius: 15px; background: #fff; overflow: hidden; }
.bmt-faq-list summary { position: relative; cursor: pointer; padding: 19px 52px 19px 21px; color: var(--bmt-navy); font-weight: 850; list-style: none; }
.bmt-faq-list summary::-webkit-details-marker { display: none; }
.bmt-faq-list summary::after { content: "+"; position: absolute; right: 19px; top: 50%; width: 26px; height: 26px; display: grid; place-items: center; transform: translateY(-50%); border-radius: 50%; background: #e8f6fa; color: var(--bmt-navy); font-size: 1rem; font-weight: 900; }
.bmt-faq-list details[open] summary::after { content: "–"; background: var(--bmt-yellow); }
.bmt-faq-list details p { margin: 0; padding: 0 21px 20px; color: var(--bmt-muted); }

/* Final CTA */
.bmt-final-cta { padding: clamp(34px, 4vw, 52px) 0 clamp(68px, 8vw, 116px); background: #fff; }
.bmt-final-cta__box { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.15fr .85fr; gap: 42px; align-items: center; padding: clamp(35px, 5vw, 62px); border-radius: var(--bmt-radius-lg); background: linear-gradient(125deg, var(--bmt-navy), #075d78); color: #fff; }
.bmt-final-cta__box::after { content: "π"; position: absolute; right: -4px; bottom: -80px; color: rgba(255,255,255,.06); font-family: Georgia, serif; font-size: 20rem; line-height: 1; }
.bmt-final-cta .bmt-script { color: var(--bmt-yellow); }
.bmt-final-cta h2 { margin-bottom: 12px; color: #fff; font-size: clamp(2.25rem, 4vw, 3.8rem); letter-spacing: -.05em; }
.bmt-final-cta p { margin-bottom: 0; color: #c6e4ee; }
.bmt-final-cta__actions { position: relative; z-index: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }

@media (max-width: 1080px) {
    .bmt-subject-grid { grid-template-columns: 1fr; }
    .bmt-subject-card { min-height: 0; }
    .bmt-format-grid { grid-template-columns: 1fr; }
    .bmt-format-grid article { min-height: 0; }
}

@media (max-width: 900px) {
    .bmt-gap__grid,
    .bmt-levels__grid,
    .bmt-clarity__grid,
    .bmt-subject-faq__grid,
    .bmt-final-cta__box { grid-template-columns: 1fr; }
    .bmt-gap__copy,
    .bmt-levels__grid > div:first-child,
    .bmt-clarity__grid > div:first-child,
    .bmt-subject-faq__grid > div:first-child { position: static; }
    .bmt-final-cta__actions { justify-content: flex-start; }
    .bmt-level-map article { grid-template-columns: 58px 1fr; }
    .bmt-level-map article > strong { grid-column: 2; justify-self: start; }
}

@media (max-width: 700px) {
    .bmt-clarity__cards { grid-template-columns: 1fr; }
    .bmt-format-note { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) {
    .bmt-section { padding-block: 62px; }
    .bmt-heading h2,
    .bmt-gap h2,
    .bmt-levels h2,
    .bmt-clarity h2,
    .bmt-subject-faq h2 { font-size: clamp(2.05rem, 10vw, 3.15rem); }
    .bmt-subject-card { padding: 24px; border-radius: 20px; }
    .bmt-subject-card__top { margin-bottom: 28px; }
    .bmt-subject-card h3 { font-size: 1.7rem; }
    .bmt-step-list li { grid-template-columns: 44px 1fr; padding: 18px; }
    .bmt-step-list > li > span { width: 38px; height: 38px; }
    .bmt-level-map article { grid-template-columns: 45px 1fr; gap: 14px; padding: 20px; }
    .bmt-level-map article > span { width: 40px; height: 40px; }
    .bmt-format-grid article { padding: 24px; }
    .bmt-final-cta__box { padding: 31px 24px; border-radius: 26px; }
    .bmt-final-cta__actions { display: grid; }
}