.learning-roadmap{padding:64px 0 12px;background:linear-gradient(180deg,#fff,#f7faff);color:var(--ink)}
.learning-roadmap + #path{padding-top:24px;padding-bottom:40px}
.learning-roadmap + #path .path-box{padding-top:26px;padding-bottom:26px}
.learning-roadmap + #path .path-box h3{line-height:1.35;margin-top:4px;margin-bottom:12px}
.learning-roadmap + #path .path-box p{line-height:1.6;margin-bottom:0}
.roadmap-heading{text-align:center;margin:0 auto 44px;max-width:850px}
.roadmap-heading h2{font-size:clamp(28px,3vw,40px);line-height:1.45;margin:10px 0 16px;color:var(--brand-blue)}
.roadmap-heading h2 span{color:#cf2428;font-weight:800}
.roadmap-heading>p:last-child{color:var(--text);line-height:1.8;margin:0}
.roadmap-chart{position:relative;display:grid;grid-template-columns:.95fr 1.5fr .95fr .9fr 1.05fr;grid-template-rows:auto auto auto;gap:28px 34px;align-items:center;padding:8px 0 12px}
.roadmap-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.roadmap-lines path[data-connection]{fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;marker-end:url(#roadmap-arrow)}
.roadmap-lines path[data-no-arrow]{marker-end:none}
.roadmap-card{position:relative;min-width:0;border:1px solid #d4dff1;border-radius:22px;background:#fff;padding:22px 14px;text-align:center;box-shadow:0 8px 22px #163c8408;z-index:1}
.roadmap-chart a:focus-visible{outline:3px solid #ba8100;outline-offset:5px}
.roadmap-card h3,.roadmap-improve h3{font-size:20px;line-height:1.4;color:var(--brand-blue);margin:10px 0}
.roadmap-card p{font-size:13px;line-height:1.8;color:var(--text);margin:0}
.roadmap-step{display:block;font-size:9px;letter-spacing:.8px;font-weight:800;line-height:1.7;color:var(--blue)}
.roadmap-icon{display:block;width:116px;height:116px;object-fit:contain;margin:8px auto}
.roadmap-link{display:block;font-size:11px;color:var(--brand-blue);font-weight:700;margin-top:14px;line-height:1.7}
.roadmap-start{grid-column:1;grid-row:1 / 3;border:2px solid #264b99}
.roadmap-complete{grid-column:2;grid-row:1;background:#fffcf1;border-color:#edbd35;padding:16px 12px}
.roadmap-condition{display:block;font-size:11px;line-height:1.7;color:#52617b;margin-bottom:8px;font-weight:600}
.roadmap-course-title{display:flex;align-items:center;justify-content:center;gap:12px;font-size:23px;font-weight:800;line-height:1.5;color:var(--brand-blue)}
.roadmap-course-pair{display:grid;grid-template-columns:1fr 20px 1fr;align-items:center;gap:2px;margin-top:8px}
.roadmap-course-pair a{min-width:0;color:var(--brand-blue)}
.roadmap-course-pair img{display:block;width:92px;height:92px;max-width:100%;object-fit:contain;margin:auto;mix-blend-mode:multiply}
.roadmap-course-pair strong{display:block;font-size:16px;line-height:1.6}
.roadmap-course-pair a>span{display:block;font-size:10px;line-height:1.6;color:var(--text)}
.roadmap-plus{font-weight:800;font-size:26px;color:#ce9500}
.roadmap-boost{grid-column:2;grid-row:2;background:#f0f6ff;border-color:#b8cfee;padding:16px 12px}
.roadmap-boost-body{display:flex;align-items:center;gap:10px;text-align:left}
.roadmap-boost-body img{width:80px;height:80px;object-fit:contain;mix-blend-mode:multiply}
.roadmap-boost h3{margin:0 0 5px}.roadmap-boost p{font-size:11px}
.roadmap-mock{grid-column:3;grid-row:1 / 3}
.roadmap-decision{grid-column:4;grid-row:1 / 3;position:relative;text-align:center;z-index:1;min-width:0}
.roadmap-diamond{position:relative;aspect-ratio:1;display:grid;place-items:center;margin:18px 0}
.roadmap-diamond:before{content:"";position:absolute;inset:12%;transform:rotate(45deg);border-radius:18px;border:2px solid #f0bb29;background:linear-gradient(135deg,#fff5c4,#ffda63);z-index:-1}
.roadmap-diamond h3{font-size:20px;line-height:1.5;color:var(--brand-blue);margin:0}
.roadmap-decision>p{font-size:11px;color:var(--text);line-height:1.8;margin:0}
.roadmap-exam{grid-column:5;grid-row:1 / 3;border-color:#b7dbc5;background:#fafffc}
.roadmap-exam .roadmap-idp-logo{display:block;width:104px;max-width:100%;height:auto;margin:14px auto 0}
.roadmap-result{display:block;font-size:11px;font-weight:800;line-height:1.7;border-radius:20px;padding:6px 8px}
.roadmap-ready{color:#217447;background:#e7f5eb}.roadmap-notyet{color:#a93653;background:#fff0f3;width:fit-content;margin:0 auto 12px}
.roadmap-improve{grid-column:4 / 6;grid-row:3;border-color:#eccd78;background:#fffdf6;padding:16px}
.roadmap-improve-options{display:flex;align-items:center;justify-content:center;gap:16px}
.roadmap-improve-options>a{display:flex;align-items:center;text-align:left;gap:8px}
.roadmap-improve-options img{width:70px;height:70px;object-fit:contain;mix-blend-mode:multiply}
.roadmap-improve h3{font-size:16px;margin:0 0 4px}.roadmap-improve p{font-size:11px}
.roadmap-or{font-size:11px;font-weight:700;color:var(--blue)}
.roadmap-improve .roadmap-return{border-top:1px solid #ebdeb7;padding-top:10px;margin-top:10px;color:var(--blue);font-weight:600}
@media(max-width:1200px) and (min-width:981px){.roadmap-chart{gap:24px 22px}.roadmap-card{padding:18px 10px}.roadmap-course-title{font-size:20px}.roadmap-icon{width:96px;height:96px}.roadmap-card h3,.roadmap-diamond h3{font-size:17px}.roadmap-improve-options{gap:8px}.roadmap-improve-options img{width:48px;height:48px}.roadmap-improve h3{font-size:14px}}
@media(max-width:980px){
 .learning-roadmap{padding-top:48px}.roadmap-heading{margin-bottom:28px}
 .roadmap-chart{grid-template-columns:1fr 1fr;gap:30px 20px;max-width:680px;margin:auto}
 .roadmap-lines{display:none}
 .roadmap-start,.roadmap-mock,.roadmap-decision,.roadmap-exam,.roadmap-improve{grid-column:1 / -1;grid-row:auto;max-width:100%;width:100%;box-sizing:border-box}
 .roadmap-complete{grid-column:1;grid-row:auto}.roadmap-boost{grid-column:2;grid-row:auto;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
 .roadmap-start,.roadmap-mock,.roadmap-exam{padding:18px;display:grid;grid-template-columns:100px 1fr;column-gap:16px;align-items:center;text-align:left}
 .roadmap-start .roadmap-icon,.roadmap-mock .roadmap-icon,.roadmap-exam .roadmap-icon{grid-column:1;grid-row:1 / 5;width:100px;height:100px;margin:0}
 .roadmap-start>:not(img),.roadmap-mock>:not(img),.roadmap-exam>:not(img){grid-column:2}
 .roadmap-exam .roadmap-idp-logo{grid-column:2;margin:10px 0 0}
 .roadmap-card h3{margin:5px 0}.roadmap-link{margin-top:8px}
 .roadmap-decision{max-width:240px;justify-self:center}
 .roadmap-diamond{margin:0 22px}.roadmap-diamond h3{font-size:22px}
 .roadmap-mock:before,.roadmap-decision:after,.roadmap-start:after{content:"↓";position:absolute;left:50%;transform:translateX(-50%);font-size:24px;font-weight:800;color:var(--blue)}
 .roadmap-start:after{bottom:-30px}.roadmap-mock:before{top:-32px}.roadmap-decision:after{bottom:-32px;color:#217447}
 .roadmap-improve{margin-top:4px}.roadmap-improve-options{gap:20px}.roadmap-improve-options img{width:80px;height:80px}
}
@media(max-width:480px){.roadmap-chart{grid-template-columns:1fr;gap:28px}.roadmap-complete,.roadmap-boost{grid-column:1}.roadmap-boost:before{content:"หรือ หากมีพื้นฐานแล้ว";display:block;color:var(--blue);font-size:12px;font-weight:700;margin-bottom:10px}.roadmap-boost-body{justify-content:center}.roadmap-improve-options{flex-direction:column;gap:10px}.roadmap-improve-options>a{text-align:center}.roadmap-heading>p:last-child{font-size:14px}.roadmap-start,.roadmap-mock,.roadmap-exam{grid-template-columns:80px 1fr;padding:16px 12px;gap:8px}.roadmap-start .roadmap-icon,.roadmap-mock .roadmap-icon,.roadmap-exam .roadmap-icon{width:80px;height:80px}.roadmap-card h3{font-size:19px}}