/* Legal pages — privacy.html, terms.html.
   Loaded alongside styles.css, which supplies the tokens, fonts, nav, brand and
   footer. This file only adds the long-form prose layout, which the one-page
   site had no need for. Kept separate so the homepage does not download rules
   it never uses. */

/* The nav is position:fixed and 70px tall; styles.css bakes that into .hero's
   padding-top, which these pages do not use. */
.legal{padding:calc(70px + clamp(52px,7vw,84px)) 0 clamp(72px,9vw,104px)}

.legal__head{max-width:46rem;margin-bottom:clamp(40px,5vw,60px)}
.legal__head .d2{margin-bottom:16px}
.legal__updated{font-family:var(--m);font-size:.6875rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tx-3)}

/* 68ch is the readable measure for body copy at this size. The page is
   otherwise unconstrained, so without it the prose would run the full 1280px
   of .wrap and become unreadable. */
.legal__body{max-width:68ch}
.legal__body>*+*{margin-top:1.15em}

.legal__body h2{font-family:var(--d);font-weight:400;letter-spacing:-.018em;
  font-size:clamp(1.28rem,2.1vw,1.6rem);line-height:1.2;color:var(--tx);
  margin-top:clamp(42px,5vw,60px);padding-top:clamp(20px,2.5vw,28px);
  border-top:1px solid var(--line)}
.legal__body h2:first-child{margin-top:0;padding-top:0;border-top:0}

.legal__body p{font-size:.9375rem;line-height:1.78;color:var(--tx-2)}
.legal__body strong{color:var(--tx);font-weight:500}

.legal__body ul{margin-top:1.15em;display:flex;flex-direction:column;gap:9px}
.legal__body li{position:relative;padding-left:22px;
  font-size:.9375rem;line-height:1.78;color:var(--tx-2)}
.legal__body li::before{content:"";position:absolute;left:2px;top:.72em;
  width:5px;height:5px;border-radius:50%;background:var(--moss)}

.legal__body a{color:var(--moss);border-bottom:1px solid rgba(79,98,22,.3);
  transition:color .18s,border-color .18s}
.legal__body a:hover{color:var(--moss-2);border-bottom-color:var(--moss-2)}

/* Contact block that closes both documents. */
.legal__contact{margin-top:clamp(42px,5vw,60px);padding:22px 24px;
  border:1px solid var(--line);border-radius:var(--r);background:var(--bg-3)}
.legal__contact p{font-size:.875rem;line-height:1.75;color:var(--tx-2)}
.legal__contact .micro{margin-bottom:10px}

/* Draft banner. These documents were adapted from another company's policy and
   still need a lawyer's eye — see CHANGES-NEEDED.md. Delete the block here and
   the matching markup in both pages once they have been reviewed. */
.legal__draft{max-width:68ch;margin-bottom:clamp(30px,4vw,42px);
  padding:14px 18px;border:1px solid var(--line-2);border-radius:var(--r);
  background:var(--card)}
.legal__draft p{font-size:.8125rem;line-height:1.7;color:var(--tx-2)}
.legal__draft b{color:var(--tx);font-weight:500}

@media (max-width:620px){
  .legal__body h2{margin-top:34px;padding-top:20px}
}