/* ==========================================================
   Privacy Policy page (page-privacy-policy.php)
   Builds on site.css tokens: --ink, --mute, --line, --gold, --gold-h, --serif, --sec, --gut, --ease
   ========================================================== */

/* ---------- layout: small side column, one readable text column ---------- */
.pp-body{padding-block:var(--sec)}
.pp-grid{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);gap:28px clamp(32px,6vw,96px);align-items:start}
.pp-aside{position:sticky;top:110px}

/* last updated + questions */
.pp-meta{margin:0;border-top:1px solid var(--line)}
.pp-meta>div{padding:18px 0;border-bottom:1px solid var(--line)}
.pp-meta dt{color:var(--mute)}
.pp-meta dd{margin:8px 0 0;font-size:14px;line-height:1.8}
.pp-meta dd.serif{font-size:clamp(20px,1.8vw,26px);line-height:1.2}
.pp-meta a{overflow-wrap:anywhere;border-bottom:1px solid var(--line);transition:border-color .4s var(--ease),color .4s var(--ease)}
.pp-meta a:hover{color:var(--gold-sm);border-color:var(--gold)}

/* ---------- policy text ---------- */
.pp-text{max-width:720px;font-size:15.5px;line-height:1.75}
.pp-text>*+*{margin-top:16px}
.pp-text h2{margin-top:clamp(40px,4.4vw,60px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--line);font-size:clamp(26px,2.4vw,36px);line-height:1.12}
.pp-text h2:first-child{margin-top:0;padding-top:0;border-top:0}
.pp-text h2+*{margin-top:18px}
.pp-text em{font-style:italic}
.pp-text h2 em{color:var(--gold-tx)}
.pp-text ul{display:grid;gap:8px}
.pp-text li{position:relative;padding-left:22px}
.pp-text li::before{content:"";position:absolute;left:2px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.pp-text a{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px;overflow-wrap:anywhere;transition:color .3s var(--ease)}
.pp-text a:hover{color:var(--gold-sm)}

/* the footer link to this page shows it is the current page (as the footer menu does) */
.ft-bot a[aria-current="page"]{color:var(--gold)}

@media (max-width:768px){
  .pp-grid{grid-template-columns:1fr}
  .pp-aside{position:static}
  .pp-text{font-size:15px}
}
