/* Static, problem-led Global IB Challenge layout. */
.ib-native__grid--problem { grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); align-items: stretch; gap: 24px; }
.ib-problem-path, .ib-problem-summary { min-height: 0; border: 1px solid #c8e2fb; border-radius: 12px; background: #fff; }
.ib-problem-path { padding: 28px; }
.ib-problem-path__heading { display: flex; justify-content: space-between; gap: 28px; padding-bottom: 20px; border-bottom: 1px solid #dbeaf9; }
.ib-problem-path__heading > span, .ib-problem-summary__eyebrow { color: #0878ed; font-size: .73rem; font-weight: 900; letter-spacing: .1em; }
.ib-problem-path__heading p { max-width: 420px; margin: 0; color: #526f96; font-size: .78rem; line-height: 1.45; }
.ib-problem-path ol { display: grid; gap: 0; margin: 0; padding: 15px 0 0; list-style: none; }
.ib-problem-path li { display: grid; grid-template-columns: 38px 43px minmax(0, 1fr); gap: 13px; align-items: center; min-height: 64px; padding: 11px 0; border-bottom: 1px solid #e2effb; }
.ib-problem-path li:last-child { border-bottom: 0; }
.ib-problem-path li > b { color: #147cf6; font-size: .82rem; }
.ib-problem-path__icon { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid #b9dcfb; border-radius: 50%; color: #1281f7; }
.ib-problem-path__icon svg, .ib-problem-summary svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.ib-problem-path h3 { margin: 0; color: #0a204a; font-size: .9rem; line-height: 1.15; text-transform: uppercase; }
.ib-problem-path p { margin: 3px 0 0; color: #526f96; font-size: .74rem; line-height: 1.35; }
.ib-problem-path li.is-risk > b, .ib-problem-path li.is-risk h3 { color: #e6524d; }
.ib-problem-path li.is-risk .ib-problem-path__icon { border-color: #ffc8c4; color: #e6524d; background: #fffafa; }
.ib-problem-summary { display: flex; flex-direction: column; padding: 30px; background: linear-gradient(155deg, #f8fbff, #edf7ff); }
.ib-problem-summary__eyebrow { margin: 0 0 13px; }
.ib-problem-summary h3 { margin: 0; color: #0a204a; font-size: clamp(1.45rem, 2.2vw, 2.15rem); line-height: 1.08; }
.ib-problem-summary > p:not(.ib-problem-summary__eyebrow) { margin: 16px 0 0; color: #3d5d87; font-size: .9rem; line-height: 1.5; }
.ib-problem-summary ul { display: grid; gap: 10px; margin: 24px 0; padding: 0; list-style: none; }
.ib-problem-summary li { display: flex; align-items: center; gap: 10px; color: #244b7e; font-size: .8rem; font-weight: 800; }
.ib-problem-summary li svg { flex: 0 0 20px; color: #1684f7; }
.ib-problem-summary li:nth-child(2) svg { color: #e6524d; }
.ib-problem-summary__outcome { margin-top: auto; padding: 16px; border-left: 3px solid #147cf6; background: #fff; }
.ib-problem-summary__outcome span { display: block; margin-bottom: 4px; color: #0878ed; font-size: .64rem; font-weight: 900; letter-spacing: .1em; }
.ib-problem-summary__outcome b { color: #173862; font-size: .84rem; line-height: 1.35; }
@media (max-width: 920px) { .ib-native__grid--problem { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .ib-problem-path, .ib-problem-summary { padding: 21px; } .ib-problem-path__heading { display: block; } .ib-problem-path__heading p { margin-top: 9px; } .ib-problem-path li { grid-template-columns: 28px 38px minmax(0, 1fr); gap: 9px; } .ib-problem-path__icon { width: 34px; height: 34px; } .ib-problem-summary { padding: 24px 21px; } }
