/* Match the SCMP mobile banner layout. Keep desktop styles intact. */
@media (max-width: 760px) {
html body #app .cppm-page .cppm-hero-v2.hero { height: auto !important; min-height: 370px !important; max-height: none !important; }
html body #app .cppm-page .cppm-hero-v2.hero > .cppm-hero-shell { box-sizing: border-box !important; width: calc(100% - 32px) !important; height: auto !important; min-height: 370px !important; padding: 22px 0 18px !important; align-items: flex-start !important; text-align: left !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy { flex: 0 0 100% !important; width: 100% !important; min-width: 0 !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy .cppm-hero-kicker { box-sizing: border-box; min-height: 23px !important; height: auto !important; font-size: 10.5px !important; line-height: 1.5 !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy h1 { margin: 13px 0 10px !important; font-size: clamp(22px, 6.65vw, 26px) !important; line-height: 1.32 !important; white-space: normal !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy > p { max-width: none !important; font-size: 14.5px !important; line-height: 1.86 !important; letter-spacing: 0 !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy ul { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px 20px !important; margin: 13px 0 0 !important; font-size: 11.5px !important; line-height: 1.5 !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-copy li:last-child { grid-column: 1 / -1 !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; width: 100% !important; margin-top: 16px !important; gap: 12px !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-actions > a { width: 100% !important; height: 43px !important; border-radius: 9px !important; font-size: 14px !important; line-height: 41px !important; }
html body #app .cppm-page .cppm-hero-v2.hero .cppm-hero-actions > a:first-child b { margin-left: 10px !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero { height: auto !important; min-height: 370px !important; max-height: none !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero > .cpps-hero-shell { box-sizing: border-box !important; width: calc(100% - 32px) !important; height: auto !important; min-height: 370px !important; padding: 22px 0 18px !important; align-items: flex-start !important; text-align: left !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy { flex: 0 0 100% !important; width: 100% !important; min-width: 0 !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy .cpps-hero-kicker { box-sizing: border-box; min-height: 23px !important; height: auto !important; font-size: 10.5px !important; line-height: 1.5 !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy h1 { margin: 13px 0 10px !important; font-size: 27px !important; line-height: 1.32 !important; white-space: normal !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy > p { max-width: none !important; font-size: 14.5px !important; line-height: 1.86 !important; letter-spacing: 0 !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy ul { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px 20px !important; margin: 13px 0 0 !important; font-size: 11.5px !important; line-height: 1.5 !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-copy li:last-child { grid-column: 1 / -1 !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; width: 100% !important; margin-top: 16px !important; gap: 12px !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-actions > a { width: 100% !important; height: 43px !important; border-radius: 9px !important; font-size: 14px !important; line-height: 41px !important; }
html body #app .cpps-page .cpps-hero-v2.cpps-hero .cpps-hero-actions > a:first-child b { margin-left: 10px !important; }
html body #app .sigma-page .sigma-hero-v2.hero { height: auto !important; min-height: 370px !important; max-height: none !important; }
html body #app .sigma-page .sigma-hero-v2.hero > .sigma-hero-shell { box-sizing: border-box !important; width: calc(100% - 32px) !important; height: auto !important; min-height: 370px !important; padding: 22px 0 18px !important; align-items: flex-start !important; text-align: left !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy { flex: 0 0 100% !important; width: 100% !important; min-width: 0 !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy .sigma-hero-kicker { box-sizing: border-box; min-height: 23px !important; height: auto !important; font-size: 10.5px !important; line-height: 1.5 !important; letter-spacing: 1px !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy h1 { margin: 13px 0 10px !important; font-size: 26px !important; line-height: 1.32 !important; white-space: normal !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy > p { max-width: none !important; font-size: 14px !important; line-height: 1.86 !important; letter-spacing: 0 !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy ul { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px 20px !important; margin: 13px 0 0 !important; font-size: 11.5px !important; line-height: 1.5 !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-copy li:last-child { grid-column: 1 / -1 !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; width: 100% !important; margin-top: 16px !important; gap: 12px !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-actions > a { width: 100% !important; height: 43px !important; border-radius: 9px !important; font-size: 14px !important; line-height: 41px !important; }
html body #app .sigma-page .sigma-hero-v2.hero .sigma-hero-actions > a:first-child b { margin-left: 10px !important; }
html body #app .cpps-page .cpps-hero-copy h1 .cpps-mobile-title-extra { display: none !important; }
}
