:root{
  --navy:#101B2E; --gold:#D4AF6A; --wine:#6E1F2E; --warm:#F5EFE3;
  --paper:#FBF7F0; --ink:#20242C; --ink-soft:#5A5F6B; --rule:rgba(16,27,46,.14);
  --card:#fff;
}
@media (prefers-color-scheme:dark){
  :root{--paper:#0D1624;--ink:#E8E2D6;--ink-soft:#9AA3B2;--rule:rgba(212,175,106,.26);--card:#131F31}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:inherit}

/* ---------- header ---------- */
.top{background:var(--paper);color:var(--ink);border-bottom:2px solid var(--gold)}
.top-inner{max-width:60em;margin:0 auto;padding:26px 24px 18px;text-align:center}
.logo{display:block;margin:0 auto;max-width:250px}
.logo-svg{width:250px;height:auto;color:var(--ink)}
#lm{display:none}
@media (prefers-color-scheme:dark){.logo-img{filter:invert(1)}}
.logo-text{font-family:"Playfair Display",Georgia,serif;font-size:2rem;letter-spacing:.02em;margin:0;color:var(--ink)}
.tagline{font-family:"Playfair Display",Georgia,serif;font-size:11px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--wine);margin:10px 0 0}
@media (prefers-color-scheme:dark){.tagline{color:var(--gold)}}
nav{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px 26px;justify-content:center}
nav a{font-family:"Playfair Display",Georgia,serif;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;color:var(--ink);opacity:.7;padding:4px 0;
  border-bottom:1px solid transparent}
nav a:hover,nav a[aria-current=page]{opacity:1;border-bottom-color:var(--gold);color:var(--wine)}
@media (prefers-color-scheme:dark){nav a:hover,nav a[aria-current=page]{color:var(--gold)}}
/* footer nav keeps the light-on-navy treatment */
footer nav a{color:rgba(245,239,227,.75);opacity:1}
footer nav a:hover{color:var(--gold);border-bottom-color:var(--gold)}

/* ---------- layout ---------- */
.wrap{max-width:38em;margin:0 auto;padding:0 24px 64px}
.wrap.wide{max-width:56em}
.read{max-width:34em;margin-left:auto;margin-right:auto}
h1{font-family:"Playfair Display",Georgia,serif;font-weight:700;line-height:1.12;
  font-size:clamp(2rem,6vw,2.9rem);margin:52px 0 14px;text-align:center;letter-spacing:-.01em}
h2{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:1.5rem;
  margin:44px 0 12px;line-height:1.25}
h3{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:1.15rem;margin:0 0 6px}
.lede{text-align:center;font-size:1.06rem;color:var(--ink-soft);font-style:italic;
  max-width:28em;margin:0 auto 34px}
p{margin:0 0 1.15em}
.orn{border:0;text-align:center;margin:40px 0;overflow:visible}
.orn::before{content:"\2756";color:var(--gold);font-size:14px;letter-spacing:.5em}

/* ---------- buttons ---------- */
.cta{display:inline-block;background:var(--navy);color:var(--warm);text-decoration:none;
  font-family:"Playfair Display",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;
  font-size:12.5px;padding:14px 26px;border:1px solid var(--gold);border-radius:2px}
.cta:hover{background:var(--wine)}
.cta.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.cta.ghost:hover{background:var(--navy);color:var(--warm);border-color:var(--gold)}
@media (prefers-color-scheme:dark){.cta{background:transparent;color:var(--gold)}.cta:hover{background:var(--wine);color:var(--warm)}}
.center{text-align:center}

/* ---------- books ---------- */
.book{display:grid;grid-template-columns:150px 1fr;gap:26px;align-items:start;
  padding:28px 0;border-bottom:1px solid var(--rule)}
.book:last-child{border-bottom:0}
.book .art{width:150px;aspect-ratio:2/3;background:var(--navy);border-radius:3px;
  box-shadow:0 10px 26px rgba(16,27,46,.24);display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-family:"Playfair Display",Georgia,serif;font-size:11px;letter-spacing:.2em;
  text-align:center;padding:12px;overflow:hidden}
.book .art img{width:100%;height:100%;object-fit:cover;border-radius:3px}
.num{font-family:"Playfair Display",Georgia,serif;font-size:11px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);margin:0 0 4px}
.sub{font-style:italic;color:var(--ink-soft);font-size:.92rem;margin:0 0 10px}
.blurb{font-size:.98rem;margin:0 0 14px}
.pill{display:inline-block;font-family:"Playfair Display",Georgia,serif;font-size:10.5px;
  letter-spacing:.18em;text-transform:uppercase;padding:4px 10px;border:1px solid var(--rule);
  border-radius:99px;color:var(--ink-soft)}
@media (max-width:560px){
  .book{grid-template-columns:110px 1fr;gap:18px}
  .book .art{width:110px}
}

/* ---------- signup ---------- */
.signup{background:var(--navy);color:var(--warm);border-top:3px solid var(--gold);margin-top:56px}
.signup-inner{max-width:34em;margin:0 auto;padding:44px 24px 48px;text-align:center}
.signup h2{color:var(--warm);margin-top:0}
.signup p{color:rgba(245,239,227,.82);font-size:1rem}
.signup .cta{background:var(--gold);color:var(--navy);border-color:var(--gold);font-weight:700}
.signup .cta:hover{background:var(--warm);color:var(--navy)}
.embed{margin:20px auto 0;max-width:26em}

