/* Saung Hosting — Help article styles */
.pp-help-bc{font-size:13px;color:#64748b;margin-bottom:18px}
.pp-help-bc a{color:#0f766e;text-decoration:none}
.pp-help-bc a:hover{text-decoration:underline}
.pp-help-bc .cur{color:#0f172a;font-weight:600}

.pp-help-layout{display:grid;grid-template-columns:260px 1fr;gap:36px;align-items:start;margin:8px 0 36px}
@media (max-width:900px){ .pp-help-layout{grid-template-columns:1fr;gap:20px} }

.pp-help-toc{position:sticky;top:90px;background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:18px;box-shadow:0 4px 18px rgba(15,23,42,.05)}
.pp-help-toc .t{font-size:12px;font-weight:800;color:#64748b;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.pp-help-toc ol{list-style:none;padding:0;margin:0 0 16px;counter-reset:toc}
.pp-help-toc ol li{counter-increment:toc;margin:0 0 4px}
.pp-help-toc ol li a{display:block;padding:8px 12px 8px 36px;color:#334155;text-decoration:none;font-size:13.5px;border-radius:8px;line-height:1.4;position:relative;transition:.15s;border-left:3px solid transparent}
.pp-help-toc ol li a::before{content:counter(toc);position:absolute;left:10px;top:8px;width:20px;height:20px;border-radius:50%;background:#f1f5f9;color:#64748b;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.pp-help-toc ol li a:hover{background:#f0fdf4;color:#0f766e}
.pp-help-toc ol li a:hover::before{background:#10b981;color:#fff}

.pp-help-aside-card{margin-top:14px;padding:16px;background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-radius:12px;border:1px solid #a7f3d0}
.pp-help-aside-card h5{margin:0 0 6px;font-size:14px;font-weight:800;color:#064e3b}
.pp-help-aside-card p{margin:0 0 10px;font-size:13px;color:#065f46;line-height:1.45}
.pp-help-aside-card .btn-wa{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#25d366,#128c7e);color:#fff;padding:8px 14px;border-radius:20px;font-size:13px;font-weight:700;text-decoration:none}

.pp-help-prose{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:32px 36px;box-shadow:0 6px 22px rgba(15,23,42,.05)}
@media (max-width:600px){ .pp-help-prose{padding:22px 18px} }
.pp-art-sec{padding:0 !important;margin-top:22px;border-top:0;position:static}
.pp-art-sec:first-child{padding:0 !important;margin-top:0;border-top:0}
.pp-art-sec h2{font-size:22px;font-weight:800;color:#0f172a;margin:0 0 12px;line-height:1.3;scroll-margin-top:80px}
.pp-art-sec h4{font-size:16px;font-weight:700;color:#0f172a;margin:14px 0 6px}
.pp-art-sec p{font-size:15px;color:#334155;line-height:1.75;margin:0 0 10px}
.pp-art-sec ul,.pp-art-sec ol{margin:0 0 12px;padding-left:24px}
.pp-art-sec li{font-size:15px;color:#334155;line-height:1.7;margin-bottom:4px}
.pp-art-sec li>p{margin:0}
.pp-art-sec b{color:#0f172a;font-weight:700}
.pp-art-sec a{color:#0f766e;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.pp-art-sec a:hover{color:#10b981}
.pp-art-sec code{background:#f1f5f9;color:#0f766e;padding:2px 7px;border-radius:5px;font-size:13.5px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace}
.pp-art-sec pre{background:#0f172a;color:#e2e8f0;padding:16px 18px;border-radius:10px;overflow-x:auto;font-size:13.5px;line-height:1.55;margin:10px 0 14px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace}
.pp-art-sec pre code{background:transparent;color:inherit;padding:0;font-size:inherit}
.pp-art-sec hr{display:none}

.pp-help-cta-banner{margin-top:30px;background:linear-gradient(135deg,#064e3b,#0f766e);color:#fff !important;border-radius:14px;padding:24px 26px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.pp-help-cta-banner *{color:#fff !important}
.pp-help-cta-banner h3{margin:0 0 6px !important;font-size:18px !important;font-weight:800 !important;color:#fff !important}
.pp-help-cta-banner p{margin:0 !important;font-size:14px !important;opacity:.95;color:#ecfdf5 !important}
.pp-help-cta-banner .acts{display:flex;gap:10px;flex-wrap:wrap}
.pp-help-cta-banner .b1,.pp-help-cta-banner .b2{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:24px;font-weight:700;font-size:14px;text-decoration:none !important;transition:transform .15s;color:#fff !important}
.pp-help-cta-banner .b1{background:#25d366 !important;color:#fff !important}
.pp-help-cta-banner .b2{background:rgba(255,255,255,.15) !important;color:#fff !important;border:1px solid rgba(255,255,255,.3)}
.pp-help-cta-banner .b1:hover,.pp-help-cta-banner .b2:hover{transform:translateY(-2px)}

.pp-help-related{margin-top:36px}
.pp-help-related h3{font-size:20px;font-weight:800;color:#0f172a;margin:0 0 16px}
.pp-help-related .g{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.pp-help-related .rc{display:flex;gap:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px;text-decoration:none;color:inherit;transition:.18s}
.pp-help-related .rc:hover{border-color:#10b981;transform:translateY(-3px);box-shadow:0 12px 28px rgba(15,23,42,.08)}
.pp-help-related .rc .ic{flex:none;width:42px;height:42px;border-radius:10px;background:#ecfdf5;color:#10b981;display:flex;align-items:center;justify-content:center;font-size:18px}
.pp-help-related .rc h4{margin:0 0 4px;font-size:15px;font-weight:700;color:#0f172a;line-height:1.3}
.pp-help-related .rc p{margin:0;font-size:13px;color:#64748b;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Blog landing extras */
.pp-blog-feat{display:block;border-radius:18px;padding:36px 38px;color:#fff !important;text-decoration:none;margin-bottom:28px;box-shadow:0 14px 38px rgba(15,23,42,.18);position:relative;overflow:hidden;transition:transform .2s}
.pp-blog-feat,.pp-blog-feat *{color:#fff !important}
.pp-blog-feat:hover{transform:translateY(-3px)}
.pp-blog-feat::after{content:"";position:absolute;inset:0;background:radial-gradient(800px 200px at 100% 0%, rgba(255,255,255,.18), transparent);pointer-events:none}
.pp-blog-feat .meta{display:flex;align-items:center;gap:14px;margin-bottom:10px;font-size:13px}
.pp-blog-feat .cat{background:rgba(255,255,255,.22);padding:5px 12px;border-radius:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:11px}
.pp-blog-feat .time{opacity:.9}
.pp-blog-feat h2{font-size:30px !important;font-weight:800 !important;margin:0 0 10px !important;line-height:1.25 !important;color:#fff !important;max-width:780px}
@media (max-width:600px){ .pp-blog-feat h2{font-size:22px !important} .pp-blog-feat{padding:24px 20px} }
.pp-blog-feat p{margin:0 0 16px !important;font-size:15px !important;opacity:.95;max-width:720px;line-height:1.6;color:#fff !important}
.pp-blog-feat .rd{display:inline-flex;align-items:center;gap:8px;background:#fff !important;color:#0f172a !important;padding:9px 18px;border-radius:20px;font-weight:700;font-size:13.5px}

.pp-blog-filter{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 20px}
.pp-blog-filter .pf{background:#fff;border:1px solid #e2e8f0;color:#475569;padding:8px 16px;border-radius:20px;font-weight:600;font-size:13px;cursor:pointer;transition:.15s;font-family:inherit}
.pp-blog-filter .pf:hover{border-color:#10b981;color:#0f766e}
.pp-blog-filter .pf.is-active{background:linear-gradient(135deg,#10b981,#0d9488);color:#fff;border-color:transparent;box-shadow:0 4px 14px rgba(16,185,129,.32)}

.pp-blog-grid .p .img{display:flex;align-items:center;justify-content:center;min-height:170px}
.pp-blog-grid .p .body .bcat{display:inline-block;background:#ecfdf5;color:#0f766e;font-size:11px;font-weight:800;padding:3px 10px;border-radius:10px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px}