/* /phuong-phap-hoc: three image-led chapters. Isolated from the homepage method banner. */
[nh-row="methodbody"] > .row, [nh-row="methodbodym"] > .row { margin-inline:0; }
[nh-row="methodbody"] > .row > div, [nh-row="methodbodym"] > .row > div { padding-inline:0; }
.mmp { --mp-bg:#050506; --mp-panel:#121316; --mp-ink:#f5f5f6; --mp-muted:#acb0b9; --mp-line:#2c2e34; --mp-red:#ee2850; --mp-soft:#1b0f14; --mp-nav-h:58px; background:var(--mp-bg); color:var(--mp-ink); font:400 15px/1.75 Inter,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
html[data-meduc-theme="light"] .mmp { --mp-bg:#fff; --mp-panel:#f5f5f7; --mp-ink:#191b20; --mp-muted:#626773; --mp-line:#e1e3e8; --mp-red:#bd263a; --mp-soft:#fbf2f3; }
.mmp *, .mmp *::before, .mmp *::after { box-sizing:border-box; }
.mmp .mmp-shell { width:min(83.333333%,1440px); margin-inline:auto; }
.mmp h1,.mmp h2,.mmp h3,.mmp p,.mmp figure { margin:0; color:inherit; }
.mmp a { color:inherit; text-decoration:none; }
.mmp a:focus-visible { outline:2px solid var(--mp-red) !important; outline-offset:4px; }
.mmp .mmp-eyebrow { margin:0 0 22px; color:var(--mp-red); font:700 11px/1.5 Inter,Arial,sans-serif; letter-spacing:.13em; }
.mmp h1,.mmp h2 { font-family:Anton,Impact,sans-serif; font-weight:400; letter-spacing:-.015em; text-wrap:balance; }
.mmp h1 { font-size:clamp(50px,5.7vw,86px); line-height:1.12; }
.mmp h1>span { display:block; margin-top:10px; color:var(--mp-red); }
.mmp h2 { font-size:clamp(36px,3.8vw,58px); line-height:1.18; }
.mmp h2>span { color:var(--mp-red); }
.mmp .mmp-button { display:inline-flex; align-items:center; justify-content:center; gap:28px; min-height:50px; padding:14px 24px; border:1px solid var(--mp-line); border-radius:8px; font:700 14px/1.45 Inter,Arial,sans-serif; transition:filter .18s; }
.mmp .mmp-button--primary { border-color:transparent; background:var(--mp-red); color:#fff; }
.mmp .mmp-button--primary:hover { filter:brightness(1.13); }
.mmp .mmp-text-link { display:inline-flex; align-items:center; gap:18px; font:600 13px/1.6 Inter,Arial,sans-serif; }
.mmp .mmp-text-link>span { font-size:20px; font-weight:400; }
.mmp .mmp-text-link:hover { color:var(--mp-red); }
.mmp-hero { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:clamp(36px,5vw,85px); padding-block:clamp(50px,5.5vw,80px); }
.mmp-hero-copy { min-width:0; }
.mmp .mmp-lead { max-width:540px; margin-top:27px; color:var(--mp-muted); font-size:16px; line-height:1.8; }
.mmp-actions { display:flex; align-items:center; flex-wrap:wrap; gap:25px; margin-top:32px; }
.mmp .mmp-hero-visual { position:relative; overflow:hidden; border-radius:12px; aspect-ratio:1/1.04; background:#191b1e; isolation:isolate; }
.mmp-hero-visual img { display:block; width:100%; height:100%; object-fit:cover; }
.mmp-hero-visual::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 35%,#050506d9 100%); content:""; }
.mmp-hero-visual figcaption { position:absolute; z-index:1; right:30px; bottom:30px; left:30px; color:#fff; }
.mmp-hero-visual figcaption>span { display:block; margin-bottom:14px; color:#ffffffc7; font:600 10px/1.5 Inter,Arial,sans-serif; letter-spacing:.14em; }
.mmp-hero-visual figcaption>p { font:400 clamp(26px,2.65vw,39px)/1.25 Georgia,'Times New Roman',serif; letter-spacing:-.025em; }

/* Only the compact chapter bar stays pinned; photo/text content scrolls with the page. */
.mmp-jump { position:sticky; top:var(--mhi-header-h,66px); z-index:1000; padding-block:2px; border-block:1px solid var(--mp-line); background:var(--mp-bg); }
.mmp-jump-links { display:flex; align-items:center; gap:10px 28px; overflow-x:auto; scrollbar-width:none; }
.mmp-jump-links::-webkit-scrollbar { display:none; }
.mmp-jump a { position:relative; flex:none; display:inline-flex; align-items:center; gap:10px; min-height:52px; font-size:12px; font-weight:600; white-space:nowrap; }
.mmp-jump a>span { color:var(--mp-muted); font-size:10px; }
.mmp-jump a::after { position:absolute; right:0; bottom:0; left:0; height:2px; background:var(--mp-red); content:""; transform:scaleX(0); }
.mmp-jump a:hover,.mmp-jump a[aria-current] { color:var(--mp-red); }
.mmp-jump a[aria-current]::after { transform:scaleX(1); }
.mmp-section { padding-block:clamp(64px,6.7vw,100px); }
.mmp #vi-sao,.mmp #core-learning,.mmp #cach-ap-dung,.mmp #dieu-dat-duoc { scroll-margin-top:calc(var(--mhi-header-h,66px) + var(--mp-nav-h) + 18px); }
.mmp-editorial { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(38px,6.5vw,110px); }
.mmp-copy { min-width:0; }
.mmp-copy>p:not(.mmp-eyebrow) { margin-top:22px; color:var(--mp-muted); font-size:15px; line-height:1.8; }
.mmp .mmp-copy .mmp-pull { margin-top:28px; padding-left:20px; border-left:2px solid var(--mp-red); color:var(--mp-ink); font-size:17px; line-height:1.65; }
.mmp .mmp-photo { position:relative; min-width:0; overflow:hidden; aspect-ratio:1/1; border-radius:12px; isolation:isolate; background:var(--mp-panel); }
.mmp-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.mmp-photo--why img { object-position:44% center; }
.mmp-photo:has(figcaption)::after { position:absolute; inset:35% 0 0; background:linear-gradient(transparent,#050506d9); content:""; }
.mmp-photo figcaption { position:absolute; z-index:1; right:28px; bottom:28px; left:28px; color:#fff; font:400 clamp(24px,2.4vw,35px)/1.3 Georgia,'Times New Roman',serif; letter-spacing:-.025em; }
.mmp-band { background:var(--mp-panel); }
/* Numbered teaching principles mirror the large, readable cards on the feedback page. */
.mmp-core-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.45fr); align-items:end; gap:55px; margin-bottom:48px; }
.mmp-core-heading h2 { font-size:clamp(48px,5vw,76px); line-height:1.12; }
.mmp-core-heading>p { margin:0 0 6px; color:var(--mp-muted); font-size:15px; line-height:1.7; }
.mmp-core-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin:0; padding:0; list-style:none; }
.mmp-core-grid>li { min-width:0; padding:28px 28px 32px; border:1px solid var(--mp-line); border-radius:10px; background:var(--mp-bg); }
.mmp-core-number { display:block; color:var(--mp-red); font:400 40px/1 Anton,Impact,sans-serif; }
.mmp-core-grid h3 { margin:22px 0 0; font:700 clamp(18px,1.5vw,21px)/1.35 Inter,Arial,sans-serif; letter-spacing:-.02em; }
.mmp-core-grid p { margin:12px 0 0; color:var(--mp-muted); font:400 15px/1.7 Inter,Arial,sans-serif; }
.mmp .mmp-core-link { margin-top:28px; }
/* Application and learning outcomes share one photo statement, matching the feedback page. */
.mmp-application { position:relative; isolation:isolate; display:grid; place-items:center; min-height:clamp(440px,46vw,620px); padding-block:90px; overflow:hidden; text-align:center; }
.mmp-application-bg { position:absolute; inset:0; z-index:-2; display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.mmp-application::before { position:absolute; inset:0; z-index:-1; content:""; background:linear-gradient(180deg,rgb(5 5 6 / .82),rgb(20 2 10 / .86)); }
.mmp-legacy-anchor { position:absolute; top:0; left:0; }
.mmp-application-inner { display:flex; flex-direction:column; align-items:center; }
.mmp .mmp-application .mmp-eyebrow { margin-bottom:24px; color:#ff6b86; }
.mmp .mmp-application h2 { max-width:950px; color:#fff; font:400 clamp(34px,4.2vw,62px)/1.2 Georgia,'Times New Roman',serif; letter-spacing:-.035em; text-wrap:balance; }
.mmp .mmp-application-text { max-width:640px; margin:26px 0 0; color:#ffffffc7; font:400 clamp(15px,1.25vw,18px)/1.75 Inter,Arial,sans-serif; }
.mmp .mmp-button--outline { margin-top:34px; border:2px solid #ffffffa6; background:transparent; color:#fff; }
.mmp .mmp-button--outline:hover { border-color:#fff; background:#ffffff1a; }
.mmp-outro { display:flex; align-items:center; justify-content:space-between; gap:50px; padding-block:65px 75px; }
.mmp-outro h2 { font-size:clamp(38px,4vw,60px); }
.mmp-outro p:last-child { max-width:520px; margin-top:22px; color:var(--mp-muted); }
.mmp-outro-actions { display:flex; flex:none; flex-direction:column; align-items:center; gap:22px; width:285px; }
.mmp-outro-actions .mmp-button { width:100%; }
@media(max-width:1100px) { .mmp .mmp-shell { width:88%; } .mmp-jump-links { gap:24px; } .mmp-jump a { font-size:11px; } .mmp-editorial { gap:40px; } .mmp-core-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) {
 .mmp-hero { gap:30px; }
 .mmp h1 { font-size:clamp(44px,5.8vw,65px); }
 .mmp h2 { font-size:clamp(34px,4.3vw,46px); }
 .mmp-editorial { gap:30px; }
 .mmp-photo { aspect-ratio:4/5 !important; }
 .mmp-core-heading { grid-template-columns:1fr; gap:22px; margin-bottom:32px; }
 .mmp-core-heading>p { max-width:620px; margin:0; }
}
@media(max-width:767.98px) {
 .mmp .mmp-shell { width:calc(100% - 36px); }
 .mmp .mmp-eyebrow { margin-bottom:18px; font-size:9px; letter-spacing:.1em; }
 .mmp-hero { grid-template-columns:1fr; gap:30px; padding-block:36px 40px; }
 .mmp h1 { font-size:clamp(42px,11.5vw,65px); }
 .mmp .mmp-lead { margin-top:22px; font-size:15px; }
 .mmp-actions { gap:22px; margin-top:25px; }
 .mmp .mmp-button { padding-inline:20px; font-size:13px; }
 .mmp .mmp-text-link { gap:12px; font-size:12px; }
 .mmp .mmp-hero-visual { aspect-ratio:1.15/1; }
 .mmp-hero-visual figcaption { right:22px; bottom:24px; left:22px; }
 .mmp-hero-visual figcaption>p { font-size:29px; }
 .mmp-jump a { min-height:46px; gap:8px; font-size:11px; }
 .mmp-jump-links { gap:25px; }
 .mmp-section { padding-block:50px; }
 .mmp-editorial { grid-template-columns:1fr; gap:28px; }
 .mmp-editorial .mmp-copy { order:-1; }
 .mmp h2 { font-size:clamp(34px,9.2vw,46px); }
 .mmp-copy>p:not(.mmp-eyebrow) { margin-top:18px; font-size:14px; }
 .mmp .mmp-copy .mmp-pull { margin-top:22px; font-size:16px; }
 .mmp .mmp-photo { aspect-ratio:1.12/1 !important; }
 .mmp-photo figcaption { right:22px; bottom:23px; left:22px; font-size:27px; }
 .mmp-core-heading h2 { font-size:clamp(40px,10vw,54px); }
 .mmp-core-heading>p { font-size:14px; }
 .mmp-core-grid { gap:14px; }
 .mmp-core-grid>li { padding:24px 22px 26px; }
 .mmp-core-grid h3 { font-size:19px; }
 .mmp-core-grid p { font-size:14px; }
 .mmp-application { min-height:0; padding-block:70px; }
 .mmp .mmp-application .mmp-eyebrow { margin-bottom:22px; font-size:10px; }
 .mmp .mmp-application h2 { font-size:clamp(32px,8.5vw,46px); }
 .mmp .mmp-application-text { margin-top:23px; font-size:14px; }
 .mmp .mmp-button--outline { margin-top:28px; }
 .mmp-outro { flex-direction:column; align-items:stretch; gap:28px; padding-block:46px; }
 .mmp-outro h2 { font-size:clamp(38px,10vw,50px); }
 .mmp-outro p:last-child { margin-top:19px; font-size:14px; }
 .mmp-outro-actions { align-items:flex-start; width:100%; max-width:350px; }
}
@media(prefers-reduced-motion:reduce) { .mmp .mmp-button { transition:none; } }

@media(max-width:650px) { .mmp-core-grid { grid-template-columns:1fr; } }
