.pdti-vfeed{
  --orange:#ef6f32;
  --orange-dark:#d95720;
  --orange-soft:#fff4ed;
  --navy:#20364f;
  --text:#44596f;
  --muted:#7e8ea0;
  --line:#e5ebf0;
  --surface:#ffffff;
  --surface-soft:#f7f9fb;
  max-width:1260px;
  margin:0 auto;
  padding:28px;
  border:1px solid #e3e9ef;
  border-radius:24px;
  background:linear-gradient(180deg,#fff 0%,#fbfcfd 100%);
  box-shadow:0 14px 38px rgba(31,50,69,.075);
  font-family:Prompt,"Noto Sans Thai",Tahoma,sans-serif;
  color:var(--text);
}
.pdti-vfeed *{box-sizing:border-box}
.pdti-vfeed-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin:0 0 20px;
  padding:0 2px 18px;
  border-bottom:1px solid var(--line);
}
.pdti-vfeed-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--orange);
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  margin-bottom:7px;
}
.pdti-vfeed-kicker:before{content:"";width:20px;height:2px;border-radius:2px;background:var(--orange)}
.pdti-vfeed-head h2{margin:0;color:var(--navy);font-size:clamp(23px,2.6vw,32px);line-height:1.35;font-weight:780}
.pdti-vfeed-head p{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.7}
.pdti-vfeed-count{display:flex;align-items:baseline;gap:7px;color:#8796a7;white-space:nowrap;padding:7px 12px;border:1px solid #edf0f3;border-radius:14px;background:#fff}
.pdti-vfeed-count strong{color:var(--orange);font-size:27px;line-height:1;font-weight:850}
.pdti-vfeed-count span{font-size:12px;font-weight:650}

.pdti-vfeed-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px;padding:2px}
.pdti-vfeed-toolbar button{
  appearance:none;
  border:1px solid #dfe6ec;
  background:#fff;
  color:#5b6f84;
  border-radius:999px;
  padding:9px 15px;
  font:inherit;
  font-size:12px;
  line-height:1.25;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(31,49,67,.025);
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.pdti-vfeed-toolbar button:hover{transform:translateY(-1px);border-color:#f0b696;color:var(--orange-dark);box-shadow:0 5px 14px rgba(31,49,67,.055)}
.pdti-vfeed-toolbar button.is-active{border-color:var(--orange);background:var(--orange);color:#fff;box-shadow:0 6px 14px rgba(239,111,50,.22)}

.pdti-vfeed-grid{display:grid;grid-template-columns:repeat(var(--pdti-vfeed-cols),minmax(0,1fr));gap:18px;align-items:stretch}
.pdti-vfeed-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid #e1e8ee;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 7px 22px rgba(28,47,66,.055);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.pdti-vfeed-card:hover{transform:translateY(-4px);border-color:#efb28e;box-shadow:0 16px 34px rgba(28,47,66,.11)}
.pdti-vfeed-card[hidden]{display:none!important}
.pdti-vfeed-media{position:relative;aspect-ratio:16/9;background:linear-gradient(145deg,#f3f6f8,#eaf0f4);overflow:hidden;border-bottom:1px solid #edf1f4}
.pdti-vfeed-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .38s ease}
.pdti-vfeed-card:hover .pdti-vfeed-media img{transform:scale(1.035)}
.pdti-vfeed-placeholder{display:grid;place-items:center;width:100%;height:100%;font-size:30px;font-weight:850;letter-spacing:.08em;color:#c1cbd4}
.pdti-vfeed-badge{display:inline-flex;align-items:center;max-width:82%;border-radius:999px;padding:6px 10px;background:#eef3f6;color:#5e7082;font-size:10px;line-height:1.25;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdti-vfeed-media>.pdti-vfeed-badge{position:absolute;left:12px;top:12px;background:rgba(255,255,255,.96);box-shadow:0 5px 14px rgba(20,35,50,.12);backdrop-filter:blur(4px)}
.pdti-vfeed-badge.education{color:#2767af}.pdti-vfeed-badge.government{color:#8b5c17}.pdti-vfeed-badge.private{color:#744ca6}.pdti-vfeed-badge.other{color:#4e6277}
.pdti-vfeed-photo-count{position:absolute;right:11px;bottom:10px;background:rgba(24,38,53,.82);color:#fff;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:750;box-shadow:0 4px 10px rgba(0,0,0,.12)}
.pdti-vfeed-body{display:flex;flex:1;flex-direction:column;padding:17px 18px 18px}
.pdti-vfeed-meta{display:flex;flex-wrap:wrap;gap:7px 12px;color:#7c8da0;font-size:11px;font-weight:600;margin-bottom:9px}
.pdti-vfeed-body h3{color:var(--navy);font-size:15px;line-height:1.62;margin:0 0 8px;font-weight:760;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pdti-vfeed-body p{margin:0 0 15px;color:#718297;font-size:12px;line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pdti-vfeed-read{margin-top:auto;display:inline-flex;align-items:center;justify-content:space-between;gap:9px;width:100%;border:0;border-top:1px solid #edf1f4;background:transparent;color:var(--orange-dark);padding:13px 0 0;font:inherit;font-size:12px;font-weight:800;cursor:pointer;text-align:left}
.pdti-vfeed-read span{font-size:16px;transition:transform .18s ease}.pdti-vfeed-read:hover span{transform:translateX(3px)}

.pdti-vfeed-empty,.pdti-vfeed-error{padding:24px;border:1px dashed #d6e0e8;border-radius:16px;background:#fafcfd;text-align:center;color:#748497}
.pdti-vfeed-modal[hidden]{display:none!important}.pdti-vfeed-modal{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:24px}.pdti-vfeed-modal-backdrop{position:absolute;inset:0;background:rgba(19,31,45,.64);backdrop-filter:blur(5px)}
.pdti-vfeed-modal-panel{position:relative;z-index:1;width:min(920px,100%);max-height:min(88vh,900px);overflow:auto;background:#fff;border:1px solid rgba(255,255,255,.45);border-radius:24px;box-shadow:0 30px 80px rgba(10,25,40,.30)}
.pdti-vfeed-modal-close{position:sticky;float:right;top:12px;margin:12px 12px -54px 0;z-index:3;width:38px;height:38px;border:0;border-radius:50%;background:rgba(21,35,50,.86);color:#fff;font-size:25px;line-height:1;cursor:pointer;box-shadow:0 5px 16px rgba(0,0,0,.18)}
.pdti-vfeed-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px}.pdti-vfeed-gallery a{display:block;aspect-ratio:16/10;overflow:hidden;border-radius:14px}.pdti-vfeed-gallery img{width:100%;height:100%;object-fit:cover;display:block}
.pdti-vfeed-modal-content{padding:27px 31px 32px}.pdti-vfeed-modal-content h3{margin:12px 0 12px;color:var(--navy);font-size:clamp(23px,3vw,34px);line-height:1.4}.pdti-vfeed-modal-meta{display:flex;flex-wrap:wrap;gap:9px 18px;padding:13px 0 18px;border-bottom:1px solid var(--line);color:#718194;font-size:13px}.pdti-vfeed-detail{padding-top:21px;color:#495d72;font-size:15px;line-height:1.9}.pdti-vfeed-social{display:flex;gap:10px;margin-top:23px}.pdti-vfeed-social a{display:inline-flex;padding:9px 14px;border-radius:10px;background:#f2f5f7;color:#334960;text-decoration:none;font-size:13px;font-weight:700}.pdti-vfeed-social a:hover{background:#e9eff3}.pdti-vfeed-modal-open{overflow:hidden}

@media(max-width:1050px){.pdti-vfeed{padding:22px}.pdti-vfeed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){
  .pdti-vfeed{padding:16px 13px;border-radius:18px}
  .pdti-vfeed-head{align-items:flex-start;margin-bottom:15px;padding-bottom:14px}
  .pdti-vfeed-count{display:none}
  .pdti-vfeed-head h2{font-size:22px}
  .pdti-vfeed-grid{grid-template-columns:1fr;gap:14px}
  .pdti-vfeed-toolbar{flex-wrap:nowrap;overflow:auto;margin:0 -3px 16px;padding:3px 3px 7px;scrollbar-width:thin}
  .pdti-vfeed-toolbar button{flex:0 0 auto}
  .pdti-vfeed-modal{padding:10px}.pdti-vfeed-modal-panel{border-radius:18px;max-height:94vh}.pdti-vfeed-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.pdti-vfeed-modal-content{padding:22px 20px 26px}
}
@media(prefers-reduced-motion:reduce){.pdti-vfeed-card,.pdti-vfeed-media img,.pdti-vfeed-toolbar button,.pdti-vfeed-read span{transition:none!important}.pdti-vfeed-card:hover,.pdti-vfeed-toolbar button:hover{transform:none}}
