/* ProfC.org — shared site chrome: slim top bar and compact footer.
   Used by the main site and every standalone page so they all close the same way. */

/* ---------- Footer ---------- */
.pf-foot{background:#EDEFE7;border-top:1px solid rgba(14,28,23,.14);font-family:"Public Sans",system-ui,sans-serif;color:rgba(14,28,23,.62);-webkit-font-smoothing:antialiased}
.pf-foot-in{position:relative;max-width:1120px;margin:0 auto;padding:26px 24px 22px}
.pf-foot-in::before{content:"";position:absolute;top:-2px;left:24px;width:56px;height:3px;background:#1B8F62}
.pf-foot-row{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
.pf-foot-mark{display:inline-flex;flex:none;background:none;border:0;padding:0;margin:0;cursor:pointer;line-height:0}
.pf-foot-mark img{display:block;height:30px;width:auto}
.pf-foot-co{flex:1 1 380px;margin:0;padding-left:28px;border-left:1px solid rgba(14,28,23,.14);font-size:13.5px;line-height:1.6;color:rgba(14,28,23,.62)}
.pf-foot-co strong{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:15px;letter-spacing:-.01em;color:#0E1C17}
.pf-foot-badges{display:flex;flex:none;gap:8px}
.pf-foot-badges img{display:block;height:34px;width:auto;background:#fff;padding:4px 6px;border:1px solid rgba(14,28,23,.14)}
.pf-foot-base{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(14,28,23,.09);font-size:12.5px;line-height:1.5;color:rgba(14,28,23,.52)}
.pf-foot-base p{margin:0}
.pf-foot-links{display:flex;flex-wrap:wrap;gap:6px 22px;margin-left:auto}
.pf-foot-link,.pf-foot-links a{font:inherit;color:rgba(14,28,23,.75);text-decoration:none;background:none;border:0;border-bottom:1px solid rgba(27,143,98,.45);padding:0 0 1px;margin:0;cursor:pointer;transition:color .15s,border-color .15s}
.pf-foot-link:hover,.pf-foot-links a:hover{color:#0F5E44;border-bottom-color:#1B8F62}
.pf-foot :focus-visible{outline:2px solid #1B8F62;outline-offset:3px}
@media(max-width:720px){
  .pf-foot-co{flex-basis:100%;order:3;padding-left:0;border-left:0}
  .pf-foot-badges{margin-left:auto}
  .pf-foot-links{margin-left:0;width:100%}
}
@media print{.pf-foot-badges,.pf-foot-links{display:none}}

/* ---------- Top bar (main site) ---------- */
.pf-nav-r{display:flex;align-items:center;gap:22px}
.pf-nav-cta{display:inline-block;flex:none;background:#1B8F62;color:#fff;text-decoration:none;padding:9px 18px;font-family:"Public Sans",system-ui,sans-serif;font-size:13.5px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;transition:background .15s}
.pf-nav-cta:hover{background:#0F5E44}
.pf-nav-toggle{font-family:"Public Sans",system-ui,sans-serif;font-size:13.5px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:#4EDD9B;background:none;border:0;padding:8px 0;cursor:pointer}
@media(max-width:420px){.pf-nav-r{gap:16px}.pf-nav-cta{padding:8px 14px;font-size:12.5px}}

/* ---------- Contents menu (logo-dot navigator) ----------
   A compact popover anchored under the "Contents" button. Sections are grouped
   and colour-coded with the dots from the ProfC.org logo. Shared by the main
   site and the standalone pages. */
.pf-menu{position:relative;font-family:"Public Sans",system-ui,sans-serif}
.pf-menu-btn{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px 0 10px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;font:inherit;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;cursor:pointer;transition:background .2s,border-color .2s}
.pf-menu-btn:hover,.pf-menu-btn[aria-expanded="true"]{background:rgba(255,255,255,.09);border-color:rgba(78,221,155,.55)}
.pf-menu-btn:focus-visible{outline:2px solid #4EDD9B;outline-offset:3px}
.pf-menu-ico{width:22px;height:22px;flex:none;overflow:visible}
.pf-menu-ico circle{transition:transform .35s cubic-bezier(.3,1.4,.5,1);transform-box:fill-box;transform-origin:center}
.pf-menu-btn:hover .pf-menu-ico .s1,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s1{transform:translate(-1.5px,-1.5px)}
.pf-menu-btn:hover .pf-menu-ico .s2,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s2{transform:translate(0,-2px)}
.pf-menu-btn:hover .pf-menu-ico .s3,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s3{transform:translate(1.5px,-1.5px)}
.pf-menu-btn:hover .pf-menu-ico .s4,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s4{transform:translate(-2px,0)}
.pf-menu-btn:hover .pf-menu-ico .s5,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s5{transform:translate(2px,0)}
.pf-menu-btn:hover .pf-menu-ico .s6,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s6{transform:translate(-1px,2px)}
.pf-menu-btn:hover .pf-menu-ico .s7,.pf-menu-btn[aria-expanded="true"] .pf-menu-ico .s7{transform:translate(1px,2px)}
.pf-menu-chev{width:10px;height:10px;flex:none;opacity:.7;transition:transform .25s}
.pf-menu-btn[aria-expanded="true"] .pf-menu-chev{transform:rotate(180deg)}

.pf-menu-scrim{position:fixed;inset:0;z-index:-1;background:rgba(6,14,11,.28);animation:pfFade .2s ease-out}
.pf-menu-panel{position:absolute;z-index:60;top:calc(100% + 12px);right:0;width:560px;max-width:calc(100vw - 32px);max-height:calc(100vh - 96px);overflow:auto;background:#13241E;border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.25);padding:18px 18px 12px;color:#fff;transform-origin:top right;animation:pfPop .22s cubic-bezier(.2,.9,.3,1.15)}
.pf-menu-panel[hidden]{display:none}
.pf-menu-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 6px 12px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.08);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:rgba(255,255,255,.5)}
.pf-menu-head span:last-child{text-transform:none;letter-spacing:0;font-weight:400;font-size:12.5px}
.pf-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px}
.pf-menu-group{padding:8px 0 4px}
.pf-menu-gl{display:flex;align-items:center;gap:8px;padding:0 6px 6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:rgba(255,255,255,.48)}
.pf-menu-gl::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c)}
.pf-menu-list{list-style:none;margin:0;padding:0}
.pf-menu-item{display:flex;width:100%;align-items:center;gap:10px;padding:8px 6px;border:0;border-radius:9px;background:none;color:rgba(255,255,255,.82);text-align:left;text-decoration:none;font:inherit;font-size:15px;font-weight:600;line-height:1.25;cursor:pointer;transition:background .15s,color .15s}
.pf-menu-item:hover,.pf-menu-item:focus-visible{background:rgba(255,255,255,.06);color:#fff;outline:none}
.pf-menu-item:focus-visible{box-shadow:inset 0 0 0 2px rgba(78,221,155,.7)}
.pf-menu-dot{width:10px;height:10px;flex:none;border-radius:50%;border:2px solid var(--c);transition:background .15s,transform .2s}
.pf-menu-item:hover .pf-menu-dot{background:var(--c);transform:scale(1.15)}
.pf-menu-num{margin-left:auto;font-size:11.5px;font-weight:700;letter-spacing:.06em;color:rgba(255,255,255,.35);font-variant-numeric:tabular-nums}
.pf-menu-item[aria-current="page"]{color:#fff;background:rgba(255,255,255,.07)}
.pf-menu-item[aria-current="page"] .pf-menu-dot{background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 28%,transparent)}
.pf-menu-item[aria-current="page"] .pf-menu-num::before{content:"You are here \00B7  ";color:#4EDD9B;letter-spacing:.04em;font-weight:600;text-transform:none}
.pf-menu-foot{grid-column:1/-1;margin-top:6px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
.pf-menu-foot .pf-menu-list{display:flex;gap:6px}
.pf-menu-foot .pf-menu-item{width:auto;flex:1}
@keyframes pfPop{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
@keyframes pfFade{from{opacity:0}to{opacity:1}}
@media(max-width:620px){
  .pf-menu{position:static}
  .pf-menu-btn{height:36px;padding:0 12px 0 8px;gap:8px;font-size:12px}
  .pf-menu-btn .pf-menu-lbl{letter-spacing:.1em}
  .pf-menu-panel{left:12px;right:12px;width:auto;max-width:none;top:calc(100% + 8px);max-height:calc(100vh - 88px);padding:14px 12px 10px}
  .pf-menu-grid{grid-template-columns:1fr;gap:0}
  .pf-menu-item{padding:9px 6px}
}
@media(max-width:380px){.pf-menu-btn .pf-menu-lbl{display:none}.pf-menu-btn{padding:0 10px}}
@media(prefers-reduced-motion:reduce){.pf-menu-panel,.pf-menu-scrim{animation:none}.pf-menu-ico circle,.pf-menu-chev{transition:none}}
@media print{.pf-menu{display:none}}
