/* Konsta Books: shared styles for /thanks/, the legal pages and the landing stub.
   Mobile first. Cream background, sage green accents, serif headings, sans body.
   The buy widget (shop.js) carries its own styles and does not need this file. */
:root {
  --cream: #fff3ee;
  --paper: #ffffff;
  --sage: #5a3fa0;
  --sage-dark: #f03a1a;
  --sage-soft: #f1ecfb;
  --ink: #1b1033;
  --muted: #5b5470;
  --line: #e4dcf3;
  --serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.6;
}
.wrap { max-width: 680px; margin: 0 auto; padding: 0 20px; }
header.site { padding: 18px 0; border-bottom: 1px solid var(--line); }
header.site a { font-family: var(--serif); font-size: 19px; color: var(--ink); text-decoration: none; }
main { padding: 28px 0 48px; }
h1, h2, h3 { font-family: var(--serif); font-weight: 800; letter-spacing: -.02em; line-height: 1.15; color: var(--ink); }
h1 { font-size: 30px; margin: 0 0 12px; }
h2 { font-size: 21px; margin: 32px 0 8px; }
p, ul, ol { margin: 0 0 14px; }
ul, ol { padding-left: 22px; }
a { color: var(--sage-dark); }
.kicker {
  font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--sage-dark); margin: 0 0 8px;
}
.lede { font-size: 19px; }
.muted { color: var(--muted); font-size: 15px; }
.card {
  background: var(--paper); border: 1px solid var(--line); border-radius: 14px;
  padding: 20px; margin: 20px 0;
}
.note { background: var(--sage-soft); border-radius: 12px; padding: 14px 16px; font-size: 16px; }
.btn {
  display: inline-block; background: var(--sage-dark); color: #fff; border: 0; border-radius: 10px;
  padding: 14px 22px; font: 600 17px/1.2 var(--sans); text-decoration: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn:active { background: #d02f12; }
.btn.small { padding: 10px 18px; font-size: 16px; }
.btn.wide { display: block; width: 100%; text-align: center; }
.price { font-family: var(--serif); font-size: 40px; line-height: 1; }
.timer { font-variant-numeric: tabular-nums; font-weight: 600; }
[hidden] { display: none !important; }

/* /thanks/ file list */
.files { list-style: none; padding: 0; margin: 0; }
.files li {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 0; border-top: 1px solid var(--line);
}
.files li:first-child { border-top: 0; }
.files .label { display: block; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--sage-dark); }
.files .name { font-family: var(--serif); font-size: 18px; line-height: 1.25; }
.files .btn { flex: none; }
.spinner {
  width: 26px; height: 26px; border-radius: 50%; border: 3px solid var(--sage-soft);
  border-top-color: var(--sage-dark); animation: kbspin 1s linear infinite; margin: 4px 0 12px;
}
@keyframes kbspin { to { transform: rotate(360deg); } }

footer.site {
  border-top: 1px solid var(--line); padding: 22px 0 40px; font-size: 14px; color: var(--muted);
}
footer.site nav a { margin-right: 14px; white-space: nowrap; color: var(--muted); }
footer.site p { margin: 10px 0 0; }

@media (min-width: 720px) {
  h1 { font-size: 36px; }
  main { padding: 40px 0 64px; }
}