/* ===== หน้าประวัติติวเตอร์ ===== */
.tp-in{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:140px 24px 120px;display:grid;grid-template-columns:400px minmax(0,1fr);gap:56px;align-items:center}
.tp-pic{position:relative;height:480px;border-radius:200px 200px 36px 36px;overflow:hidden;background:#FFE3D6;box-shadow:0 28px 60px rgba(124,20,10,.3)}
.tp-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.tp-ver{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);white-space:nowrap;display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 16px;background:#FFFFFF;color:#15803C;font-size:14px;font-weight:600;box-shadow:0 10px 24px rgba(31,30,29,.18)}
.tp-h1{margin:14px 0 0;font-size:60px;line-height:1.15;font-weight:500;letter-spacing:-0.015em}
.tp-edu{margin:12px 0 0;font-size:19px;line-height:1.55;color:rgba(255,255,255,.95)}
.tp-hon{display:inline-flex;align-items:center;gap:6px;margin-top:12px;border-radius:999px;padding:5px 14px;background:#FFE055;color:#1F1E1D;font-size:14px;font-weight:600}
.tp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:26px;max-width:600px}
.tp-stats span{border-radius:22px;padding:14px 16px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.34);font-size:14px;line-height:1.35;color:rgba(255,255,255,.9)}
.tp-stats b{display:block;font-size:24px;font-weight:600;color:#FFFFFF;margin-bottom:2px}
.tp-stats b i{font-style:normal;color:#FFE055}
.tp-subs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tp-subs span{border-radius:999px;padding:6px 14px;background:#FFFFFF;color:#9C1510;font-size:14px;font-weight:500}
.tp-sheet{position:relative;z-index:3;margin-top:-44px;background:#FFFFFF;border-radius:44px 44px 0 0;padding:72px 16px 0}
.tp-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:start}
.tp-main{display:flex;flex-direction:column;gap:20px}
.tp-card{border-radius:32px;border:1px solid #EFEDEC;padding:32px}
.tp-card h2{margin:0;font-size:26px;font-weight:600;line-height:1.3}
.tp-card .sub{margin:6px 0 0;font-size:15px;color:#716C69}
.tp-style{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}
.tp-style span{display:flex;flex-direction:column;gap:10px;border-radius:22px;background:#FFF6F1;padding:18px;font-size:16px;font-weight:600;line-height:1.4}
.tp-style small{display:block;font-size:13px;font-weight:400;color:#716C69}
.tp-style svg{color:#C4180A}
.tp-scale{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.tp-scale span{min-width:56px;text-align:center;border-radius:14px;padding:10px 12px;font-size:15px;background:#F6F5F5;color:#A39C98}
.tp-scale span.on{background:#FC4013;color:#FFFFFF;font-weight:600}
.tp-xp{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.tp-xp li{display:flex;gap:12px;font-size:16px;line-height:1.6;color:#3B3836}
.tp-xp li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#FC4013;margin-top:9px}
.tp-xp li.hd{font-weight:600;color:#1F1E1D;margin-top:6px}
.tp-xp li.hd::before{display:none}
.tp-toggle{margin-top:18px;font-family:inherit;font-size:15px;font-weight:600;color:#C4180A;background:transparent;border:0;padding:8px 0;cursor:pointer;min-height:44px}
.tp-edu-i{display:flex;gap:16px;align-items:flex-start;margin-top:20px}
.tp-edu-i .ci{flex:none;width:52px;height:52px;border-radius:18px;background:#FFF3ED;color:#C4180A;display:inline-flex;align-items:center;justify-content:center}
.tp-edu-t b{display:block;font-size:18px;font-weight:600}
.tp-edu-t p{margin:2px 0 0;font-size:15px;color:#524E4C}
.tp-edu-t .tp-okb{display:inline-flex;align-items:center;gap:6px;margin-top:10px;border-radius:999px;padding:4px 12px;background:#F0FDF5;color:#15803C;font-size:13px;font-weight:600}
.tp-rv-top{display:flex;align-items:center;gap:20px;margin-top:22px;flex-wrap:wrap}
.tp-rv-big{font-size:56px;font-weight:600;line-height:1;letter-spacing:-0.02em}
.tp-rv-big small{display:block;font-size:14px;font-weight:400;color:#716C69;letter-spacing:0;margin-top:8px}
.tp-rv-stars{color:#FFB020;font-size:22px;letter-spacing:2px}
.tp-tagc{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:240px}
.tp-tagc span{border-radius:999px;padding:6px 12px;background:#FFF3ED;color:#9C1510;font-size:14px}
.tp-tagc span b{font-weight:600;margin-left:4px}
.tp-rv{margin-top:20px;border-radius:24px;background:#F9F8F8;padding:22px 24px}
.tp-rv p{margin:10px 0 0;font-size:17px;line-height:1.65;color:#1F1E1D}
.tp-rv small{display:block;margin-top:12px;font-size:14px;color:#716C69}
.tp-aside{position:sticky;top:104px;border-radius:32px;background:#1F1E1D;color:#FFFFFF;padding:30px;box-shadow:0 24px 50px rgba(31,30,29,.18)}
.tp-aside h2{margin:0;font-size:22px;font-weight:600}
.tp-price{margin-top:16px;font-size:15px;color:rgba(255,255,255,.75)}
.tp-price b{display:block;font-size:44px;font-weight:600;letter-spacing:-0.02em;color:#FFFFFF;line-height:1.1}
.tp-price b span{font-size:17px;font-weight:400;color:rgba(255,255,255,.75)}
.tp-note{margin:10px 0 0;font-size:14px;line-height:1.55;color:rgba(255,255,255,.7)}
.tp-aside .btn{width:100%;margin-top:12px}
.tp-aside .btn-o{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.35)}
.tp-aside .btn-o:hover{border-color:#FFFFFF;color:#FFFFFF}
.tp-chk{list-style:none;margin:22px 0 0;padding:20px 0 0;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column;gap:10px}
.tp-chk li{display:flex;gap:10px;font-size:15px;line-height:1.5;color:rgba(255,255,255,.9)}
.tp-chk i{font-style:normal;color:#FFE055;flex:none}
.tp-more{max-width:1180px;margin:0 auto;text-align:left}
.tp-more-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px}
.tp-mbar{display:none}
@media (max-width:1100px){.tp-grid{grid-template-columns:minmax(0,1fr) 320px}.tp-in{grid-template-columns:320px minmax(0,1fr);gap:40px}.tp-pic{height:400px}}
@media (max-width:860px){
  .tp-in{grid-template-columns:minmax(0,1fr);padding:112px 16px 88px;gap:28px;text-align:left}
  .tp-pic{height:340px;max-width:300px;width:100%;margin:0 auto;border-radius:150px 150px 28px 28px}
  .tp-h1{font-size:42px}.tp-edu{font-size:17px}
  .tp-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tp-stats span{padding:12px;font-size:13px;border-radius:18px}.tp-stats b{font-size:20px}
  .tp-sheet{padding:40px 16px 0;border-radius:32px 32px 0 0}
  .tp-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .tp-aside{position:static;padding:24px;border-radius:28px}
  .tp-card{padding:24px 20px;border-radius:28px}.tp-card h2{font-size:22px}
  .tp-style{grid-template-columns:minmax(0,1fr)}
  .tp-more-h{flex-direction:column;align-items:flex-start}
  .tp-mbar{display:flex;position:sticky;bottom:0;z-index:30;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid #E7E6E6}
  .tp-mbar small{display:block;font-size:12px;color:#716C69}
  .tp-mbar b{font-size:18px}
  .tp-mbar .btn{min-height:48px;padding:0 20px}
}

/* ติวเตอร์คนอื่น: แถวละ 5 คนเหมือนหน้ารวม · มือถือปัดดูแนวนอน */
.tp-more{max-width:1340px}
.tp-more .tgrid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.tp-more .tc-ph{height:230px}
@media (max-width:1320px){.tp-more .tgrid{grid-template-columns:repeat(4,minmax(0,1fr))}.tp-more .tgrid .tc:nth-child(5){display:none}}
@media (max-width:860px){
  .tp-more .tgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0;padding:0 0 6px;scrollbar-width:none}
  .tp-more .tgrid .tc,.tp-more .tgrid .tc:nth-child(5){display:flex;flex:none;width:72%;scroll-snap-align:start}
  .tp-more .tc-ph{height:200px}
  .tp-more .tc-f{flex-direction:row}
  .tp-more .h2{font-size:30px!important}
}
/* การ์ดในแถวปัด (มือถือ) ให้เป็นการ์ดแนวตั้ง ไม่ใช่แบบรายการของหน้ารวม */
@media (max-width:560px){
  .tp-more .tgrid{padding:0 0 6px}
  .tp-more .tc{flex-direction:column;padding:0;gap:0;align-items:stretch}
  .tp-more .tc-ph{width:auto;height:200px;border-radius:0}
  .tp-more .tc-rate{display:inline-flex}
  .tp-more .tc-b{padding:14px}
  .tp-more .tc-f{display:flex}
  .tp-more .tc-m{display:none}
  .tp-more .tc-s li:nth-child(n+3){display:inline-block}
}
/* แถบขอเรียนล่างจอ (มือถือ): ติดขอบล่างตลอดทั้งหน้า · ซ่อนตอนการ์ดราคาอยู่ในจอ (site.js) */
@media (max-width:860px){
  .tp-mbar{position:fixed;left:0;right:0;bottom:0;z-index:60;transition:transform .25s ease,opacity .25s ease}
  .tp-mbar.away{transform:translateY(100%);opacity:0;pointer-events:none}
  body:has(.tp-mbar){padding-bottom:84px}
}