/* Kidplearn — หน้าแรก [kidplearn_home] */
.kph{--kph-r:22px;overflow:hidden}
.kph *{box-sizing:border-box}
.kpm-main .kph img{max-width:100%;display:block}
.kph a{text-decoration:none}
.kph-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.kph-sec{padding:64px 0}
.kph-bg-sky{background:linear-gradient(180deg,#EAF7FC 0%,#F4F8FC 100%)}
.kph-bg-cream{background:var(--kp-cream)}
.kph-head{max-width:720px;margin:0 0 32px}
.kph-head-row{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.kph-eyebrow{display:inline-block;margin:0 0 8px;font-size:14px;font-weight:800;letter-spacing:.02em;color:var(--kp-orange-d);background:#FFEAD5;padding:4px 14px;border-radius:999px}
.kph-h2{font-size:34px;line-height:1.25;font-weight:800;color:var(--kp-navy);margin:0 0 8px}
.kph-sub{font-size:17px;color:var(--kp-mute);margin:0}

/* hero */
.kph-hero{position:relative;padding:56px 0 72px;background:radial-gradient(1200px 500px at 85% 20%,#FFE3C4 0%,rgba(255,227,196,0) 60%),linear-gradient(180deg,#FFF6EC 0%,#FFFFFF 100%)}
.kph-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center}
.kph-kicker{font-weight:800;color:var(--kp-teal);margin:0 0 10px;font-size:15px}
.kph-h1{font-size:54px;line-height:1.15;font-weight:800;color:var(--kp-navy);margin:0 0 16px}
.kph-h1 span{display:inline-block;color:var(--kp-orange);position:relative}
.kph-h1 span:after{content:"";position:absolute;left:0;right:0;bottom:4px;height:12px;background:#FFD7A8;z-index:-1;border-radius:6px}
.kph-lead{font-size:18px;color:var(--kp-ink);margin:0 0 22px;max-width:560px}
.kph-search{display:flex;gap:8px;background:#fff;border:2px solid var(--kp-line);border-radius:999px;padding:6px;max-width:560px;box-shadow:0 10px 30px rgba(31,37,68,.08)}
.kph-search:focus-within{border-color:var(--kp-orange)}
.kph-search input{flex:1;min-width:0;border:0!important;outline:0;background:transparent!important;font-size:16px;padding:8px 14px!important;box-shadow:none!important;height:auto!important}
.kph-search .kpm-btn{padding:10px 22px}
.kph-cta{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0 22px}
.kph-stats{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.kph-stats a{display:flex;align-items:baseline;gap:6px;background:#fff;border:1px solid var(--kp-line);border-radius:14px;padding:8px 14px;color:var(--kp-ink);font-size:14px;font-weight:600}
.kph-stats b{font-size:22px;color:var(--kp-navy);font-weight:800}
.kph-stats a:hover{border-color:var(--kp-orange)}
.kph-hero-art{position:relative;height:460px}
.kph-blob{position:absolute;inset:40px 30px 10px;border-radius:46% 54% 42% 58%/55% 45% 55% 45%;background:linear-gradient(140deg,#7DD3FC 0%,#38BDF8 45%,#0EA5E9 100%);box-shadow:inset 0 -30px 60px rgba(14,116,144,.25)}
.kpm-main .kph-a{position:absolute;filter:drop-shadow(0 14px 20px rgba(31,37,68,.25))}
.kpm-main .kph-a-robot{height:78%;left:50%;bottom:6%;transform:translateX(-50%);z-index:2}
.kpm-main .kph-a-girl{height:52%;left:2%;bottom:2%;z-index:3}
.kpm-main .kph-a-boy{height:50%;right:0;bottom:2%;z-index:3}
.kpm-main .kph-f{position:absolute;width:64px;z-index:4;animation:kph-float 5s ease-in-out infinite}
.kpm-main .kph-f0{width:84px;top:2%;left:12%}.kpm-main .kph-f1{width:62px;top:6%;right:10%;animation-delay:-1s}.kpm-main .kph-f2{width:70px;top:38%;right:-2%;animation-delay:-2s}
.kpm-main .kph-f3{width:52px;top:30%;left:-2%;animation-delay:-3s}.kpm-main .kph-f4{width:46px;top:0;left:48%;animation-delay:-1.5s}.kpm-main .kph-f5{width:58px;bottom:42%;left:20%;animation-delay:-2.5s;transform:rotate(-20deg)}
.kpm-main .kph-f6{width:44px;bottom:0;left:38%;animation-delay:-.5s}.kpm-main .kph-f7{width:50px;top:22%;right:24%;animation-delay:-3.5s}
@keyframes kph-float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@media (prefers-reduced-motion:reduce){.kpm-main .kph-f{animation:none}}

/* 6 ชุดสื่อ */
.kph-sets{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.kph-set{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:var(--kph-r);border:1px solid var(--kp-line);overflow:hidden;color:inherit;transition:transform .15s,box-shadow .15s}
.kph-set:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(31,37,68,.14)}
.kph-set-top{position:relative;height:132px;display:flex;align-items:flex-end;justify-content:space-between;padding:0 20px 12px}
.kph-tone-o .kph-set-top{background:linear-gradient(135deg,#FFE3C4,#FFC48A)}
.kph-tone-p .kph-set-top{background:linear-gradient(135deg,#F1EBFE,#D8C8FD)}
.kph-tone-g .kph-set-top{background:linear-gradient(135deg,#F1F8E6,#C9E8A2)}
.kph-tone-b .kph-set-top{background:linear-gradient(135deg,#EAF7FC,#A7E0F5)}
.kpm-main .kph-set-mascot{position:absolute;right:16px;bottom:0;height:122px;width:46%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 8px 12px rgba(31,37,68,.2));transition:transform .2s}
.kph-set:hover .kph-set-mascot{transform:translateY(-4px) rotate(-3deg)}
.kph-set-n{background:#fff;border-radius:999px;padding:4px 14px;font-size:14px;font-weight:700;color:var(--kp-ink);box-shadow:0 4px 12px rgba(31,37,68,.1)}
.kph-set-n b{font-size:18px;color:var(--kp-navy)}
.kph-set-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.kph-set-k{margin:0;font-size:14px;font-weight:800;color:var(--kp-orange-d)}
.kph-set h3{margin:0;font-size:21px;line-height:1.3;font-weight:800;color:var(--kp-navy)}
.kph-set-body>p{margin:0;font-size:15px;color:var(--kp-mute)}
.kph-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:auto;padding-top:8px}
.kpm-main .kph-thumbs img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;background:var(--kp-soft)}
.kpm-main .kph-set-ws .kph-thumbs img{aspect-ratio:3/4;object-position:top;border:1px solid var(--kp-line)}
.kpm-main .kph-set-app .kph-thumbs img{aspect-ratio:1/1;border-radius:22%;box-shadow:0 3px 8px rgba(31,37,68,.15)}
.kph-more{font-weight:800;color:var(--kp-orange-d);font-size:15px}
.kph-also{margin:24px 0 0;text-align:center;color:var(--kp-mute);font-weight:600}
.kph-also a{color:var(--kp-teal);font-weight:700}

/* tiles วิชา / ชั้น */
.kph-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kph-grades{grid-template-columns:repeat(4,1fr)}
.kph-tile{background:#fff;border:1px solid var(--kp-line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px}
.kph-tile-h{display:flex;align-items:center;gap:14px;color:inherit}
.kpm-main .kph-tile-h img{width:60px;height:60px;object-fit:contain;flex:none;background:var(--kp-soft);border-radius:16px;padding:6px}
.kph-tile-h span{display:flex;flex-direction:column}
.kph-tile-h b{font-size:19px;color:var(--kp-navy);font-weight:800;line-height:1.3}
.kph-tile-h em{font-style:normal;font-size:14px;color:var(--kp-mute)}
.kph-tile-h:hover b{color:var(--kp-orange-d)}
.kph-tile-t{margin:0;font-size:14px;color:var(--kp-mute)}
.kph-tchips{display:flex;flex-wrap:wrap;gap:6px}
.kph-tchip{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--kp-ink);background:var(--kp-soft);border:1px solid var(--kp-line);border-radius:999px;padding:3px 10px}
.kph-tchip b{color:var(--kp-navy)}
.kph-tchip:hover{background:#FFEAD5;border-color:#FFC48A}

/* เหมาะกับใคร */
.kph-who{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.kph-who-c{background:#fff;border-radius:var(--kph-r);padding:24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 8px 24px rgba(31,37,68,.06)}
.kpm-main .kph-who-c img{height:150px;width:auto;object-fit:contain;margin-bottom:6px}
.kph-who-c h3{margin:0;font-size:21px;font-weight:800;color:var(--kp-navy)}
.kph-who-c p{margin:0;color:var(--kp-mute);font-size:15px}
.kph-who-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.kph-who-chips span{font-size:13px;font-weight:700;color:#3F6212;background:var(--kp-lime);border-radius:999px;padding:3px 12px}

/* ใหม่ล่าสุด */
.kph-latest{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}

/* แอป */
.kph-apps{background:linear-gradient(135deg,#1F2544 0%,#2B3260 100%);color:#DDE3F0;padding:64px 0}
.kph-apps-in{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:center}
.kpm-main .kph-apps-robot{max-height:360px;width:auto!important;margin:0 auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.4))}
.kph-apps .kph-eyebrow{background:rgba(247,132,31,.18);color:#FFB46B}
.kph-apps .kph-h2{color:#fff}
.kph-apps-txt>p{font-size:17px;margin:0 0 18px;max-width:640px}
.kph-badges{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:22px}
.kpm-main .kph-badges img{height:52px;width:auto}
.kph-appicons{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.kpm-main .kph-appicons img{width:58px;height:58px;border-radius:14px;object-fit:cover;box-shadow:0 6px 14px rgba(0,0,0,.3);transition:transform .15s}
.kph-appicons a:hover img{transform:translateY(-3px) scale(1.05)}
.kph-link{color:#FFB46B!important;font-weight:800}

/* ปิดท้าย */
.kph-end{text-align:center;padding:64px 0 72px;background:linear-gradient(180deg,#fff 0%,#FFF6EC 100%)}
.kpm-main .kph-end img{height:110px;width:auto;margin:0 auto 10px}
.kph-end h2{font-size:32px;font-weight:800;color:var(--kp-navy);margin:0 0 6px}
.kph-end p{color:var(--kp-mute);font-size:17px;margin:0 0 20px}

@media (max-width:1024px){
 .kph-h1{font-size:44px}.kph-hero-in{grid-template-columns:1fr}.kph-hero-art{height:380px;max-width:560px;width:100%;margin:0 auto}
 .kph-sets,.kph-tiles{grid-template-columns:repeat(2,1fr)}.kph-grades,.kph-latest{grid-template-columns:repeat(3,1fr)}
 .kph-apps-in{grid-template-columns:200px 1fr}
}
@media (max-width:680px){
 .kph-wrap{padding:0 16px}.kph-sec{padding:48px 0}.kph-hero{padding:32px 0 40px}
 .kph-h1{font-size:34px}.kph-h2{font-size:26px}.kph-lead{font-size:16px}
 .kph-hero-art{height:300px}.kpm-main .kph-f{width:44px!important}
 .kph-sets,.kph-tiles,.kph-who{grid-template-columns:1fr}.kph-grades,.kph-latest{grid-template-columns:repeat(2,1fr)}
 .kph-grades .kph-tchips{display:none}
 .kph-apps-in{grid-template-columns:1fr;text-align:center}.kpm-main .kph-apps-robot{max-height:220px}.kph-badges,.kph-appicons{justify-content:center}
 .kph-search .kpm-btn{padding:10px 16px}
}
/* อีโมจิของ WordPress (img.emoji) ต้องอยู่ในบรรทัด */
.kpm-main .kph img.emoji{display:inline!important;width:1em!important;height:1em!important;margin:0 .15em 0 0!important;vertical-align:-.12em;box-shadow:none!important;border:0!important;background:none!important;padding:0!important}
/* hero: ลิงก์ชนิดสื่อ (ไม่มีตัวเลข) */
.kph-stats a{align-items:center;font-size:15px;font-weight:700;color:var(--kp-navy)}
/* ตัวอย่างสื่อแต่ละแบบ */
.kph-bg-soft{background:var(--kp-soft)}
.kph-set-top{height:118px}
.kph-row{margin:0 0 40px}.kph-row:last-child{margin-bottom:0}
.kph-row-head{display:flex;align-items:center;gap:14px;margin:0 0 14px}
.kpm-main .kph-row-mascot{width:56px;height:56px;object-fit:contain;flex:none;background:#fff;border-radius:16px;padding:4px;box-shadow:0 4px 12px rgba(31,37,68,.08)}
.kph-row-txt{flex:1;min-width:0}.kph-row-txt h3{margin:0;font-size:22px;font-weight:800;color:var(--kp-navy);line-height:1.3}
.kph-row-txt .kph-set-k{margin:0;font-size:14px}
.kph-cards{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}
.kph-row-ws .kph-cards{grid-template-columns:repeat(5,1fr)}
.kph-row-app .kph-cards{grid-template-columns:repeat(6,1fr)}
.kph .kpm-ex-card{transition:transform .15s,box-shadow .15s}.kph .kpm-ex-card:hover{transform:translateY(-3px)}
/* ใบงาน = แผ่นกระดาษเต็มใบ */
.kph-row-ws .kpm-ex-thumb{aspect-ratio:1/1.414;background:#EEF2F7}
.kpm-main .kph-row-ws .kpm-ex-t-worksheet .kpm-ex-thumb img{inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);min-height:0;object-fit:contain;object-position:center;box-shadow:0 4px 12px rgba(31,37,68,.15);border-radius:3px}
/* แอป = ไอคอนสี่เหลี่ยม */
.kph-row-app .kpm-ex-thumb{aspect-ratio:1/1}
.kpm-main .kph-row-app .kpm-ex-t-app .kpm-ex-thumb img{height:76%}
.kph-row-app .kpm-ex-title{font-size:15px}
/* เพลง/การ์ตูน 16:9 · บทเรียน 3:2 */
.kph-row-if .kpm-ex-thumb,.kph-row-em .kpm-ex-thumb,.kph-row-ems .kpm-ex-thumb{aspect-ratio:16/9}
.kph-row-h5 .kpm-ex-thumb{aspect-ratio:3/2}
.kph-row-if .kpm-ex-thumb img,.kph-row-em .kpm-ex-thumb img,.kph-row-ems .kpm-ex-thumb img,.kph-row-h5 .kpm-ex-thumb img{object-position:center}
@media (max-width:1024px){.kph-cards{grid-template-columns:repeat(3,1fr)}.kph-row-ws .kph-cards{grid-template-columns:repeat(4,1fr)}.kph-row-app .kph-cards{grid-template-columns:repeat(4,1fr)}
 .kph-cards>:nth-child(n+4){display:none}.kph-row-ws .kph-cards>:nth-child(4),.kph-row-app .kph-cards>:nth-child(4){display:flex}}
@media (max-width:680px){.kph-cards,.kph-row-ws .kph-cards{grid-template-columns:repeat(2,1fr);gap:10px}.kph-row-app .kph-cards{grid-template-columns:repeat(3,1fr)}
 .kph-cards>:nth-child(n+3){display:none}.kph-row-app .kph-cards>:nth-child(3){display:flex}
 .kph-row-ws .kph-cards>:nth-child(n+3){display:none}.kph-row-head{flex-wrap:wrap}.kph-row-all{order:3}.kph-row-txt h3{font-size:19px}}
/* วิดีโอแนะนำแอป (ต่อจาก hero) */
.kph-video{padding:8px 0 24px;background:#fff}
.kph-video-in{position:relative;max-width:880px;margin:0 auto}
.kph-video .kpm-player{border-radius:20px;box-shadow:0 24px 50px rgba(31,37,68,.22)}
.kph-video .kpm-play{width:84px;height:84px;font-size:36px}
.kpm-main .kph-video-robot{position:absolute;right:-70px;bottom:10px;height:170px;width:auto;z-index:2;pointer-events:none;filter:drop-shadow(0 12px 18px rgba(31,37,68,.3))}
.kph-vid-cap{margin:14px 0 0;text-align:center;color:var(--kp-mute);font-size:15px;font-weight:700}
@media (max-width:1024px){.kpm-main .kph-video-robot{right:-10px;height:130px;bottom:-24px}}
@media (max-width:680px){.kpm-main .kph-video-robot{height:84px;right:-6px;bottom:-14px}}
/* จริงใจ–แสนดี */
.kpm-main .kph-a-pair{height:74%;width:auto;max-width:94%;left:50%;bottom:4%;transform:translateX(-50%);z-index:2}
.kph-h1 span:after{bottom:6px}
.kpm-main .kph-apps-robot{max-height:300px}
.kpm-main .kph-who-c img{height:150px}
.kpm-main .kph-f5{top:auto;bottom:4%;left:auto;right:4%;width:52px;transform:rotate(-20deg)}
.kpm-main .kph-f7{top:58%;right:auto;left:0;width:46px}
