/* ==========================================================================
   Shared styles for the public legal pages — Terms, Privacy, Refund &
   Cancellation, and Contact. These are standalone static pages that reuse the
   landing page (home.html) look. All four pages link this one stylesheet, which
   is what makes the DRAFT-banner toggle below a single edit.
   ========================================================================== */
:root{
  --paper:#FAF7F0; --paper-2:#F2ECDF; --ink:#1C1B17; --muted:#6B6A5E;
  --pine:#12463A; --pine-deep:#0C3127; --ember:#C2410C; --ember-soft:#E8612B;
  --line:rgba(28,27,23,.12); --line-strong:rgba(28,27,23,.22);
  --radius:14px; --maxw:820px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:600;line-height:1.12;letter-spacing:-.01em;margin:0}
p{margin:0}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:50;background:rgba(250,247,240,.86);
  backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:66px}
.brand{display:flex;align-items:center;gap:10px;font-family:"Fraunces",serif;font-weight:600;
  font-size:21px;letter-spacing:-.02em;text-decoration:none;color:var(--ink)}
.brand .mark{width:30px;height:30px;border-radius:9px;background:var(--ember);
  display:grid;place-items:center;flex:0 0 auto}
.brand .mark svg{width:17px;height:17px}
.nav-cta{display:flex;align-items:center;gap:14px}
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:600;font-size:15px;
  padding:10px 18px;border-radius:11px;border:1px solid transparent;text-decoration:none;
  transition:transform .15s ease,background .15s ease,box-shadow .15s ease}
.btn-primary{background:var(--ember);color:#fff}
.btn-primary:hover{background:var(--ember-soft);transform:translateY(-1px);
  box-shadow:0 8px 22px -10px rgba(194,65,12,.7)}

/* ---------- DRAFT BANNER — ONE-EDIT TOGGLE ----------
   When the legal text has been reviewed and approved, change `display:flex` to
   `display:none` on the .legal-draft rule directly below. That single edit hides
   the "DRAFT — pending legal review" banner on ALL FOUR legal pages, because
   every page links this shared stylesheet. */
.legal-draft{
  display:flex;
  align-items:center;gap:10px;margin:22px 0 6px;
  background:hsl(45 80% 94%);border:1px solid hsl(45 65% 80%);color:#7a5a14;
  border-radius:11px;padding:11px 15px;font-size:14px;line-height:1.45;
}
.legal-draft svg{flex:none;color:#b5891f}
.legal-draft b{font-weight:700}

/* ---------- legal document body ---------- */
.legal-main{padding:8px 0 64px}
.legal-title{font-size:clamp(30px,5vw,42px);margin:20px 0 6px}
.legal-sub{color:var(--muted);font-size:15px;margin:0 0 24px}
.legal-intro{color:#3a352e;font-size:16.5px;margin:0 0 6px}
.legal-sec{margin-top:28px}
.legal-sec h2{font-size:20px;margin:0 0 8px}
.legal-sec p{margin:0 0 10px;color:#2c2823}
.legal-sec ul{margin:0 0 10px;padding-left:22px}
.legal-sec li{margin:0 0 6px;color:#2c2823}
.legal-contact-box{margin-top:30px;padding:18px 20px;background:#fffdf9;
  border:1px solid var(--line);border-radius:14px;font-size:15.5px;line-height:1.85;color:#3a352e}
.legal-contact-box a{color:var(--ember);text-decoration:underline;text-underline-offset:2px}

/* ---------- footer ---------- */
footer.site{padding:36px 0 40px;border-top:1px solid var(--line);margin-top:48px}
.foot-row{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;justify-content:space-between}
.foot-links2{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot-links2 a{color:var(--muted);font-size:14.5px;text-decoration:none}
.foot-links2 a:hover{color:var(--ink)}
.foot-copy{color:var(--muted);font-size:14px}

@media(max-width:560px){.legal-title{font-size:29px} .nav{height:60px}}