.courses-main{--pm-blue:var(--brand-blue);--pm-blue-2:#0d47c5;--pm-dark:var(--ink);--pm-yellow:var(--yellow);--pm-yellow-soft:#fff7c8;--pm-bg:var(--soft);--pm-line:var(--line);--pm-text:var(--text);--pm-muted:var(--text);--success:#1e9d68;--shadow:var(--shadow-card);--radius:24px;}


    

    
    .courses-main{scroll-behavior:smooth}
    .courses-main{
      margin:0;
      color:var(--pm-text);
      background:#fff;
      font-family:'Noto Sans Thai','Inter',sans-serif;
      line-height:1.65;
    }
    .courses-main a{text-decoration:none;color:inherit}
    .courses-main button{font:inherit}
    .courses-container{width:min(1180px,calc(100% - 40px));margin:auto}

    /* HERO */
    .courses-hero{
      position:relative;overflow:hidden;
      background:
        radial-gradient(circle at 82% 18%, rgba(255,212,41,.42), transparent 24%),
        radial-gradient(circle at 12% 10%, rgba(63,121,255,.14), transparent 28%),
        linear-gradient(180deg,#fafdff 0%,#f6f8ff 100%);
      padding:80px 0 72px;
    }
    .courses-hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:64px}
    .courses-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:800;color:var(--pm-blue);letter-spacing:.08em;text-transform:uppercase}
    .courses-eyebrow::before{content:"";width:34px;height:4px;border-radius:99px;background:var(--pm-yellow)}
    .courses-main h1{font-size:clamp(42px,6vw,72px);line-height:1.04;letter-spacing:-.035em;margin:18px 0 22px;color:var(--pm-dark)}
    .courses-highlight{color:var(--pm-blue);position:relative;display:inline-block}
    .courses-highlight::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:12px;background:var(--pm-yellow);z-index:-1;border-radius:10px;opacity:.8}
    .courses-hero p{font-size:18px;color:var(--pm-muted);max-width:680px;margin:0 0 30px}
    .courses-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
    .courses-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:999px;font-weight:800;border:1px solid transparent;transition:.2s ease}
    .courses-btn:hover{transform:translateY(-2px)}
    .courses-btn-primary{background:var(--pm-blue);color:#fff;box-shadow:0 12px 26px rgba(2,42,143,.18)}
    .courses-btn-secondary{background:#fff;border-color:#cfd9ef;color:var(--pm-blue)}
    .courses-hero-note{display:flex;gap:24px;flex-wrap:wrap;margin-top:34px;color:#52617d;font-size:13px;font-weight:600}
    .courses-hero-note span{display:flex;align-items:center;gap:8px}
    .courses-check{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#e6f7ef;color:var(--success);font-size:12px;font-weight:900}

    .courses-hero-art{position:relative;min-height:520px}
    .courses-hero-card{
      position:absolute;inset:18px 0 0 40px;border-radius:36px;
      background:linear-gradient(155deg,#0e4bc5 0%,#022a8f 62%,#071a4a 100%);
      box-shadow:0 32px 70px rgba(2,42,143,.23);overflow:hidden;
    }
    .courses-hero-card::before{content:"";position:absolute;width:300px;height:300px;border:46px solid rgba(255,255,255,.08);border-radius:50%;right:-85px;top:-65px}
    .courses-hero-card::after{content:"";position:absolute;width:180px;height:180px;background:var(--pm-yellow);border-radius:50%;left:-80px;bottom:-80px;opacity:.95}
    .courses-portrait-stage{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:35px 22px 0}
    .courses-teacher,.courses-student{position:relative;border-radius:120px 120px 26px 26px;background:#fff;box-shadow:0 18px 40px rgba(0,0,0,.18);overflow:hidden}
    .courses-teacher{width:235px;height:390px;z-index:2;margin-right:-24px}
    .courses-student{width:185px;height:305px;z-index:1;opacity:.98}
    .courses-person-head{width:94px;height:94px;border-radius:50%;background:#f0c6a6;margin:36px auto 0;position:relative}
    .courses-person-head::before{content:"";position:absolute;width:102px;height:54px;border-radius:60px 60px 18px 18px;background:#2c2c39;top:-12px;left:-4px}
    .courses-person-body{height:240px;background:var(--pm-yellow);margin-top:15px;border-radius:50px 50px 0 0}
    .courses-student .courses-person-body{background:#f3f6ff}
    .courses-student .courses-person-head{width:78px;height:78px;margin-top:30px}
    .courses-student .courses-person-head::before{width:86px;height:48px}
    .courses-art-label{position:absolute;left:18px;top:22px;color:#fff;z-index:4}
    .courses-art-label strong{display:block;font-size:23px}.courses-art-label span{font-size:13px;opacity:.78}
    .courses-score-card{position:absolute;right:-10px;top:58px;background:#fff;padding:18px;border-radius:20px;box-shadow:var(--shadow);z-index:5;width:175px}
    .courses-score-card small{color:var(--pm-muted);font-weight:700}.courses-score-card strong{display:block;color:var(--pm-blue);font-size:30px;line-height:1.1;margin-top:5px}
    .courses-mini-chip{position:absolute;left:-8px;bottom:56px;background:var(--pm-yellow);color:var(--pm-dark);padding:11px 16px;border-radius:999px;font-weight:800;font-size:13px;z-index:6;box-shadow:0 10px 22px rgba(0,0,0,.1)}

    .courses-main section{padding:92px 0}
    .courses-section-head{text-align:center;max-width:780px;margin:0 auto 46px}
    .courses-section-head .courses-kicker{color:var(--pm-blue);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
    .courses-section-head h2{font-size:clamp(32px,4vw,48px);line-height:1.15;color:var(--pm-dark);margin:10px 0 14px;letter-spacing:-.025em}
    .courses-section-head p{margin:0;color:var(--pm-muted);font-size:17px}

    /* STARTING POINT */
    .courses-start-section{background:#fff}
    .courses-choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
    .courses-choice-card{border:1px solid var(--pm-line);border-radius:22px;padding:24px;background:#fff;transition:.2s ease;min-height:260px}
    .courses-choice-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#becbf0}
    .courses-choice-icon{width:52px;height:52px;border-radius:16px;background:#edf3ff;display:grid;place-items:center;color:var(--pm-blue);font-size:24px;font-weight:900;margin-bottom:18px}
    .courses-choice-card h3{margin:0 0 8px;color:var(--pm-dark);font-size:19px}
    .courses-choice-card p{color:var(--pm-muted);font-size:14px;margin:0 0 20px}
    .courses-choice-route{font-size:13px;font-weight:800;color:var(--pm-blue);display:flex;align-items:center;gap:8px}
    .courses-choice-route::before{content:"→";color:#d4a900}

    /* PROGRAMS */
    .courses-programs{background:var(--pm-bg)}
    .courses-program-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
    .courses-program-card{position:relative;background:#fff;border:1px solid var(--pm-line);border-radius:28px;padding:30px;box-shadow:0 8px 28px rgba(2,42,143,.05)}
    .courses-program-card.featured{background:linear-gradient(145deg,#0b47c1,#022a8f 72%);color:#fff;border:none;box-shadow:0 22px 52px rgba(2,42,143,.22)}
    .courses-program-card .courses-num{font-size:12px;font-weight:900;letter-spacing:.12em;color:#8795b4}
    .courses-program-card.featured .courses-num{color:#bed0ff}
    .courses-program-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
    .courses-program-card h3{font-size:28px;margin:10px 0 5px;color:var(--pm-dark)}
    .courses-program-card.featured h3{color:#fff}
    .courses-program-sub{font-size:15px;font-weight:700;color:var(--pm-blue)}
    .courses-program-card.featured .courses-program-sub{color:var(--pm-yellow)}
    .courses-hours{min-width:86px;text-align:center;border-radius:18px;padding:12px;background:#f3f6ff;color:var(--pm-blue);font-weight:900}
    .courses-hours span{display:block;font-size:11px;color:#7b86a0;font-weight:700}
    .courses-program-card.featured .courses-hours{background:rgba(255,255,255,.14);color:#fff}.courses-program-card.featured .courses-hours span{color:#d5e0ff}
    .courses-program-card p{color:var(--pm-muted);margin:20px 0 18px}
    .courses-program-card.featured p{color:#dfe8ff}
    .courses-program-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 24px;padding:0;list-style:none;font-size:14px}
    .courses-program-list li{display:flex;gap:8px;align-items:flex-start}.courses-program-list li::before{content:"✓";color:var(--success);font-weight:900}.courses-featured .courses-program-list li::before{color:var(--pm-yellow)}
    .courses-card-link{font-size:14px;font-weight:900;color:var(--pm-blue)}.courses-featured .courses-card-link{color:var(--pm-yellow)}
    .courses-recommended{position:absolute;top:20px;right:20px;background:var(--pm-yellow);color:var(--pm-dark);border-radius:999px;padding:8px 12px;font-size:11px;font-weight:900;letter-spacing:.03em}

    /* SYSTEM */
    .courses-system-wrap{background:#fff;border:1px solid var(--pm-line);border-radius:32px;padding:34px;box-shadow:var(--shadow)}
    .courses-system-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;align-items:stretch}
    .courses-system-step{position:relative;padding:24px 18px;border-radius:22px;background:#f8faff;min-height:180px;border:1px solid #e7ecf8}
    .courses-system-step:not(:last-child)::after{content:"→";position:absolute;right:-19px;top:50%;transform:translateY(-50%);z-index:3;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--pm-yellow);font-weight:900;color:var(--pm-dark)}
    .courses-step-no{font-size:11px;font-weight:900;color:#9aa6c1}.courses-system-step h4{font-size:19px;margin:10px 0 7px;color:var(--pm-blue)}.courses-system-step p{font-size:13px;color:var(--pm-muted);margin:0}

    /* JOURNEY */
    .courses-journey{background:linear-gradient(180deg,#061b4f,#022a8f);color:#fff}
    .courses-journey .courses-section-head h2{color:#fff}.courses-journey .courses-section-head p{color:#cbd8ff}.courses-journey .courses-section-head .courses-kicker{color:var(--pm-yellow)}
    .courses-journey-board{max-width:920px;margin:auto;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:34px;padding:36px;backdrop-filter:blur(10px)}
    .courses-journey-main{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:center}
    .courses-journey-node{background:#fff;color:var(--pm-dark);border-radius:18px;padding:16px 10px;text-align:center;font-size:13px;font-weight:800;min-height:78px;display:grid;place-items:center;position:relative}
    .courses-journey-node:not(:last-child)::after{content:"→";position:absolute;right:-18px;color:var(--pm-yellow);font-size:20px}
    .courses-journey-node.yellow{background:var(--pm-yellow)}
    .courses-decision{margin:28px auto 0;max-width:640px;text-align:center}
    .courses-decision-title{display:inline-block;background:#fff;color:var(--pm-blue);padding:12px 22px;border-radius:999px;font-weight:900}
    .courses-branches{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:22px}
    .courses-branch{padding:20px;border-radius:20px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12)}
    .courses-branch strong{display:block;color:var(--pm-yellow);font-size:13px;margin-bottom:7px}.courses-branch span{font-size:14px;color:#e7edff}

    /* COMPARE */
    .courses-compare-wrap{border:1px solid var(--pm-line);border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .courses-main table{width:100%;border-collapse:collapse;background:#fff}
    .courses-main th,.courses-main td{padding:18px 20px;text-align:left;border-bottom:1px solid #e8edf8;vertical-align:top}
    .courses-main th{background:#f5f8ff;color:var(--pm-blue);font-size:13px;text-transform:uppercase;letter-spacing:.04em}
    .courses-main td{font-size:14px;color:#4c5873}.courses-compare-name{font-weight:900;color:var(--pm-dark)}
    tr:last-child .courses-main td{border-bottom:0}

    /* WHY */
    .courses-why{background:var(--pm-bg)}
    .courses-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
    .courses-why-card{background:#fff;border-radius:24px;padding:26px;border:1px solid var(--pm-line);min-height:220px}
    .courses-why-card .courses-icon{width:80px;height:80px;display:grid;place-items:center;margin-bottom:18px}
    .courses-why-card .courses-icon img{width:112px;height:112px;max-width:none;object-fit:contain}
    .courses-why-card h3{font-size:17px;color:var(--pm-dark);margin:0 0 9px}.courses-why-card p{font-size:14px;color:var(--pm-muted);margin:0}

    /* CTA */
    .courses-cta-section{padding:80px 0;background:#fff}
    .courses-cta-box{position:relative;overflow:hidden;border-radius:34px;padding:52px;background:var(--pm-blue);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:40px}
    .courses-cta-box::after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;border:55px solid rgba(255,255,255,.06);right:-90px;top:-100px}
    .courses-cta-copy{position:relative;z-index:2;max-width:680px}.courses-cta-copy h2{font-size:38px;line-height:1.15;margin:0 0 13px}.courses-cta-copy p{color:#d9e4ff;margin:0}.courses-cta-actions{position:relative;z-index:2;display:flex;flex-direction:column;gap:10px;min-width:220px}.courses-cta-actions .courses-btn-primary{background:var(--pm-yellow);color:var(--pm-dark);box-shadow:none}.courses-cta-actions .courses-btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

    .courses-main footer{padding:28px 0 40px;background:#fff;color:#7b86a0;font-size:13px}.courses-footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

    @media(max-width:980px){
      .courses-nav-links{display:none}
      .courses-hero-grid{grid-template-columns:1fr}.courses-hero-art{min-height:470px}.courses-hero-card{inset:0 40px 0 40px}
      .courses-choice-grid,.courses-why-grid{grid-template-columns:repeat(2,1fr)}
      .courses-system-flow{grid-template-columns:1fr 1fr}.courses-system-step:not(:last-child)::after{display:none}
      .courses-journey-main{grid-template-columns:1fr;gap:10px}.courses-journey-node:not(:last-child)::after{content:"↓";right:auto;bottom:-20px;top:auto;left:50%;transform:translateX(-50%)}
      .courses-cta-box{flex-direction:column;align-items:flex-start}.courses-cta-actions{flex-direction:row;min-width:0;flex-wrap:wrap}
    }

    @media(max-width:700px){
      .courses-container{width:min(100% - 26px,1180px)}
      .courses-nav-inner{height:68px}.courses-nav-cta{display:none}
      .courses-hero{padding:54px 0 50px}.courses-hero p{font-size:16px}.courses-hero-art{min-height:390px}.courses-hero-card{inset:0 10px}.courses-teacher{width:180px;height:315px}.courses-student{width:140px;height:255px}.courses-portrait-stage{padding-bottom:0}.courses-score-card{right:2px;top:45px;width:150px}.courses-mini-chip{left:4px;bottom:30px}
      .courses-main section{padding:68px 0}.courses-choice-grid,.courses-program-grid,.courses-why-grid,.courses-branches{grid-template-columns:1fr}.courses-choice-card{min-height:auto}
      .courses-program-list{grid-template-columns:1fr}.courses-recommended{position:static;display:inline-block;margin-bottom:12px}
      .courses-system-wrap{padding:18px}.courses-system-flow{grid-template-columns:1fr}
      .courses-journey-board{padding:20px}
      .courses-compare-wrap{overflow-x:auto}.courses-main table{min-width:760px}
      .courses-cta-box{padding:34px 24px}.courses-cta-copy h2{font-size:30px}.courses-cta-actions{width:100%;flex-direction:column}.courses-cta-actions .courses-btn{width:100%}
    }
  /* Align the programs page with the shared PromptMind identity. */
.courses-main{line-height:1.7;font-family:inherit}
.courses-main .courses-container{width:min(var(--container-width),var(--container-gutter))}
.courses-main .courses-hero{background:#f5f8ff url('../images/courses-banner.png') center center/cover no-repeat;padding:90px 0;min-height:570px;display:flex;align-items:center}
.courses-main .courses-hero-grid{display:block}
.courses-main .courses-hero-grid>div{max-width:540px}
.courses-main h1{font-size:clamp(40px,4.2vw,62px);line-height:1.13;letter-spacing:-.04em;margin:20px 0 24px}
.courses-main .courses-hero p{max-width:490px;font-size:17px}
.courses-main .courses-hero .courses-btn-primary{background:linear-gradient(135deg,var(--yellow),var(--yellow-dark));color:#153369;box-shadow:0 8px 20px rgba(243,173,0,.20)}
.courses-main .courses-highlight{isolation:isolate}
.courses-main .courses-highlight::after{bottom:2px;height:10px}
.courses-main .courses-hero-note{gap:14px;font-size:12px;max-width:440px}
.courses-main section{padding:var(--section-padding) 0}
.courses-main .courses-section-head h2{font-size:clamp(28px,3.1vw,42px);line-height:1.4}
.courses-main .courses-eyebrow{letter-spacing:.08em;font-size:12px}
.courses-main .courses-choice-card{min-height:250px;display:flex;flex-direction:column;background:var(--soft)}
.courses-main .courses-choice-route{margin-top:auto}
.courses-main .courses-choice-icon{background:#fff;border:1px solid var(--line);font-size:19px}
.courses-main .courses-program-card{padding:32px;display:flex;flex-direction:column;box-shadow:var(--shadow-card);border-radius:var(--radius-panel)}
.courses-main .courses-program-card.featured{background:#fff}
.courses-main .courses-program-card.courses-featured{background:#fffdf3;border:2px solid var(--yellow);color:var(--ink);box-shadow:var(--shadow-card)}
.courses-main .courses-featured h3{color:var(--ink)}
.courses-main .courses-featured .courses-program-sub,.courses-main .courses-featured .courses-card-link{color:var(--brand-blue)}
.courses-main .courses-featured p{color:var(--text)}
.courses-main .courses-featured .courses-num{color:var(--muted)}
.courses-main .courses-featured .courses-hours{background:#fff1b3;color:var(--brand-blue)}
.courses-main .courses-featured .courses-hours span{color:var(--text)}
.courses-main .courses-course-identity{height:120px;display:flex;align-items:center;margin:4px 0 25px;scroll-margin-top:110px}
.courses-main .courses-course-identity img{width:275px;height:115px;object-fit:contain;object-position:left center}
.courses-main .courses-program-card h3{font-size:26px;line-height:1.3;margin:8px 0}
.courses-main .courses-program-top{min-height:108px}
.courses-main .courses-hours{min-width:74px}
.courses-main .courses-card-link{margin-top:auto;border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between}
.courses-main .courses-recommended{top:20px;right:20px}
.courses-main .courses-featured .courses-program-list li::before{color:#247a4f}
.courses-main .courses-system-step{min-width:0}
.courses-main .courses-cta-box{background:var(--brand-blue)}
.courses-main .courses-cta-copy h2{font-size:clamp(28px,3vw,38px)}
.courses-main a:focus-visible,.courses-skip:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}
.courses-skip{position:fixed;top:-100px;left:16px;z-index:100;background:var(--brand-blue);color:#fff;padding:12px 20px;border-radius:12px}
.courses-skip:focus{top:10px}
@media(max-width:980px){
.courses-main .courses-hero{min-height:550px;background-position:58% center;padding:64px 0}
.courses-main .courses-hero-grid>div{max-width:470px;background:rgba(255,255,255,.84);padding:25px;border-radius:22px}
.courses-main .courses-program-top{min-height:135px}
.courses-main .courses-program-card{padding:24px}
.courses-main .courses-program-card h3{font-size:23px}
}
@media(max-width:700px){
.courses-main .courses-hero{padding:0 0 36px;display:block;background-image:none}
.courses-main .courses-hero::before{content:"";display:block;height:230px;background:url('../images/courses-banner.png') 75% center/cover no-repeat}
.courses-main .courses-hero-grid>div{padding:26px 0 0;background:none;max-width:100%}
.courses-main h1{font-size:42px;max-width:530px}
.courses-main .courses-hero-note{gap:12px}
.courses-main section{padding:var(--section-padding-mobile) 0}
.courses-main .courses-program-top{min-height:0}
.courses-main .courses-course-identity{height:95px;margin-bottom:20px}
.courses-main .courses-course-identity img{height:95px;width:245px}
.courses-main .courses-recommended{align-self:flex-start}
.courses-main .courses-hero-actions{gap:10px}
.courses-main .courses-btn{padding:13px 18px;font-size:14px}
.courses-main .courses-section-head{margin-bottom:30px}
.courses-main .courses-choice-card{min-height:0}
}
@media(prefers-reduced-motion:reduce){.courses-main *{scroll-behavior:auto!important;transition:none!important}.courses-main .courses-btn:hover,.courses-main .courses-choice-card:hover{transform:none}}
