/* Shared styling for PeppyPanda's static legal / support pages.
   Mirrors the tokens and type scale used in index.html. */
:root{
  --ink:#1D1B2E;
  --paper:#FFFFFF;
  --paper-dim:#F5F4FC;
  --purple:#8B5CF6;
  --purple-deep:#6D28D9;
  --blue:#3E7AFF;
  --grad: linear-gradient(135deg, var(--purple) 0%, var(--blue) 100%);
  --charcoal:#4A4760;
  --line: rgba(29,27,46,0.1);
  --radius: 24px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Work Sans', sans-serif; -webkit-font-smoothing:antialiased;
  line-height:1.6;
}
h1,h2,h3{ font-family:'Fraunces', serif; font-weight:600; line-height:1.12; margin:0; letter-spacing:-0.01em; }
p{ margin:0; }
a{ color:var(--purple-deep); }
img,svg{ display:block; max-width:100%; }
.wrap{ max-width:760px; margin:0 auto; padding:0 32px; }
@media (max-width: 640px){ .wrap{ padding:0 20px; } }

header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.86); backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; max-width:760px; margin:0 auto; padding-left:32px; padding-right:32px; }
@media (max-width: 640px){ .nav{ padding-left:20px; padding-right:20px; } }
.brand{ display:flex; align-items:center; gap:10px; font-family:'Fraunces', serif; font-weight:600; font-size:1.1rem; text-decoration:none; color:var(--ink); }
.brand img{ width:34px; height:34px; object-fit:contain; }
.nav a.back{ font-weight:600; font-size:0.88rem; text-decoration:none; color:var(--charcoal); }
.nav a.back:hover{ color:var(--purple-deep); }

main{ padding:56px 0 72px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:0.75rem; text-transform:uppercase;
  letter-spacing:0.13em; font-weight:700; padding:7px 14px; border-radius:999px;
  background:var(--paper-dim); color:var(--purple-deep); margin-bottom:20px;
}
.eyebrow .dot{ width:7px;height:7px;border-radius:50%; background:var(--grad); }

h1{ font-size:clamp(1.9rem, 4vw, 2.5rem); }
.updated{ margin-top:14px; font-size:0.9rem; color:var(--charcoal); }

article{ margin-top:40px; }
article h2{ font-size:1.28rem; margin:38px 0 12px; }
article h3{ font-size:1.02rem; margin:24px 0 8px; }
article p{ margin:0 0 14px; color:#2c2a3d; }
article ul,article ol{ margin:0 0 16px; padding-left:22px; color:#2c2a3d; }
article li{ margin:6px 0; }
article strong{ color:var(--ink); }

.callout{
  background:var(--paper-dim); border:1px solid var(--line); border-radius:16px;
  padding:18px 20px; margin:22px 0;
}
.callout p:last-child{ margin-bottom:0; }

.contact-card{
  background:var(--grad); color:#fff; border-radius:20px; padding:26px 26px 28px; margin:28px 0;
}
.contact-card h2{ color:#fff; margin-top:0; }
.contact-card p{ color:rgba(255,255,255,0.9); }
.contact-card a{ color:#fff; font-weight:700; }

.steps{ counter-reset:step; list-style:none; padding-left:0; }
.steps li{ position:relative; padding-left:44px; margin:16px 0; }
.steps li::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:0; top:-2px; width:30px; height:30px; border-radius:50%;
  background:var(--grad); color:#fff; font-weight:700; font-size:0.9rem;
  display:flex; align-items:center; justify-content:center;
}

footer{ background:var(--ink); color:#fff; padding:36px 0 30px; }
.footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.footer-brand{ display:flex; align-items:center; gap:10px; font-family:'Fraunces', serif; font-weight:600; font-size:1rem; }
.footer-brand img{ width:30px; height:30px; object-fit:contain; background:#fff; border-radius:8px; padding:2px; }
.footer-links{ display:flex; gap:18px; flex-wrap:wrap; font-size:0.86rem; }
.footer-links a{ color:#C7B4FF; text-decoration:none; font-weight:600; }
.footer-links a:hover{ text-decoration:underline; }
footer .copyright{ margin-top:20px; font-size:0.82rem; color:rgba(255,255,255,0.5); }
