.math-page { background: linear-gradient(180deg, #fff 0, #f6f9ff 50rem, var(--paper) 82rem); }
.math-page .breadcrumbs { padding-top: 1rem; }
.math-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(19rem, .95fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); min-height: min(44rem, calc(100svh - 7rem)); padding-block: clamp(3rem, 8vw, 7rem); }
.math-hero__copy h1 { max-width: 16ch; margin: .8rem 0 1.3rem; color: var(--navy-950); font-size: clamp(2.7rem, 6vw, 5.7rem); line-height: .95; letter-spacing: -.06em; text-wrap: balance; }
.math-hero__copy > p:not(.eyebrow) { max-width: 42rem; margin: 0 0 2rem; color: var(--muted); font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.65; }
.math-hero__formula { position: relative; display: grid; min-height: 23rem; padding: clamp(2rem, 5vw, 4.5rem); place-items: center; overflow: hidden; border: 1px solid rgba(27, 111, 241, .17); border-radius: clamp(1.2rem, 3vw, 2.5rem); color: #fff; background: radial-gradient(circle at 80% 18%, rgba(87, 215, 255, .35), transparent 34%), linear-gradient(145deg, #071d42, #125bd0); box-shadow: 0 2rem 5rem rgba(7, 34, 78, .2); }
.math-hero__formula::before, .math-hero__formula::after { position: absolute; width: 9rem; height: 9rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 50%; content: ""; }
.math-hero__formula::before { top: -3rem; right: -2rem; }
.math-hero__formula::after { bottom: -4rem; left: -2rem; width: 12rem; height: 12rem; }
.math-hero__formula math { position: relative; z-index: 1; color: #fff; font-family: "Cambria Math", "STIX Two Math", serif; font-size: clamp(2rem, 4.5vw, 4.25rem); }
.math-hero__formula > span { position: absolute; right: 1.5rem; bottom: 1.25rem; color: rgba(255, 255, 255, .72); font-size: .72rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.math-catalog, .math-module-intro, .math-article-list { padding-block: clamp(4rem, 8vw, 7rem); scroll-margin-top: 5rem; }
.math-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); margin-top: 2.5rem; }
.math-module-card { display: flex; min-height: 27rem; padding: clamp(1.5rem, 3vw, 2.5rem); flex-direction: column; border: 1px solid var(--line); border-radius: 1.4rem; color: inherit; background: #fff; box-shadow: 0 .7rem 2rem rgba(6, 36, 75, .07); text-decoration: none; transition: transform .22s, border-color .22s, box-shadow .22s; }
.math-module-card:hover { border-color: rgba(27, 111, 241, .45); box-shadow: 0 1.4rem 3rem rgba(6, 36, 75, .12); transform: translateY(-.25rem); }
.math-module-card__code { color: var(--blue-700); font-size: .72rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.math-module-card h3 { max-width: 16ch; margin: 1rem 0; color: var(--navy-950); font-size: clamp(1.7rem, 3vw, 2.5rem); letter-spacing: -.04em; }
.math-module-card p { margin: 0; color: var(--muted); line-height: 1.65; }
.math-module-card ul { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1.5rem 0 2rem; padding: 0; list-style: none; }
.math-module-card li { padding: .38rem .62rem; border-radius: 999px; color: #355470; background: var(--soft-blue); font-size: .72rem; font-weight: 700; }
.math-module-card b { margin-top: auto; color: var(--blue-700); font-size: .85rem; }
.math-topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 2.5rem; }
.math-topic-grid article { padding: 1.5rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; }
.math-topic-grid article > span { color: var(--blue-700); font: 800 .7rem/1 Inter, sans-serif; letter-spacing: .08em; }
.math-topic-grid h3 { margin: .75rem 0 .6rem; color: var(--navy-950); font-size: 1.12rem; }
.math-topic-grid p, .math-module-note p { margin: 0; color: var(--muted); line-height: 1.62; }
.math-module-note { display: grid; grid-template-columns: minmax(12rem, .7fr) minmax(0, 1.3fr); gap: 1rem 3rem; margin-top: 3.5rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.math-module-note h3 { grid-row: 1 / span 3; margin: 0; color: var(--navy-950); font-size: clamp(1.5rem, 2.4vw, 2.2rem); }
.math-module-note ul { margin: .8rem 0 0; padding-left: 1.1rem; color: #355470; }
.math-module-note li { margin: .45rem 0; }
.math-article-list { border-top: 1px solid var(--line); }
.math-article-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 2.5rem; }
.math-article-grid a { display: flex; min-height: 18rem; padding: clamp(1.4rem, 3vw, 2rem); flex-direction: column; border: 1px solid var(--line); border-radius: 1rem; color: inherit; background: #fff; text-decoration: none; transition: transform .2s, border-color .2s; }
.math-article-grid a:hover { border-color: var(--blue-500); transform: translateY(-.2rem); }
.math-article-grid a > span { color: var(--blue-700); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.math-article-grid h3 { margin: .9rem 0 .75rem; color: var(--navy-950); font-size: clamp(1.35rem, 2.2vw, 1.85rem); line-height: 1.12; letter-spacing: -.03em; }
.math-article-grid p { margin: 0; color: var(--muted); line-height: 1.6; }
.math-article-grid b { margin-top: auto; padding-top: 1.4rem; color: var(--blue-700); font-size: .82rem; }
.math-empty { margin-top: 2rem; padding: 1.2rem; border-radius: .8rem; background: #fff; color: var(--muted); }
@media (max-width: 54rem) { .math-hero { grid-template-columns: 1fr; min-height: auto; } .math-hero__formula { min-height: 18rem; } .math-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 38rem) { .math-module-grid, .math-article-grid, .math-topic-grid { grid-template-columns: 1fr; } .math-module-card { min-height: 23rem; } .math-module-note { grid-template-columns: 1fr; } .math-module-note h3 { grid-row: auto; } }
@media (prefers-reduced-motion: reduce) { .math-module-card, .math-article-grid a { transition: none; } }