.pp-page{padding:0 0 80px;background:#f7f9fa}
.pp-hero{background:
  radial-gradient(circle at 85% 10%,rgba(191,148,69,.16),transparent 45%),
  linear-gradient(135deg,#072C43 0%,#0a3d5c 100%);
  padding:64px 24px 56px;text-align:center;margin-bottom:44px;position:relative;overflow:hidden}
.pp-hero::before{content:'';position:absolute;top:-70px;right:-70px;width:260px;height:260px;
  border-radius:50%;background:rgba(191,148,69,.08)}
.pp-hero::after{content:'';position:absolute;bottom:-50px;left:-50px;width:190px;height:190px;
  border-radius:50%;background:rgba(255,255,255,.04)}
.pp-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:4px;color:#BF9445;
  text-transform:uppercase;margin-bottom:10px}
.pp-title{font-size:40px;font-weight:800;color:#fff;margin:0 0 10px}
.pp-sub{color:rgba(255,255,255,.72);font-size:16px;max-width:520px;margin:0 auto 18px}
.pp-updated{display:inline-flex;align-items:center;font-size:12px;font-weight:700;color:#BF9445;
  background:rgba(191,148,69,.15);border:1px solid rgba(191,148,69,.3);border-radius:20px;padding:6px 16px}

.pp-layout{max-width:1080px;margin:0 auto;padding:0 24px;display:flex;gap:34px;align-items:flex-start}
.pp-toc{flex:0 0 230px;position:sticky;top:100px}
.pp-toc-card{background:#fff;border:1px solid #e8ecee;border-radius:14px;padding:20px;
  box-shadow:0 4px 16px rgba(7,44,67,.06)}
.pp-toc-card h6{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:#072C43;margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid #BF9445;display:inline-block}
.pp-toc-link{display:block;font-size:13px;color:#667;text-decoration:none;padding:8px 10px;
  border-radius:8px;border-left:3px solid transparent;transition:all .25s ease;margin-bottom:2px}
.pp-toc-link:hover{color:#BF9445;background:#faf6ee}
.pp-toc-link.pp-on{color:#072C43;font-weight:700;background:#f4f7f9;border-left-color:#BF9445}

.pp-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:22px}
.pp-card{background:#fff;border:1px solid #e8ecee;border-radius:16px;padding:30px 34px;
  box-shadow:0 4px 16px rgba(7,44,67,.05);scroll-margin-top:110px;
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease}
.pp-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(7,44,67,.1)}
.pp-card-head{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.pp-ico{flex:0 0 auto;width:50px;height:50px;border-radius:13px;display:flex;align-items:center;
  justify-content:center;background:linear-gradient(135deg,#072C43,#0a3d5c);color:#ffb606;font-size:1.15rem;
  box-shadow:0 8px 20px rgba(7,44,67,.25)}
.pp-num{display:block;font-size:10px;font-weight:700;letter-spacing:2.5px;color:#BF9445;text-transform:uppercase}
.pp-card h3{font-size:21px;font-weight:800;color:#072C43;margin:2px 0 0}
.pp-card p{font-size:15px;line-height:1.85;color:#556;margin:0 0 12px}
.pp-card p:last-child{margin-bottom:0}
.pp-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.pp-list li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.7;color:#556;
  background:#f8fafb;border:1px solid #eef2f4;border-radius:10px;padding:12px 16px}
.pp-list li i{color:#BF9445;margin-top:4px;flex-shrink:0}
.pp-contact-note{display:flex;align-items:center;gap:12px;justify-content:center;
  background:linear-gradient(120deg,rgba(191,148,69,.12),rgba(255,182,6,.1));
  border:1px solid rgba(191,148,69,.3);border-radius:14px;padding:18px 24px;
  font-size:14px;font-weight:600;color:#072C43}
.pp-contact-note i{color:#BF9445}
.pp-contact-note a{color:#BF9445;font-weight:700;text-decoration:none}
/* entrance */
.pp-card,.pp-toc-card{opacity:0;transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.pp-card.pp-in,.pp-toc-card.pp-in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.pp-card,.pp-toc-card{opacity:1 !important;transform:none !important}}
@media (max-width:860px){
  .pp-layout{flex-direction:column}
  .pp-toc{position:static;flex:none;width:100%}
  .pp-toc-card{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
  .pp-toc-card h6{width:100%}
  .pp-toc-link{border-left:0;border:1px solid #e8ecee;border-radius:20px;padding:6px 14px;font-size:12px}
  .pp-title{font-size:30px}
  .pp-card{padding:22px 20px}
}

/* ==== centering guard ==== */
html body .pp-hero,
html body .pp-hero .pp-eyebrow,
html body .pp-hero h1,
html body .pp-hero .pp-sub{text-align:center !important}
html body .pp-hero .pp-sub{margin-left:auto !important;margin-right:auto !important;max-width:520px !important}