/* ============================================================
   JPOWER LEGAL STYLES — shared by privacy.html and temps.html.
   Standalone: legal pages load ONLY this stylesheet, so this
   file owns the page background, text colour and strong contrast.
   Palette mirrors the trade counter: bench, tail white, arc yellow,
   part tray, gunmetal with cast iron rules.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

/* The page background and text colour live HERE because the legal
   pages never load /css/style.css. */
body {
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.72;
  color: #EDEDE6;
  background: #1B1D1F;
  overflow-x: hidden;
}

a { color: #E3B23C; text-decoration: none; }
a:hover { text-decoration: underline; }

.legal-page { background: #1B1D1F; color: #EDEDE6; }

/* Keep any scroll-triggered accent transparent beneath content. */
.legal-container { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.legal-page .legal-content section {
  background: transparent !important;
  margin: 0;
  padding: 0 0 44px;
}

/* ============================================================
   LEGAL HEADER — solid band with a strong h1 contrast
   ============================================================ */
.legal-header {
  position: relative;
  background: #2C2F33;
  border-bottom: 4px solid #E3B23C;
  color: #EDEDE6;
  z-index: 1;
}
.legal-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  padding: 22px 0;
}
.firmmark {
  background: #E3B23C;
  color: #26221A;
  font-weight: 900;
  letter-spacing: 0.08em;
  padding: 9px 16px;
  border-radius: 4px;
  font-size: 16px;
}
.backto-home {
  color: #E3B23C;
  font-weight: 700;
  font-size: 15px;
  border: 2px solid #E3B23C;
  padding: 10px 18px;
  border-radius: 30px;
}
.backto-home:hover { background:#E3B23C; color:#26221A; text-decoration:none; }

.legal-titleband { padding: 44px 0 30px; }
.legal-eyebrow {
  color: #E3B23C;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  display: inline-block;
  border-bottom: 2px solid #E3B23C;
  padding-bottom: 6px;
  margin-bottom: 16px;
}
.legal-titleband h1 {
  color: #FFFFFF;
  font-size: clamp(30px, 5vw, 52px);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -0.01em;
  margin: 4px 0 14px;
}
.legal-docnote {
  color: #CFD0C9;
  font-size: 17px;
  max-width: 720px;
}
.lede-stamp {
  display: inline-block;
  margin-top: 18px;
  background: #26282B;
  border: 1px solid #E3B23C;
  color: #EDEDE6;
  border-radius: 30px;
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 700;
}

/* ============================================================
   TOC
   ============================================================ */
.legal-toc { background:#26282B; border:1px solid #2C2F33; border-radius:10px; padding:6px 0; margin-bottom: 52px; }
.legal-toc h2 { color:#E3B23C; font-size:15px; letter-spacing:.14em; text-transform:uppercase; font-weight:800; padding:14px 20px 6px; }
.legal-toc ol { list-style:none; padding:0 20px 16px; columns: 2 260px; column-gap: 24px; }
.legal-toc li { margin: 0 0 1px; }
.legal-toc a {
  display:block;
  padding: 7px 4px;
  color:#CFD0C9;
  font-size:15px;
  border-bottom:1px solid #2C2F33;
}
.legal-toc a:hover { color:#E3B23C; text-decoration:none; }
.legal-toc a span { color:#E3B23C; font-weight:800; margin-right:8px; }

/* ============================================================
   SECTIONS — strong contrast, independent bands
   ============================================================ */
.legal-content h2 {
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin: 6px 0 18px;
  color:#FFFFFF;
  font-size: clamp(20px, 2.6vw, 28px);
  font-weight: 900;
  line-height:1.2;
  scroll-margin-top: 90px;
}
@media (min-width: 640px) {
  .legal-content h2::before {
    content: "";
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin-top: 2px;
    border: 3px solid #E3B23C;
    border-radius: 50%;
    background: #1B1D1F;
    box-shadow: inset 0 0 0 5px #1B1D1F;
  }
}
@media (max-width: 639px) {
  .legal-content h2 { display:block; }
}
.legal-content h2 .anch {
  color:#E3B23C;
  flex: 0 0 auto;
}
.legal-content p, .legal-content li {
  color:#D5D6D0;
  font-size:16px;
  line-height:1.78;
  margin: 0 0 16px;
}
.legal-content p strong { color:#FFFFFF; font-weight:700; }
.legal-content section h3 {
  color:#E3B23C;
  font-size:17px;
  font-weight:800;
  margin: 20px 0 10px;
  padding-left: 14px;
  border-left: 4px solid #878B8D;
}
.legal-content ul { margin: 0 0 18px; padding-left: 6px; list-style:none; }
.legal-content ul li { position:relative; padding-left: 22px; margin: 0 0 8px; }
.legal-content ul li::before {
  content: "";
  position:absolute;
  left:0;
  top:0.62em;
  width:12px;
  height:2px;
  background:#E3B23C;
}
.legal-content ol { margin: 0 0 18px; padding-left: 24px; counter-reset: legal; }
.legal-content ol > li { padding-left: 10px; margin: 0 0 10px; }

.rule-note {
  border-left: 6px solid #E3B23C;
  background: #26282B;
  border-radius: 4px;
  padding: 16px 18px;
  margin: 4px 0 20px;
  color: #E8E8E2;
  border-right: 1px solid #2C2F33;
}
.rule-note strong { color:#E3B23C; }

.dategrid { display:flex; flex-wrap:wrap; gap:10px 28px; margin: 8px 0 22px; }
.dategrid span { color:#CFD0C9; font-size:15px; }
.dategrid b { color:#FFFFFF; }

.contactcard {
  margin-top: 30px;
  background:#2C2F33;
  border-left: 6px solid #E3B23C;
  border-radius: 6px;
  padding: 24px 24px;
}
.contactcard h3 { color:#FFFFFF; border:none; padding:0; margin:0 0 14px; font-size:19px; }
.contactcard p, .contactcard li { color:#D5D6D0; margin:0 0 8px; }
.contactcard .mono { color:#E3B23C; font-weight:700; }

/* ============================================================
   LEGAL FOOTER
   ============================================================ */
.legal-foot { background:#2C2F33; border-top:2px solid #1B1D1F; }
.legal-container-foot { padding: 34px 24px 26px; border-top: 6px solid #26282B; }
.legal-foot-cols { display:flex; flex-wrap:wrap; gap:26px; justify-content:space-between; align-items:flex-start; }
.legal-foot .firmmark { display:inline-block; margin-bottom:10px; }
.legal-addr {
  color:#D5D6D0;
  font-size:14px;
  line-height:1.6;
  max-width: 480px;
}
.legal-contact line { display:block; }
.legal-contact { color:#D5D6D0; font-size:14px; line-height:1.7; }
.legal-foot-links { display:flex; flex-direction:column; gap:8px; }
.legal-foot-links a { color:#E3B23C; font-weight:700; }
.legal-foot-bottom { margin-top:24px; border-top:1px solid #1B1D1F; padding-top:16px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; align-items:center; color:#CFD0C9; font-size:13px; }
.back-top a { color:#E3B23C; }
.homeagain {
  display:inline-block;
  margin-top: 10px;
  background:#E3B23C;
  color:#26221A;
  font-weight:800;
  padding: 12px 22px;
  border-radius: 6px;
}
.homeagain:hover { text-decoration:none; background:#26282B; color:#E3B23C; }

.EndOfDoc { color:#E3B23C; letter-spacing:.5em; font-weight:800; text-align:left; margin-top: 10px; font-size: 14px; }

/* strong mobile columns */
@media (max-width: 640px) {
  .legal-toc ol { columns: 1; }
  .legal-foot-cols { flex-direction: column; gap: 16px; }
}