/* ===== 2Provi · /aboutme/ — หน้ารวมทีมที่ปรึกษา =====
   ใช้ token และคลาสร่วมจาก core.css ไฟล์นี้เก็บเฉพาะส่วนที่มีแต่หน้านี้ */

/* ---- ส่วนหัวของหน้า ---- */
.abhero{position:relative;padding:4rem 0 3.4rem;overflow:hidden;isolation:isolate;text-align:center}
.abhero .wrap>.rv{max-width:760px;margin:0 auto}
.abhero h1{font-size:clamp(2rem,5vw,3.25rem);margin:1.1rem 0 .9rem}
.abhero .lead{color:var(--text2);font-size:1.03rem;line-height:1.95;max-width:640px;margin:0 auto}

/* ---- การ์ดทีมงาน ---- */
.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.4rem}

.pcard{position:relative;display:flex;flex-direction:column;overflow:hidden;
  border-radius:var(--r2);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh1);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.pcard::after{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:var(--grad);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.pcard:hover{transform:translateY(-10px);box-shadow:var(--sh3);border-color:transparent}
.pcard:hover::after{transform:scaleX(1)}

.pimg{aspect-ratio:1/1;background:linear-gradient(135deg,rgba(var(--a5),.14),rgba(var(--aSky),.14));
  display:grid;place-items:center;overflow:hidden}
.pimg img{width:100%;height:100%;object-fit:cover;object-position:center top;
  transition:transform .5s var(--ease)}
.pcard:hover .pimg img{transform:scale(1.05)}
.pimg.ph span{font-family:var(--fd,inherit);font-size:3.1rem;font-weight:800;letter-spacing:.06em;
  color:rgba(var(--a7),.42)}
[data-theme="dark"] .pimg.ph span{color:rgba(var(--aSky),.5)}

.pbody{display:flex;flex-direction:column;gap:.5rem;padding:1.35rem 1.5rem 1.5rem;flex:1}
.pbody h3{font-size:1.16rem;margin:0}

.ptag{align-self:flex-start;display:inline-flex;align-items:center;gap:.35rem;
  padding:.28rem .7rem;border-radius:99px;font-size:.74rem;font-weight:800;letter-spacing:.02em}
.ptag.ready{color:#0f766e;background:rgba(45,212,160,.16)}
.ptag.wait{color:#9a3412;background:rgba(251,146,60,.18)}
[data-theme="dark"] .ptag.ready{color:#5eead4;background:rgba(45,212,160,.16)}
[data-theme="dark"] .ptag.wait{color:#fdba74;background:rgba(251,146,60,.16)}

.prole{color:var(--b700);font-size:.86rem;font-weight:700;line-height:1.6;margin:0}
[data-theme="dark"] .prole{color:var(--sky)}
.pdesc{color:var(--muted);font-size:.92rem;flex:1;margin:0}

.pcard .go{display:inline-flex;align-items:center;gap:.4rem;margin-top:.5rem;padding-top:.8rem;
  border-top:1px dashed var(--line);font-size:.88rem;font-weight:800;color:var(--b600)}
[data-theme="dark"] .pcard .go{color:var(--sky)}
.pcard .go span{transition:transform .3s var(--ease)}
.pcard:hover .go span{transform:translateX(5px)}

/* การ์ดที่ยังไม่มีหน้าจริง ให้ดูจางลงเล็กน้อยแต่ยังอ่านออกตามเกณฑ์ contrast */
.pcard.soon{background:var(--surface2)}
.pcard.soon .go{color:var(--muted)}

.pnote{margin-top:1.6rem;text-align:center;color:var(--muted);font-size:.93rem}
.pnote a{font-weight:800;color:var(--b600)}
[data-theme="dark"] .pnote a{color:var(--sky)}

/* ---- แนวทางของเรา ---- */
.vgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1.3rem}
.vcard{display:flex;flex-direction:column;gap:.55rem;padding:1.8rem 1.6rem;
  border-radius:var(--r2);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh1)}
.vcard .ico{width:54px;height:54px;display:grid;place-items:center;font-size:1.55rem;border-radius:17px;
  background:linear-gradient(135deg,rgba(var(--a5),.16),rgba(var(--aSky),.16))}
.vcard h3{font-size:1.08rem;margin:0}
.vcard p{color:var(--muted);font-size:.92rem;margin:0}

@media (max-width:640px){
  .abhero{padding:3rem 0 2.4rem}
  .pbody{padding:1.2rem 1.25rem 1.35rem}
}