/* shell-c.css — เปลือกเว็บแบบ C (ท่านคิวเลือก 22 ต.ค. 2569)
   ทุกคลาสขึ้นต้น c- เพื่อไม่ให้ไปชนกับกระดานงานแบบเดิม (.dek-scope) ที่ฝังอยู่ในหน้า */
:root{--c-pad:clamp(14px,2.2vw,40px);--c-brand:#2f6fed;--c-brand-2:#7c5cff;--c-ink:#1d2433;--c-mute:#667085;--c-line:#e8ecf3;--c-bg:#f4f7fc;--c-mint:#12b886}
.c-body{margin:0;font-family:'Noto Sans Thai',system-ui,sans-serif;color:var(--c-ink);background:var(--c-bg);line-height:1.6}
.c-body *{box-sizing:border-box}
.c-hd a,.c-hero a,.c-sec a,.c-ft a{color:inherit;text-decoration:none}
.c-wrap{max-width:1840px;margin:0 auto;padding:0 var(--c-pad)}
.c-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:999px;font:600 15px 'Noto Sans Thai',sans-serif;border:0;cursor:pointer;white-space:nowrap}
.c-btn.pri{background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2));color:#fff;box-shadow:0 8px 20px rgba(47,111,237,.3)}
.c-btn.soft{background:#fff;color:var(--c-ink);box-shadow:0 0 0 1px var(--c-line)}
/* header */
.c-hd{position:sticky;top:12px;z-index:50;padding:0 var(--c-pad)}
.c-bar{max-width:calc(1840px - 2 * var(--c-pad));margin:12px auto 0;display:flex;align-items:center;gap:24px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border-radius:999px;padding:8px 8px 8px 22px;box-shadow:0 6px 24px rgba(29,36,51,.07)}
.c-bar img{height:30px;display:block}
.c-nav{display:flex;gap:2px;font-weight:500;font-size:15px}
.c-nav a{padding:8px 14px;border-radius:999px;color:var(--c-mute);white-space:nowrap}
.c-nav a:hover{background:var(--c-bg);color:var(--c-ink)}.c-nav a.on{background:var(--c-ink);color:#fff}
.c-sp{flex:1}.c-burger{display:none}
/* hero */
.c-hero{text-align:center;padding:64px 20px 24px}
.c-badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:6px 14px 6px 6px;font-size:14px;font-weight:500;box-shadow:0 2px 10px rgba(29,36,51,.06)}
.c-badge b{background:var(--c-mint);color:#fff;border-radius:999px;padding:3px 10px 4px;font-size:12px;line-height:1.4}
/* ฟอนต์ไทยมีช่องว่างใต้บรรทัดมาก ข้อความเลยดูจม — ใช้ line-height ปกติ + ยกข้อความขึ้นนิดหนึ่ง */
.c-badge{line-height:1.5;padding:6px 16px 8px 6px}
.c-hero h1{font-size:52px;line-height:1.18;margin:20px auto 14px;max-width:820px;font-weight:700}
.c-hero h1 span{background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.c-lead{color:var(--c-mute);font-size:18px;margin:0 auto 30px;max-width:640px}
.c-search{display:flex;gap:8px;max-width:680px;margin:0 auto;background:#fff;border-radius:999px;padding:8px;box-shadow:0 14px 40px rgba(29,36,51,.1)}
.c-search input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:16px;padding:8px 18px;border-radius:999px;background:transparent}
.c-pop{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center;margin-top:18px;font-size:14px;color:var(--c-mute)}
.c-pop button{border:0;background:#fff;border-radius:999px;padding:5px 12px;font:inherit;color:var(--c-ink);cursor:pointer}
.c-pop button:hover{background:var(--c-ink);color:#fff}
.c-acts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px;text-align:left}
.c-act{border-radius:24px;padding:24px;color:#fff;position:relative;overflow:hidden;min-height:140px;display:flex;flex-direction:column;justify-content:flex-end;transition:.2s}
.c-act:hover{transform:translateY(-4px)}
.c-act:before{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.15);right:-40px;top:-50px}
.c-act b{font-size:19px;position:relative}.c-act small{opacity:.9;position:relative}
.c-act.a1{background:linear-gradient(135deg,#ff6b6b,#f06595)}.c-act.a2{background:linear-gradient(135deg,#2f6fed,#4dabf7)}.c-act.a3{background:linear-gradient(135deg,#7c5cff,#b197fc)}
/* sections */
.c-sec{padding:48px 0}
.c-sh{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px}
.c-sh h2{font-size:28px;margin:0;font-weight:700}.c-sh p{margin:2px 0 0;color:var(--c-mute)}
/* กระดานเดิม: วางบนพื้นขาวมุมโค้งให้เข้ากับแบบ C */
.c-board #dek-board{background:#fff;border-radius:28px;padding:20px;box-shadow:0 2px 10px rgba(29,36,51,.04)}
/* services */
.c-svcs{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.c-big{border-radius:28px;padding:36px;background:var(--c-ink);color:#fff!important;display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-height:300px;position:relative;overflow:hidden}
.c-big:after{content:"";position:absolute;right:-60px;bottom:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,var(--c-brand-2),transparent 70%);opacity:.6}
.c-big h3{font-size:30px;margin:0 0 8px}.c-big p{color:#b7c0d1;margin:0}
.c-big .c-btn{align-self:flex-start;position:relative;z-index:1}
.c-stack{display:grid;gap:20px}
.c-sm{background:#fff;border-radius:28px;padding:26px;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:.15s}
.c-sm:hover{box-shadow:0 0 0 2px var(--c-brand)}
.c-sm h3{margin:0;font-size:20px}.c-sm p{margin:2px 0 0;color:var(--c-mute);font-size:14px}
.c-arr{flex:none;width:44px;height:44px;border-radius:50%;background:var(--c-bg);display:grid;place-items:center;font-weight:700}
/* footer */
.c-ft{margin-top:40px;background:#fff;border-radius:32px 32px 0 0;padding:44px 0 24px;font-size:15px;color:var(--c-mute)}
.c-ft .c-wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.c-ft img{height:30px}
.c-ft h4{color:var(--c-ink);margin:0 0 10px}
.c-ft a{display:block;padding:3px 0}.c-ft a:hover{color:var(--c-brand)}
.c-copy{grid-column:1/-1;border-top:1px solid var(--c-line);padding-top:16px}
/* เมนูย่อย "บริการ" */
.c-dd{position:relative}
.c-dd>a{display:block}
.c-dd__menu{position:absolute;top:100%;left:0;min-width:220px;background:#fff;border-radius:18px;padding:8px;box-shadow:0 14px 40px rgba(29,36,51,.14);display:none;margin-top:6px}
.c-dd__menu:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.c-dd:hover .c-dd__menu,.c-dd:focus-within .c-dd__menu{display:block}
.c-dd__menu a{display:block;padding:9px 14px;border-radius:12px;color:var(--c-ink)!important;background:none!important}
.c-dd__menu a:hover{background:var(--c-bg)!important}
/* เมนูมือถือ */
.c-drawer{position:sticky;top:76px;z-index:49;margin:8px 12px 0;background:#fff;border-radius:24px;padding:10px;box-shadow:0 14px 40px rgba(29,36,51,.14);display:grid}
.c-drawer[hidden]{display:none}
.c-drawer a{padding:11px 16px;border-radius:14px;color:var(--c-ink);text-decoration:none;font-weight:500}
.c-drawer a:hover{background:var(--c-bg)}
.c-drawer a.sub{padding-left:30px;color:var(--c-mute);font-weight:400}
.c-drawer b{padding:11px 16px 2px;font-size:13px;color:var(--c-mute)}
/* ช่องทางติดต่อ (partials/contact.html) */
.c-contact{display:grid;grid-template-columns:1fr 1.1fr;gap:20px}
.c-contact__list{display:grid;gap:12px;align-content:start}
.c-ci{display:flex;align-items:center;gap:16px;background:#fff;border-radius:22px;padding:16px 18px;color:var(--c-ink);text-decoration:none;transition:.15s}
a.c-ci:hover{box-shadow:0 0 0 2px var(--c-brand)}
.c-psec:nth-child(even) .c-ci{background:var(--c-bg)}
.c-ci__ico{flex:none;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;color:#fff;background:var(--k)}
.c-ci__ico svg{width:22px;height:22px}
.c-ci small{display:block;color:var(--c-mute);font-size:13px}
.c-ci b{font-weight:600;line-height:1.4}
.c-contact__map{width:100%;min-height:380px;height:100%;border:0;border-radius:24px;background:#e8ecf3}
/* หน้าเกี่ยวกับเรา */
.c-about{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;align-items:start}
.c-about .c-card h3{margin:0 0 8px;font-size:20px}
.c-about .c-card p{margin:0;color:#3d4658;line-height:1.8}
.c-why{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.c-why .c-card b{display:block;font-size:18px;margin:10px 0 4px}
.c-why .c-card p{margin:0;color:var(--c-mute)}
.c-num{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:14px;background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2));color:#fff;font-weight:700}
.c-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.c-list li{display:flex;gap:10px;align-items:flex-start}
.c-list li:before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--c-mint);margin-top:10px}
@media(max-width:900px){.c-contact,.c-about,.c-why{grid-template-columns:1fr}.c-contact__map{min-height:280px}}
/* ---------- โหมดแก้ไขของแอดมิน (edit.js) ---------- */
.c-copy .c-admin-link{display:inline;color:var(--c-mute);opacity:.7}
#c-admin{position:fixed;right:16px;bottom:16px;z-index:200;background:var(--c-ink);color:#fff;border-radius:20px;padding:10px 12px;box-shadow:0 14px 40px rgba(0,0,0,.25);font-size:14px;max-width:calc(100vw - 32px)}
.c-admin__row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.c-admin__row span{padding:0 6px}
.c-admin__hint{font-size:12px;color:#b7c0d1;padding:2px 6px 8px}
#c-admin button{border:0;border-radius:999px;padding:8px 14px;font:600 13px 'Noto Sans Thai',sans-serif;cursor:pointer;background:rgba(255,255,255,.12);color:#fff}
#c-admin button.pri{background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2))}
#c-admin button.warn{background:transparent;color:#ffa8a8}
#c-admin button:disabled{opacity:.5}
.c-editing [contenteditable=true]{outline:1.5px dashed rgba(47,111,237,.55);outline-offset:3px;border-radius:4px;cursor:text}
.c-editing [contenteditable=true]:focus{outline:2px solid var(--c-brand);background:rgba(47,111,237,.05)}
/* หัวข้อไล่สี (background-clip:text) จะหายเมื่อโฟกัส — ตอนแก้ให้เป็นสีทึบ */
.c-editing .c-phero h1,.c-editing .c-hero h1 span{background:none!important;-webkit-background-clip:border-box;background-clip:border-box;color:var(--c-ink)}
.c-editing img[data-c-img]{outline:1.5px dashed rgba(124,92,255,.7);outline-offset:3px;cursor:pointer}
.c-modal{position:fixed;inset:0;z-index:300;background:rgba(15,20,35,.45);display:grid;place-items:center;padding:16px}
.c-modal__box{background:#fff;border-radius:24px;padding:26px;width:100%;max-width:400px;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.c-modal__box h3{margin:0 0 6px;font-size:22px}.c-modal__box p{margin:0 0 16px;color:var(--c-mute)}
.c-modal__box input{width:100%;padding:12px 16px;border:1px solid var(--c-line);border-radius:14px;font:inherit;margin-bottom:10px}
.c-modal__msg{color:#e03131;font-size:14px;min-height:20px}
.c-modal__act{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
.c-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:400;background:var(--c-ink);color:#fff;padding:12px 20px;border-radius:999px;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.2)}
/* หน้าแจ้ง (ต้องล็อกอิน / ไม่พบ) */
.c-note{text-align:center;padding:80px 20px}
.c-note h1{font-size:34px;margin:16px 0 8px}.c-note p{color:var(--c-mute);margin:0 0 24px}
.c-note code{background:#fff;padding:2px 8px;border-radius:8px}
/* ---------- เนื้อหาหน้าที่ render.js จัดให้ ---------- */
.c-psec{padding:40px 0}
.c-psec__head{text-align:center;max-width:820px;margin:0 auto 28px}
.c-psec__head .c-h{margin:0 0 6px}
.c-phero{padding:64px 0 48px;background:radial-gradient(900px 400px at 80% 0%,rgba(124,92,255,.14),transparent 60%),radial-gradient(700px 360px at 0% 100%,rgba(47,111,237,.12),transparent 60%)}
.c-phero h1{font-size:44px;line-height:1.2;margin:0 0 14px;background:linear-gradient(135deg,var(--c-ink),var(--c-brand) 70%,var(--c-brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.c-h{line-height:1.3;margin:22px 0 10px;font-weight:700}
#c-page h2.c-h{font-size:30px}#c-page h3.c-h{font-size:22px}#c-page h4.c-h,#c-page h5.c-h,#c-page h6.c-h{font-size:18px}
#c-page p.c-h,#c-page div.c-h{font-size:17px;font-weight:600}
.c-h a{color:inherit}
.c-text{color:#3d4658;font-size:16.5px;line-height:1.8}
.c-text p{margin:0 0 12px}.c-text ul,.c-text ol{padding-left:22px;margin:0 0 12px}.c-text li{margin:4px 0}
.c-text a{color:var(--c-brand)!important;text-decoration:underline!important}
.c-text table{width:100%;border-collapse:collapse;margin:12px 0}.c-text td,.c-text th{border:1px solid var(--c-line);padding:8px 10px}
.c-img{display:block;max-width:100%;height:auto;border-radius:22px;margin:12px auto}
.c-cta{margin:14px 8px 6px 0}
.c-video{position:relative;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#000;margin:16px 0;max-width:960px;margin-inline:auto}
.c-video iframe,.c-video video{position:absolute;inset:0;width:100%;height:100%;border:0}
.c-hr{border:0;border-top:1px solid var(--c-line);margin:24px 0}
.c-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.c-split>*,.c-grid>*{min-width:0}
#c-page .c-text,#c-page .c-h{overflow-wrap:anywhere}
.c-split .c-img{margin:0 auto;max-height:460px;width:auto;object-fit:contain}
#c-page>section>.c-wrap>.c-img{max-height:560px;width:auto}
.c-grid{display:grid;gap:18px;margin:18px 0}
.c-grid--2{grid-template-columns:repeat(2,1fr)}.c-grid--3{grid-template-columns:repeat(3,1fr)}.c-grid--4{grid-template-columns:repeat(4,1fr)}
.c-card{background:#fff;border-radius:24px;padding:22px;box-shadow:0 2px 10px rgba(29,36,51,.05)}
.c-psec:nth-child(even) .c-card{background:var(--c-bg);box-shadow:none}
.c-card>.c-h:first-child{margin-top:0}
.c-card .c-img{border-radius:16px}
.c-ibox{background:#fff;border-radius:20px;padding:20px;margin:8px 0}
.c-ibox h4{margin:0 0 4px}.c-ibox p{margin:0;color:var(--c-mute)}
.c-slides{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;border-radius:28px}
.c-slide{scroll-snap-align:start;min-height:320px;border-radius:28px;background:var(--c-ink) center/cover no-repeat;display:flex;align-items:flex-end;position:relative;overflow:hidden}
.c-slide:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,20,35,.75),rgba(15,20,35,.05))}
.c-slide>div{position:relative;padding:28px;color:#fff;text-align:left}
.c-slide h3{font-size:28px;margin:0 0 6px}.c-slide p{margin:0 0 14px;opacity:.9}
/* เนื้อหาเดิมที่ยกมาทั้งก้อน (ฟอร์มสมาชิก · การ์ดหลักสูตร) */
.c-raw{overflow-x:auto}
.c-raw input:not([type=checkbox]):not([type=radio]),.c-raw select,.c-raw textarea{width:100%;max-width:520px;padding:11px 14px;border:1px solid var(--c-line);border-radius:14px;font:inherit;background:#fff;margin:4px 0 12px}
.c-raw button,.c-raw input[type=submit]{padding:11px 22px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2));color:#fff;font:600 15px 'Noto Sans Thai',sans-serif;cursor:pointer}
.c-raw img{max-width:100%;height:auto}
@media(max-width:1260px){.c-nav,.c-hide-m{display:none}.c-burger{display:inline-flex}}
/* ล็อกอินแล้วมีชิปชื่อ+Logout เพิ่ม — บีบ header ไม่ให้ล้น · แอดมิน: โชว์แถบดำ WP (html.jv-native ซ่อนไว้) ส่วน user ทั่วไปไม่มี admin-bar อยู่แล้ว header จึงชิดบน */
@media(min-width:1261px) and (max-width:1560px){.c-body .c-hd .c-bar{gap:12px!important}.c-body .c-hd .c-nav{font-size:14px!important}.c-body .c-hd .c-nav a{padding:8px 9px!important}}
.c-body .c-hd .c-bar>a.c-btn{flex-shrink:0!important}
.c-body .c-hd .c-bar>a.c-btn.pri{max-width:150px;text-overflow:ellipsis!important;white-space:nowrap}
html.jv-native body>#wpadminbar#wpadminbar#wpadminbar{display:block!important}
@media(min-width:1261px) and (max-width:1490px){.c-body .c-hd .c-hd-cta{display:none!important}}
@media(max-width:900px){.c-split,.c-grid--2,.c-grid--3,.c-grid--4{grid-template-columns:1fr}.c-phero h1{font-size:32px}#c-page h2.c-h{font-size:24px}.c-psec{padding:28px 0}}
@media(min-width:561px) and (max-width:900px){.c-grid--3,.c-grid--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
 .c-hero h1{font-size:34px}.c-acts,.c-svcs{grid-template-columns:1fr}
 .c-ft .c-wrap{grid-template-columns:1fr}
 .c-board #dek-board{padding:10px;border-radius:20px}.c-board .c-wrap{padding:0 10px}
}
@media(max-width:560px){.c-bar{gap:8px;padding-left:14px}.c-bar img{height:24px}.c-bar .c-btn{padding:9px 12px;font-size:14px}}
/* ของที่ Elementor ตั้งซ่อนตามขนาดจอ (tools/convert.js · ⚠️ อย่าใช้ชื่อ c-hd = หัวเว็บ) — จุดตัดเดียวกับ Elementor: มือถือ ≤767 · แท็บเล็ต 768–1024 · คอม ≥1025 */
@media(min-width:1025px){.c-off-d{display:none!important}}
@media(min-width:768px) and (max-width:1024px){.c-off-t{display:none!important}}
@media(max-width:767px){.c-off-m{display:none!important}}
/* แถว/คอลัมน์ตามโครงเดิมของ Elementor (tools/convert.js) — กว้างตาม % เดิม · มือถือพับเป็นแนวตั้ง */
.c-row{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;margin:12px 0}
.c-row--rev{flex-direction:row-reverse}
.c-col{flex:1 1 0;min-width:0}
.c-col[style*="--w"]{flex:0 1 calc(var(--w) - 24px)}
.c-col>.c-img:first-child{margin-top:0}
@media(max-width:767px){.c-row,.c-row--rev{flex-direction:column;align-items:stretch}.c-col,.c-col[style*="--w"]{flex:1 1 auto}.c-img[style]{width:auto!important;max-width:100%}}

/* ฟอนต์ทั้งเว็บ: Noto Sans Thai (ท่านคิวเลือก 23 ต.ค. 2569 — เดิม Sukhumvit Set ฝังไฟล์ในซีเอสเอส ~580KB ถอดออกแล้ว ไฟล์ต้นฉบับยังอยู่ในโฟลเดอร์ Font/) */
html body,html body button,html body input,html body select,html body textarea,html body :not(svg):not(svg *):not(.dashicons):not(.fa):not(.fas):not(.far):not(.fab):not([class^="icon-"]):not([class*=" icon-"]):not([class*="fa-"]){font-family:'Noto Sans Thai',sans-serif!important}
#c-admin .c-admin__go{border-radius:999px;padding:8px 14px;font:600 13px 'Noto Sans Thai',sans-serif;background:#fff;color:#14338f;text-decoration:none}
