/**
 * Afrovarsity: Shared public-pages stylesheet
 * Common tokens, layout, buttons, header + footer chrome for the public
 * secondary pages (about/, contact/, help/, legal/). Loaded by
 * data/public_chrome.inc.php → public_head_tags(). Page-specific CSS stays
 * inline in each page.
 */
:root{
  --navy:#191970; --navy-d:#111143; --navy-l:#3a3a8c; --amber:#FFAB00;
  --ink:#16162e; --muted:#6b6b80; --line:#e9e9f0; --paper:#fafafc; --white:#fff;
  --font:'DM Sans',system-ui,sans-serif; --wrap:1160px; --ease:.28s cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;line-height:1.65}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}

/* Reveal-on-scroll (subtle) */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* Buttons */
.pbtn{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;border-radius:10px;padding:11px 20px;transition:all var(--ease);cursor:pointer;border:1px solid transparent;white-space:nowrap;font-family:var(--font)}
.pbtn-navy{background:var(--navy);color:#fff}
.pbtn-navy:hover{background:var(--navy-l)}
.pbtn-amber{background:var(--amber);color:var(--navy-d)}
.pbtn-amber:hover{filter:brightness(1.06)}
.pbtn-ghost{background:transparent;color:var(--navy);border-color:var(--line)}
.pbtn-ghost:hover{border-color:var(--navy)}
.pbtn-lg{padding:14px 26px;font-size:.95rem}

/* Section heading helpers (shared so pages stay consistent) */
.p-eyebrow{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);font-weight:600;margin-bottom:16px}
.p-title{font-size:2.6rem;font-weight:700;color:var(--navy);line-height:1.08;letter-spacing:-.015em}
.p-lead{font-size:1.05rem;color:var(--muted);line-height:1.7;max-width:60ch}

/* ── Header ─────────────────────────────────────────────────────── */
.phead{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.9);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.phead-in{max-width:var(--wrap);margin:0 auto;padding:13px 28px;display:flex;align-items:center;gap:26px}
.pbrand{display:inline-flex;align-items:center;gap:10px;font-size:1.4rem;font-weight:700;color:var(--navy);letter-spacing:.01em}
.pbrand img{height:28px;width:auto;border-radius:5px}
.pnav{display:flex;align-items:center;gap:6px;margin-left:14px}
.pnav a{font-size:.88rem;font-weight:500;color:var(--muted);padding:7px 12px;border-radius:8px;transition:all var(--ease)}
.pnav a:hover{color:var(--navy);background:var(--paper)}
.pnav a.on{color:var(--navy);font-weight:600}
.phead-cta{margin-left:auto;display:flex;align-items:center;gap:16px}
.phead-cta .signin{font-size:.88rem;font-weight:600;color:var(--navy)}
.phead-cta .signin:hover{color:var(--amber)}
.pburger{display:none;margin-left:auto;background:none;border:0;color:var(--navy);font-size:24px;cursor:pointer}
.pnav-mobile{display:none;flex-direction:column;padding:8px 20px 18px;border-top:1px solid var(--line);background:#fff}
.pnav-mobile a{padding:11px 4px;font-size:.95rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--line)}
.pnav-mobile .pbtn{margin-top:14px;justify-content:center}

/* ── Footer ─────────────────────────────────────────────────────── */
.pfoot{background:var(--paper);border-top:1px solid var(--line);margin-top:0;padding:56px 0 34px}
.pfoot-in{max-width:var(--wrap);margin:0 auto;padding:0 28px;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.pfoot-brand .pbrand{font-size:1.35rem}
.pfoot-brand p{color:var(--muted);font-size:.86rem;margin:10px 0 16px;max-width:32ch}
.psocial{display:flex;gap:10px}
.psocial a{width:34px;height:34px;border-radius:9px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);font-size:17px;transition:all var(--ease)}
.psocial a:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.pfoot-links{display:flex;gap:28px;flex-wrap:wrap}
.pfoot-links a{color:var(--muted);font-size:.88rem;transition:color var(--ease)}
.pfoot-links a:hover{color:var(--navy)}
.pfoot-copy{max-width:var(--wrap);margin:34px auto 0;padding:22px 28px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}

@media (max-width:820px){
  .pnav,.phead-cta{display:none}
  .pburger{display:block}
  .p-title{font-size:2.1rem}
}
@media (max-width:560px){
  .wrap,.phead-in,.pfoot-in,.pfoot-copy{padding-left:20px;padding-right:20px}
  .pfoot-in{flex-direction:column;gap:26px}
  .p-title{font-size:1.85rem}
}