/* ---------- footer ---------- */
footer{background:var(--navy);color:rgba(245,239,227,.6);text-align:center;
  padding:26px 24px 34px;font-size:.82rem;border-top:1px solid rgba(212,175,106,.2)}
footer a{color:var(--gold);text-decoration:none}
footer nav{margin-bottom:14px}
footer nav a{color:rgba(245,239,227,.75)}

/* ---------- scene ---------- */
.scene p{margin:0 0 1.15em}
.scene p.drop::first-letter{font-family:"Playfair Display",Georgia,serif;font-weight:700;
  float:left;font-size:3.3em;line-height:.86;padding:.06em .09em 0 0;color:var(--wine)}
@media (prefers-color-scheme:dark){.scene p.drop::first-letter{color:var(--gold)}}
.note{border-left:3px solid var(--gold);padding:2px 0 2px 20px;margin:0 0 40px;
  color:var(--ink-soft);font-size:1rem;line-height:1.65}
.note p{margin:0 0 .85em}
.note p:last-child{margin-bottom:0}
.note .sig{font-family:"Playfair Display",Georgia,serif;font-style:italic;color:var(--ink);font-size:1.05rem}
.card{background:var(--card);border:1px solid var(--rule);border-radius:4px;padding:22px 24px;margin:0 0 18px}
.card h3{margin-bottom:4px}
.card p{margin:0;font-size:.97rem;color:var(--ink-soft)}

/* ---- data-driven additions ---- */
.series-block{margin-bottom:8px}
.series-block h2{text-align:center;margin-top:0}
.series-blurb{text-align:center;color:var(--ink-soft);font-size:1rem;max-width:30em;margin:0 auto 18px}
.art.ph{font-family:"Playfair Display",Georgia,serif;font-size:11px;letter-spacing:.14em;
  line-height:1.5;color:var(--gold);text-align:center;padding:14px}
.series-nav{text-align:center;margin:0 0 34px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.series-nav .cta{font-size:11px;padding:10px 16px}


/* ---------------- signup form ---------------- */
.jm-signup{max-width:26em;margin:22px auto 0;text-align:left}
.jm-row{display:flex;gap:10px}
.jm-input{
  flex:1 1 auto;min-width:0;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  font-size:16px;line-height:1.4;padding:14px 15px;
  background:var(--warm);color:var(--navy);
  border:1px solid rgba(212,175,106,.55);border-radius:2px;outline:none;
}
.jm-input::placeholder{color:rgba(16,27,46,.45)}
.jm-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,175,106,.25)}
.jm-btn{
  flex:0 0 auto;cursor:pointer;
  font-family:"Playfair Display",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;
  font-size:12px;font-weight:700;padding:14px 22px;
  background:var(--gold);color:var(--navy);border:1px solid var(--gold);border-radius:2px;
}
.jm-btn:hover{background:var(--warm)}
.jm-btn[disabled]{opacity:.6;cursor:default}
.jm-fine{margin:14px 0 0;font-size:.82rem;line-height:1.5;color:rgba(245,239,227,.62);text-align:center}
.jm-done{text-align:center;color:var(--warm)}
.jm-done-h{font-family:"Playfair Display",Georgia,serif;font-size:1.3rem;margin:0 0 8px;color:var(--gold)}
.jm-done p{font-size:.95rem;line-height:1.6;color:rgba(245,239,227,.85)}
.jm-err{color:#ffb4a8;font-size:.85rem;text-align:center;margin:10px 0 0}

/* the form also appears on a cream page (the free page) */
.on-paper .jm-fine{color:var(--ink-soft)}
.on-paper .jm-input{background:#fff;border-color:var(--rule)}
.on-paper .jm-btn{background:var(--navy);color:var(--warm);border-color:var(--gold)}
.on-paper .jm-btn:hover{background:var(--wine)}
.on-paper .jm-done{color:var(--ink)}
.on-paper .jm-done-h{color:var(--wine)}
.on-paper .jm-done p{color:var(--ink-soft)}
@media (prefers-color-scheme:dark){
  .on-paper .jm-input{background:#0b1220;color:var(--warm)}
  .on-paper .jm-btn{background:transparent;color:var(--gold)}
  .on-paper .jm-done-h{color:var(--gold)}
}
@media (max-width:460px){ .jm-row{flex-direction:column} .jm-btn{width:100%} }


/* ---- free / magnet page ---- */
.art-hero{text-align:center;margin:0 0 32px}
.art-hero img{width:min(230px,58%);border-radius:3px;box-shadow:0 16px 40px rgba(16,27,46,.3)}
.tropes{max-width:30em;margin:26px auto 0;text-align:center;font-size:.88rem;line-height:1.9;
  color:var(--ink-soft);letter-spacing:.01em}
.cta-big{font-size:14px;padding:18px 34px}
.fineprint{font-size:.82rem;color:var(--ink-soft);max-width:28em;margin-left:auto;margin-right:auto}