@charset "utf-8";
/* ==========================================================================
   LEGAL PAGES — privacy policy and terms of use.

   Deliberately plain. These are read, not admired: a single measured column,
   generous leading, no photography, no motion. The only brand present is the
   masthead, the navy and the orange rule, so the page reads as part of the site
   without competing with it.

   Loaded AFTER site.css, which supplies the tokens, the masthead and the footer.
   ========================================================================== */

.legal-hero {
  background: var(--navy);
  color: var(--white);
  padding-block: clamp(120px, 15vh, 190px) clamp(40px, 5vw, 64px);
}
.legal-hero h1 {
  font-size: clamp(44px, 7vw, 84px);
  color: var(--white);
}
.legal-hero .rule { margin-top: 22px; }
.legal-hero__meta {
  margin: 22px 0 0;
  font-size: 16px;
  color: #BDCCE4;
}

/* A template, not counsel. Said plainly at the top of the page so a reader is
   never misled about what this is, and so the site owner is reminded every time
   he opens it that the document is his to review. */
.legal-note {
  background: var(--paper);
  border-left: var(--rule) solid var(--orange);
  padding: clamp(18px, 2.4vw, 26px);
  margin: 0 0 clamp(30px, 4vw, 44px);
}
.legal-note p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--ink); }
.legal-note p + p { margin-top: 10px; }

.legal-body { padding-block: clamp(48px, 6vw, 84px); }
.legal-body .wrap { max-width: 760px; }   /* a reading measure, not the site width */

.legal-body h2 {
  font-size: clamp(28px, 3.4vw, 40px);
  color: var(--navy);
  margin-top: clamp(40px, 5vw, 60px);
}
/* Only kill the top margin when the heading genuinely opens the column.
   :first-of-type matched the first h2 wherever it sat, and on both legal pages
   it sits after the template notice and three paragraphs of intro — so the
   heading collided with the paragraph above it while every later h2 kept its
   proper 40-60px. */
.legal-body .wrap > h2:first-child { margin-top: 0; }
.legal-body h3 {
  font-size: clamp(21px, 2.2vw, 26px);
  color: var(--navy);
  margin-top: clamp(26px, 3vw, 34px);
}
.legal-body p,
.legal-body li {
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink);
}
.legal-body p { margin: 14px 0 0; }
.legal-body ul {
  list-style: disc;
  padding-left: 22px;
  margin: 14px 0 0;
}
.legal-body li { margin-top: 8px; }
.legal-body a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.legal-body a:hover { text-decoration-thickness: 2px; }

.legal-back {
  display: inline-block;
  margin-top: clamp(40px, 5vw, 60px);
  font-family: var(--display);
  font-weight: 400;
  font-size: 22px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--navy);
  text-decoration: none;
}
.legal-back:hover { color: var(--orange-text, #C74600); }

/* The footer, including its policy links, is styled entirely in site.css and is
   identical on these pages and the home page. Nothing footer-related belongs
   here. */
