/* Therapist Made Simple site styles (the books' palette, brands/thms/brand.json in madesimple-books;
   brands/thms/public/app/brand.css has the same tokens): deep teal core on warm paper, apricot button and Book 1, lake
   blue for Book 2, lavender for Book 3, sea green for the handouts. Token names are kept from the reference consumer frame (navy = the heading
   colour, gold = the button) so the page layout stays the same. Fonts: Lora (display) and Inter (body), self-hosted
   Latin subsets, SIL OFL 1.1 (licenses in assets/fonts/). No Google Fonts calls. */
@font-face { font-family: 'Lora'; src: url('fonts/Lora.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Lora'; src: url('fonts/Lora-Italic.woff2') format('woff2'); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('fonts/Inter.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  /* deep pine core on warm cream (the books' palette); marigold is a fill (the button), never body text */
  --navy: #1F3B42; --navy-deep: #152B31; --navy-raised: #2A4C54;
  --cream: #F7F4EE; --paper: #FFFDF9; --sand: #ECE6DA; --line: #E0DACE;
  --ink: #1D2B2F; --ink-2: #46575B; --muted: #5C6A6D;
  --gold: #EFA374; --gold-hover: #E08D5A; --gold-edge: #C47640; --gold-tint: #ECE9F7; --gold-deep: #4E4590;
  --accent: #2D6A4C;
  --cover-page: #E4EEF6;
  --rose-tint: #FCE9DC; --rose: #EFA374; --rose-deep: #9A4A1E;
  --sage-tint: #E4F2EA; --sage: #8FC2A6; --sage-deep: #2D6A4C;
  --sky-tint: #E4EEF6; --sky: #86B4D3; --sky-deep: #285A7C;
  --butter-tint: #ECE9F7; --butter: #ACA3D9; --butter-deep: #4E4590;
  --plum-tint: #E2EAEC; --plum: #1F3B42; --plum-deep: #1F3B42;
  --font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --radius-card: 20px;
  --shadow-soft: 0 10px 30px rgba(34, 57, 45, 0.09);
  --wrap: 1080px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: var(--font-body); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--sky-deep); }
h1, h2, h3, .price { font-family: var(--font-display); font-weight: 600; color: var(--navy); line-height: 1.15; margin: 0 0 0.5em; letter-spacing: -0.005em; }
h1 em, h2 em, h3 em, .emphasis { font-style: italic; font-weight: 600; color: var(--accent); }
h2 { font-size: clamp(28px, 4vw, 40px); }
h3 { font-size: 22px; }
p { margin: 0 0 1em; }
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }
.narrow { max-width: 760px; }
section { padding: 56px 0; }
section.alt { background: var(--sand); }
.lede { font-size: 19px; color: var(--ink-2); max-width: 680px; }
.center { text-align: center; }
.center .lede, .lede.center { margin-left: auto; margin-right: auto; }
.label { font: 800 0.78rem/1 var(--font-body); text-transform: uppercase; letter-spacing: 0.18em; color: var(--muted); display: block; margin-bottom: 12px; }
.pill { display: inline-block; font: 800 0.75rem/1 var(--font-body); text-transform: uppercase; letter-spacing: 0.16em; padding: 0.5em 0.9em; border-radius: 999px; white-space: nowrap; background: var(--gold-tint); color: var(--gold-deep); }
.btn { display: inline-flex; align-items: center; justify-content: center; background: var(--gold); color: var(--navy); font: 800 1.05rem/1 var(--font-body); padding: 1.05em 1.8em; border-radius: 14px; border: 0; border-bottom: 3px solid var(--gold-edge); text-decoration: none; cursor: pointer; text-align: center; transition: background .15s, transform .15s; }
.btn:hover { background: var(--gold-hover); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 3px solid var(--sky-deep); outline-offset: 3px; }
.band { background: var(--navy); color: var(--cream); }
.band h2, .band h3 { color: var(--cream); }
.band h2 em { color: var(--gold); }
.card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-card); box-shadow: var(--shadow-soft); }
.hat-rule { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 auto 16px; width: 240px; }
.hat-rule::before, .hat-rule::after { content: ''; flex: 1; height: 3px; border-radius: 3px; background: var(--gold); }
.hat-rule svg { width: 26px; height: 26px; flex: none; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tag { display: inline-flex; align-items: center; white-space: nowrap; font: 800 13px/1 var(--font-body); padding: 7px 11px; border-radius: 999px; border: 1px solid transparent; }
.tag.rose { background: var(--rose-tint); color: var(--rose-deep); border-color: #F4C8AA; }
.tag.sage { background: var(--sage-tint); color: var(--sage-deep); border-color: #C2E1CF; }
.tag.sky { background: var(--sky-tint); color: var(--sky-deep); border-color: #BDD6EE; }
.tag.butter { background: var(--butter-tint); color: var(--butter-deep); border-color: #D3CEEE; }
.tag.plum { background: var(--plum-tint); color: var(--plum-deep); border-color: #C6D1DE; }
.trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.trust span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.trust svg { width: 16px; height: 16px; flex: none; }
.trust i { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; background: var(--gold-tint); color: var(--gold-deep); align-items: center; justify-content: center; }
.fine { font-size: 13px; color: var(--muted); line-height: 1.5; }

/* Policy pages */
.policy { max-width: 720px; margin: 0 auto; padding: 48px 20px 72px; }
.policy h1 { font-size: clamp(32px, 5vw, 44px); }
.policy h2 { font-size: 24px; margin-top: 1.6em; }
.policy .effective { color: var(--muted); font-weight: 700; margin-bottom: 2em; }
.policy ul { padding-left: 1.2em; }
.policy li { margin-bottom: .5em; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; max-width: var(--wrap); margin: 0 auto; }
.brand-lockup { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--navy); font-family: var(--font-display); font-weight: 600; font-size: 21px; }
.brand-lockup img { width: 38px; height: 38px; flex: none; border-radius: 9px; }
.header-rule { height: 4px; background: linear-gradient(90deg, var(--gold-tint), var(--gold) 50%, var(--gold-tint)); }
.site-footer { background: var(--navy-deep); color: var(--cream); padding: 40px 20px 48px; font-size: 14px; text-align: center; }
.site-footer .wrap { max-width: 860px; }
.site-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; margin-bottom: 18px; font-weight: 700; }
.site-footer nav a { color: var(--cream); text-decoration: none; white-space: nowrap; }
.site-footer nav a:hover { text-decoration: underline; }
.site-footer p { color: #CBD5E1; margin-bottom: .6em; line-height: 1.55; }
.site-footer .copy { color: var(--cream); }