/* Knowledge Hub & Practice Network — homepage section.
 * Theme-matched: teal primary #1a6b6b, ember accent #e8652a, Plus Jakarta/Inter type.
 * Layout mirrors the approved reference: tabbed doc panel (featured + 3 rows) + CoP rail. */
.ph-khsec{background:#f9fafb;padding:90px 0}
.ph-kh-grid{display:grid;grid-template-columns:1.9fr 1fr;gap:24px;align-items:start}
.ph-kh-card{background:#fff;border:1px solid #e5e7eb;border-radius:20px;overflow:hidden;box-shadow:0 1px 2px rgba(28,35,33,.05)}
/* Tabs */
.ph-kh-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:20px 24px 0}
.ph-kh-tab{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:0;border-radius:9999px;background:#eef2f7;color:#4b5563;font-size:.82rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all .25s ease;text-decoration:none}
.ph-kh-tab svg{width:.9rem;height:.9rem;color:#9ca3af}
.ph-kh-tab:hover{background:#e2e8f0;color:#111827}
.ph-kh-tab.is-active{background:#fff;color:#111827;box-shadow:0 2px 8px rgba(28,35,33,.1);border:1px solid #e5e7eb}
.ph-kh-tab.is-active svg{color:#e8652a}
.ph-kh-tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(26,107,107,.3)}
.ph-kh-body{padding:24px}
.ph-kh-panels-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:20px;align-items:stretch}
.ph-kh-panels-grid>*{min-width:0;min-height:0}
/* Featured */
.ph-kh-featured{border-radius:14px;overflow:hidden;background:#eef8f8;border:1px solid #e5e7eb;display:flex;flex-direction:column;height:100%}
.ph-kh-feat-img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#d4f0f0}
.ph-kh-feat-img img{width:100%;height:100%;object-fit:cover;display:block}
.ph-kh-feat-body{padding:22px;flex:1 1 auto;display:flex;flex-direction:column}
/* Shared date + category in one row, small icons before each */
.ph-kh-meta-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin:0 0 10px;font-size:.78rem;color:#6b7280}
.ph-kh-meta-cat,.ph-kh-meta-date{display:inline-flex;align-items:center;gap:5px;min-width:0;line-height:1.4}
.ph-kh-meta-cat{color:#6b7280}
.ph-kh-meta-cat svg,.ph-kh-meta-date svg{width:.75rem;height:.75rem;flex-shrink:0}
.ph-kh-meta-cat svg{color:#e8652a}
.ph-kh-meta-date svg{color:#6b7280}
.ph-kh-feat-body h3{font-size:1.32rem;font-weight:800;color:#111827;line-height:1.3;margin:0 0 10px;letter-spacing:-.02em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ph-kh-feat-body h3 a{color:inherit;text-decoration:none}
.ph-kh-feat-body h3 a:hover{color:#1a6b6b}
.ph-kh-feat-ex{font-size:.9rem;color:#4b5563;line-height:1.7;margin:0 0 18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ph-kh-feat-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}
.ph-kh-read{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:700;color:#b3261e;text-decoration:none}
.ph-kh-read svg{width:.85rem;height:.85rem}
.ph-kh-read:hover{color:#7f1d1d}
.ph-kh-feat-actions{display:flex;gap:8px}
.ph-kh-icon-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e5e7eb;border-radius:10px;color:#4b5563;cursor:pointer;text-decoration:none}
.ph-kh-icon-btn svg{width:1rem;height:1rem}
.ph-kh-icon-btn:hover{border-color:#5ec4c4;color:#1a6b6b}
/* Rows — same card style for all 3 tabs */
.ph-kh-rows{display:flex;flex-direction:column;gap:16px;height:100%}
.ph-kh-row{display:flex;background:#eef2f7;border:1px solid transparent;border-radius:14px;padding:18px;text-decoration:none;transition:all .25s ease;flex:1 1 0;min-height:0}
.ph-kh-row:hover{background:#fff;border-color:#a0dede;box-shadow:0 4px 6px -1px rgba(0,0,0,.07);transform:translateX(3px)}
.ph-kh-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.ph-kh-row .ph-kh-meta-row{margin:0}
.ph-kh-row-title{font-size:.92rem;font-weight:700;color:#1f2937;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ph-kh-row:hover .ph-kh-row-title{color:#1a6b6b}
.ph-kh-row-foot{display:flex;align-items:center;justify-content:flex-end;margin-top:auto;padding-top:8px}
.ph-kh-row-foot svg{width:.9rem;height:.9rem;color:#1f2937}
/* CoP rail */
.ph-kh-cop-head{padding:24px 24px 4px}
.ph-kh-cop-head h3{font-size:1.35rem;font-weight:800;color:#111827;margin:0;letter-spacing:-.02em}
.ph-kh-cop-head-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.ph-kh-cop-sub{font-size:.86rem;color:#4b5563;margin:6px 0 0}
.ph-kh-cop-link{font-size:.82rem;font-weight:600;color:#b3261e;display:inline-flex;align-items:center;gap:4px;text-decoration:none;white-space:nowrap;margin-top:4px}
.ph-kh-cop-link svg{width:.75rem;height:.75rem}
.ph-kh-cop-list{display:flex;flex-direction:column;gap:14px;padding:18px 24px 24px}
.ph-kh-cop{display:flex;gap:14px;align-items:flex-start;background:#eef2f7;border-radius:14px;padding:16px;text-decoration:none;transition:all .25s ease}
.ph-kh-cop:hover{background:#fff;border:1px solid #a0dede;box-shadow:0 4px 6px -1px rgba(0,0,0,.07);margin:-1px}
.ph-kh-ava{width:48px;height:48px;border-radius:50%;background:#d4f0f0;color:#1a6b6b;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.ph-kh-ava svg{width:1.2rem;height:1.2rem}
.ph-kh-ava img{width:100%;height:100%;object-fit:cover}
.ph-kh-cop-main{flex:1;min-width:0}
.ph-kh-cop-name{font-size:.95rem;font-weight:700;color:#1f2937;line-height:1.3}
.ph-kh-cop-role{font-size:.78rem;font-weight:700;color:#b3261e;margin-top:2px;line-height:1.4}
.ph-kh-cop-loc{font-size:.76rem;color:#6b7280;display:flex;align-items:center;gap:4px;margin-top:3px}
.ph-kh-cop-loc svg{width:.7rem;height:.7rem}
.ph-kh-verified{color:#b3261e;flex-shrink:0}
.ph-kh-verified svg{width:1rem;height:1rem}
.ph-kh-cta{margin:0 24px 24px;background:linear-gradient(160deg,#0c2340 0%,#0f3d4a 60%,#155e5e 100%);border-radius:14px;padding:26px 24px;color:#fff}
.ph-kh-cta-label{display:flex;align-items:center;gap:8px;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#f59b6f}
.ph-kh-cta-label svg{width:.9rem;height:.9rem}
.ph-kh-cta h4{font-size:1.12rem;font-weight:800;color:#fff;margin:10px 0 8px;line-height:1.35}
.ph-kh-cta p{font-size:.84rem;color:rgba(255,255,255,.78);line-height:1.65;margin:0 0 18px}
.ph-kh-cta-row{display:flex;align-items:center;gap:12px}
.ph-kh-cta-btn{display:inline-flex;align-items:center;background:#fff;color:#111827;font-size:.84rem;font-weight:700;padding:10px 22px;border-radius:9999px;text-decoration:none}
.ph-kh-cta-btn:hover{background:#eef8f8}
.ph-kh-cta-help{color:rgba(255,255,255,.8)}
.ph-kh-cta-help svg{width:1.2rem;height:1.2rem}
/* Empty + loading */
.ph-kh-empty{text-align:center;padding:48px 24px;color:#4b5563}
.ph-kh-empty svg{width:2rem;height:2rem;color:#9ca3af;margin-bottom:12px}
.ph-kh-empty p{margin:0 0 8px}
.ph-kh-loading{display:grid;grid-template-columns:1.15fr 1fr;gap:20px}
.ph-kh-sk{background:linear-gradient(90deg,#eef2f7 25%,#e2e8f0 50%,#eef2f7 75%);background-size:200% 100%;animation:phKhShimmer 1.2s infinite;border-radius:14px;min-height:120px}
@keyframes phKhShimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.ph-kh-sk{animation:none}.ph-kh-tab,.ph-kh-row{transition:none}}
@media (max-width:1023.98px){.ph-kh-grid{grid-template-columns:1fr}.ph-kh-panels-grid{grid-template-columns:1fr}}
@media (max-width:639.98px){.ph-khsec{padding:60px 0}.ph-kh-body{padding:16px}.ph-kh-tabs{padding:16px 16px 0;gap:6px}.ph-kh-tab{padding:8px 14px;font-size:.76rem}.ph-kh-feat-body{padding:18px 16px}.ph-kh-feat-body h3{font-size:1.1rem}.ph-kh-loading{grid-template-columns:1fr}}