/* ============================================================
   Pepper Siege — Legal Pages Shared Styles
   ============================================================ */
:root{
  --charcoal:#17120e;
  --ember:#E85C28;        /* brightened from #E85C28 for WCAG AA text legibility */
  --brass:#B08D57;
  --parchment:#ece3cf;
  --parchment-2:#e3d9c1;
  --bone:#f4ecd7;

  --ff-display:"Cinzel", "Trajan Pro", serif;
  --ff-body:"EB Garamond", Georgia, serif;
  --ff-mono:"JetBrains Mono", ui-monospace, Menlo, monospace;

  --maxw:880px;
}
*,*::before,*::after{box-sizing:border-box}

/* Accessibility utilities */
.sr-only{
  position:absolute;
  width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;
  top:-100px;left:8px;
  background:var(--charcoal);
  color:var(--ember);
  border:1px solid var(--brass);
  padding:12px 20px;
  font-family:var(--ff-mono);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  z-index:99999;
  transition:top .15s ease;
}
.skip-link:focus,
.skip-link:focus-visible{
  top:8px;
  outline:2px solid var(--ember);
  outline-offset:2px;
}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--charcoal);
  color:var(--parchment);
  font-family:var(--ff-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.05  0 0 0 0 0.04  0 0 0 0 0.03  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/></svg>");
  opacity:.3;pointer-events:none;mix-blend-mode:overlay;z-index:1;
}
.wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:60px 24px 100px;
  position:relative;z-index:2;
}
.topbar{
  position:sticky;top:0;z-index:10;
  backdrop-filter:blur(10px);
  background:rgba(23,22,20,.82);
  border-bottom:1px solid rgba(176,141,87,.2);
}
.topbar-inner{
  max-width:var(--maxw);margin:0 auto;
  padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;
}
.mark{
  display:flex;align-items:center;gap:10px;
  font-family:var(--ff-display);
  font-weight:700;letter-spacing:.28em;font-size:12px;
  color:var(--parchment);text-transform:uppercase;
  text-decoration:none;
}
.mark svg{width:22px;height:22px}
.back{
  font-family:var(--ff-mono);
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--brass);
  text-decoration:none;
  padding:8px 14px;
  border:1px solid rgba(176,141,87,.3);
  transition:border-color .2s, color .2s;
}
.back:hover{border-color:var(--ember);color:var(--ember)}

.kicker{
  font-family:var(--ff-mono);
  font-size:11px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--brass);
  margin-bottom:20px;
  display:flex;align-items:center;gap:14px;
}
.kicker::before{
  content:"";width:24px;height:1px;background:var(--ember);
}
h1{
  font-family:var(--ff-display);
  font-weight:800;
  font-size:clamp(40px, 6vw, 72px);
  line-height:1;
  color:var(--bone);
  margin:0 0 14px;
  text-transform:uppercase;
  letter-spacing:-.01em;
}
h1 .ember{color:var(--ember)}
.updated{
  font-family:var(--ff-mono);
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--brass);
  margin-bottom:50px;
  padding-bottom:30px;
  border-bottom:1px solid rgba(176,141,87,.2);
}
h2{
  font-family:var(--ff-display);
  font-weight:700;
  font-size:clamp(22px, 2.6vw, 30px);
  text-transform:uppercase;
  color:var(--bone);
  letter-spacing:.02em;
  margin:50px 0 18px;
  padding-top:12px;
  position:relative;
}
h2::before{
  content:"";position:absolute;top:0;left:0;width:40px;height:1px;background:var(--ember);
}
h2:first-of-type{margin-top:0}
h2 .num{
  display:inline-block;
  font-family:var(--ff-mono);
  font-size:12px;
  color:var(--brass);
  letter-spacing:.2em;
  margin-right:12px;
  opacity:.8;
  vertical-align:middle;
}
h3{
  font-family:var(--ff-display);
  font-weight:600;
  font-size:18px;
  text-transform:uppercase;
  color:var(--parchment);
  letter-spacing:.04em;
  margin:28px 0 10px;
}
p{margin:0 0 16px;color:var(--parchment-2)}
p:last-child{margin-bottom:0}
a{color:var(--ember);border-bottom:1px solid rgba(214,69,26,.4);text-decoration:none;transition:border-color .2s}
a:hover{border-color:var(--ember)}
strong{color:var(--bone);font-weight:600}
em{color:var(--brass);font-style:italic}
ul,ol{padding-left:22px;margin:0 0 20px;color:var(--parchment-2)}
ul li,ol li{padding:4px 0}
ul li::marker{color:var(--ember)}
code{
  font-family:var(--ff-mono);
  font-size:14px;
  background:rgba(214,69,26,.08);
  color:var(--bone);
  padding:2px 8px;
  border:1px solid rgba(176,141,87,.25);
}
.callout{
  margin:30px 0;
  padding:22px 26px;
  border-left:2px solid var(--ember);
  background:rgba(214,69,26,.05);
  font-family:var(--ff-body);
  font-style:italic;
  color:var(--parchment);
}
.callout strong{font-style:normal;color:var(--bone)}

footer.legal-foot{
  margin-top:80px;
  padding-top:40px;
  border-top:1px solid rgba(176,141,87,.22);
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:16px;
  font-family:var(--ff-mono);
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--brass);
}
footer.legal-foot a{color:var(--brass);border-bottom:1px solid transparent;padding-bottom:2px}
footer.legal-foot a:hover{color:var(--ember);border-color:var(--ember)}

:focus-visible{outline:2px solid var(--ember);outline-offset:3px}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}


/* ------------------------------------------------------------
   Print / Save-as-PDF: the screen theme is dark (light text on
   charcoal). Browsers drop backgrounds by default, leaving light
   text on white paper (near-invisible). Force a legible light theme.
   ------------------------------------------------------------ */
@media print{
  *,*::before,*::after{background:transparent !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important}
  html,body{background:#fff !important;color:#000 !important}
  body::before,body::after{display:none !important}
  .topbar,.back,.skip-link{display:none !important}
  a{color:#000 !important;text-decoration:underline}
  h1,h2,h3,strong{color:#000 !important}
}