/* ============================================================
   Scientists & Poets — site stylesheet
   Built from Brand Guidelines Edition 2026.1
   Plum · Navy · Slate on warm cream · Cabin only · the rule is the motif
   ============================================================ */

@font-face { font-family:'Cabin'; font-style:normal; font-weight:400; font-display:swap; src:url(../fonts/cabin-400.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:normal; font-weight:500; font-display:swap; src:url(../fonts/cabin-500.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:normal; font-weight:600; font-display:swap; src:url(../fonts/cabin-600.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:normal; font-weight:700; font-display:swap; src:url(../fonts/cabin-700.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:italic; font-weight:400; font-display:swap; src:url(../fonts/cabin-400-italic.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:italic; font-weight:500; font-display:swap; src:url(../fonts/cabin-500-italic.woff2) format('woff2'); }
@font-face { font-family:'Cabin'; font-style:italic; font-weight:600; font-display:swap; src:url(../fonts/cabin-600-italic.woff2) format('woff2'); }

:root {
  --plum-50:#f7f1f5; --plum-100:#ecdfe8; --plum-600:#73376b; --plum-700:#5e2f57; --plum-800:#472342;
  --navy-50:#eef4fa; --navy-100:#dbe7f3; --navy-600:#184780; --navy-700:#123a6a; --navy-900:#081d36;
  --slate-100:#e4e6ea; --slate-500:#70798c; --slate-700:#474d5a;
  --paper:#f5f1ed; --paper-deep:#ece5dd; --white:#ffffff;
  --ink-200:#d6d2da; --ink-500:#756d7c; --ink-600:#564f5d; --ink-800:#3a3147; --ink-900:#2a2335;

  --font-primary:'Cabin','Gill Sans MT','Gill Sans','Segoe UI',system-ui,sans-serif;
  --font-logo:Georgia,'Times New Roman',serif; /* the serif lives in the logo and nowhere else */

  --text-strong:var(--ink-900); --text-body:var(--ink-800);
  --text-muted:var(--ink-600); --text-faint:var(--ink-500);

  --rule-hairline:var(--ink-200);
  --radius-sm:3px; --radius-md:5px; --radius-pill:999px;
  --shadow-md:0 4px 12px rgba(42,35,53,.08), 0 1px 3px rgba(42,35,53,.06);
  --shadow-lg:0 12px 32px rgba(42,35,53,.10), 0 2px 8px rgba(42,35,53,.06);
  --ease:cubic-bezier(.2,0,.1,1);
  --container:1280px;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--paper); color:var(--text-body);
  font-family:var(--font-primary); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img { max-width:100%; height:auto; display:block; }
a { color:var(--navy-600); text-decoration-color:var(--ink-200); text-underline-offset:3px; transition:color .18s var(--ease); }
a:hover { color:var(--navy-700); }
:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(42,94,150,.30); border-radius:var(--radius-sm); }
em { font-style:italic; }

.container { max-width:var(--container); margin:0 auto; padding:0 24px; }
.measure { max-width:68ch; }

/* ---- Overlines, ticks, rules — the motif ------------------ */
.overline {
  font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--plum-600); display:flex; align-items:center; gap:12px; margin:0 0 16px;
}
.overline::before { content:""; width:26px; height:2px; background:var(--plum-600); flex:none; }
.overline.navy { color:var(--navy-600); } .overline.navy::before { background:var(--navy-600); }
.tick-list { list-style:none; margin:0; padding:0; }
.tick-list li { position:relative; padding-left:26px; margin:0 0 10px; }
.tick-list li::before { content:""; position:absolute; left:0; top:.72em; width:14px; height:2px; background:var(--plum-600); }
.hr { border:0; height:1px; background:var(--rule-hairline); margin:0; }

/* ---- Type scale ------------------------------------------- */
h1,h2,h3 { font-family:var(--font-primary); color:var(--text-strong); line-height:1.1; margin:0; }
h1 { font-size:clamp(34px,5vw,52px); font-weight:700; letter-spacing:-.02em; }
h2 { font-size:clamp(24px,3.2vw,32px); font-weight:600; }
h3 { font-size:20px; font-weight:600; }
.lede { font-size:19px; line-height:1.6; color:var(--text-muted); }
.accent-word { font-style:italic; color:var(--plum-600); } /* one italic word in plum */

/* ---- Header ------------------------------------------------ */
.site-header { background:var(--paper); border-bottom:1px solid var(--rule-hairline); }
.site-header .bar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 0; flex-wrap:wrap; }
.wordmark { font-family:var(--font-logo); font-size:24px; font-weight:400; color:var(--ink-900); text-decoration:none; line-height:1.2; }
.wordmark .amp { color:var(--plum-600); }
.wordmark span.rule { display:block; height:2px; background:var(--ink-900); margin-top:4px; }
.wordmark:hover { color:var(--ink-900); }
.site-nav { display:flex; gap:28px; flex-wrap:wrap; }
.site-nav a {
  font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-600); text-decoration:none; padding:4px 0; border-bottom:2px solid transparent;
}
.site-nav a:hover { color:var(--plum-600); }
.site-nav a[aria-current="page"] { color:var(--plum-600); border-bottom-color:var(--plum-600); }

/* ---- Hero (dark navy statement) ---------------------------- */
.hero { background:var(--navy-900); color:var(--white); padding:88px 0 96px; }
.hero .overline { color:#d6b9cf; } .hero .overline::before { background:#d6b9cf; }
.hero h1 { color:var(--white); max-width:22ch; }
.hero .lede { color:rgba(255,255,255,.82); max-width:56ch; margin:20px 0 0; font-weight:500; }

/* ---- Buttons ------------------------------------------------ */
.btn {
  display:inline-block; font:600 15px/1 var(--font-primary); letter-spacing:.02em;
  padding:14px 26px; border-radius:var(--radius-md); text-decoration:none; border:0; cursor:pointer;
  transition:background-color .18s var(--ease), transform .12s var(--ease);
}
.btn:active { transform:translateY(1px); }
.btn-plum { background:var(--plum-600); color:var(--white); }
.btn-plum:hover { background:var(--plum-700); color:var(--white); }
.btn-quiet { background:transparent; color:var(--navy-600); box-shadow:inset 0 0 0 1px var(--navy-600); }
.btn-quiet:hover { background:var(--navy-50); color:var(--navy-700); }
.btn[aria-disabled="true"] { background:var(--paper-deep); color:var(--text-faint); pointer-events:none; }

/* ---- Badges ------------------------------------------------- */
.badge {
  display:inline-block; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  padding:5px 12px; border-radius:var(--radius-pill); background:var(--plum-100); color:var(--plum-800);
}

/* ---- Book grid ---------------------------------------------- */
.section { padding:72px 0; }
.section + .section { border-top:1px solid var(--rule-hairline); }
.book-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:40px 32px; margin-top:40px; }
.book-card { text-decoration:none; color:inherit; display:block; }
.book-card .cover-frame {
  background:var(--white); padding:14px; border-radius:var(--radius-md);
  box-shadow:var(--shadow-md); transition:box-shadow .24s var(--ease), transform .24s var(--ease);
}
.book-card:hover .cover-frame { box-shadow:var(--shadow-lg); transform:translateY(-3px); }
.book-card h3 { margin:16px 0 2px; font-size:18px; }
.book-card:hover h3 { color:var(--plum-600); }
.book-card .by { color:var(--text-muted); font-size:15px; margin:0; }
.book-card .meta { color:var(--text-faint); font-size:13px; letter-spacing:.06em; text-transform:uppercase; font-weight:600; margin-top:6px; }

/* ---- Book detail --------------------------------------------- */
.book-detail { display:grid; grid-template-columns:minmax(260px,380px) 1fr; gap:56px; align-items:start; }
.book-detail .cover-frame { background:var(--white); padding:18px; border-radius:var(--radius-md); box-shadow:var(--shadow-lg); position:sticky; top:24px; }
.spec-table { width:100%; border-collapse:collapse; font-size:15px; margin-top:8px; }
.spec-table th { text-align:left; font-weight:600; color:var(--text-muted); padding:10px 16px 10px 0; border-bottom:1px solid var(--rule-hairline); white-space:nowrap; vertical-align:top; }
.spec-table td { padding:10px 0; border-bottom:1px solid var(--rule-hairline); color:var(--text-body); }

/* ---- Poem ----------------------------------------------------- */
.poem { background:var(--white); border-left:2px solid var(--plum-600); border-radius:var(--radius-sm); padding:32px 36px; box-shadow:var(--shadow-md); }
.poem h3 { letter-spacing:.06em; }
.poem pre {
  font-family:var(--font-primary); font-size:17px; line-height:1.75; color:var(--text-body);
  margin:18px 0 0; white-space:pre-wrap;
}
.poem .poem-date { color:var(--text-faint); font-style:italic; font-size:15px; margin-top:18px; }

/* ---- Author ---------------------------------------------------- */
.author-mark { font-family:var(--font-logo); font-size:clamp(40px,6vw,64px); color:var(--ink-900); line-height:1.05; }
.author-books li a { font-weight:600; }
.author-links a { margin-right:20px; font-weight:600; font-size:15px; }

/* ---- Footer ----------------------------------------------------- */
.site-footer { background:var(--navy-900); color:rgba(255,255,255,.82); margin-top:72px; padding:56px 0 48px; font-size:15px; }
.site-footer a { color:var(--white); }
.site-footer .wordmark { color:var(--white); }
.site-footer .wordmark span.rule { background:var(--white); }
.site-footer .cols { display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap; align-items:flex-start; }
.site-footer .legal { margin-top:36px; font-size:13px; color:rgba(255,255,255,.6); }

/* ---- Breadcrumb -------------------------------------------------- */
.crumb { font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); margin:28px 0 0; }
.crumb a { color:var(--text-faint); text-decoration:none; }
.crumb a:hover { color:var(--plum-600); }

@media (max-width:760px) {
  .book-detail { grid-template-columns:1fr; }
  .book-detail .cover-frame { position:static; max-width:340px; }
  .hero { padding:64px 0; }
  .section { padding:56px 0; }
}
@media (prefers-reduced-motion:reduce) {
  * { transition:none !important; animation:none !important; }
  html { scroll-behavior:auto; }
}

/* ---- Fixes & additions (v2) ---------------------------------- */
.hero .accent-word { color:#d6b9cf; } /* knockout-safe plum tint on navy — AA */

.festival { background:var(--plum-600); color:var(--white); }
.festival .inner { display:flex; gap:16px 32px; align-items:baseline; flex-wrap:wrap; padding:18px 0; }
.festival strong { font-weight:700; }
.festival a { color:var(--white); font-weight:600; text-decoration-color:rgba(255,255,255,.5); }
.festival .date { font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:13px; }

.author-index-list li { margin-bottom:22px; }
.author-index-list .who { font-size:20px; font-weight:600; }

/* ---- Uniform cover heights in grids (v3) ---------------------- */
.book-card .cover-frame { display:flex; align-items:center; justify-content:center; height:380px; }
.book-card .cover-frame img { max-height:100%; width:auto; max-width:100%; object-fit:contain; }
@media (max-width:760px) { .book-card .cover-frame { height:300px; } }

/* ---- Substack embed (v4) --------------------------------------- */
.substack-embed { margin-top:24px; max-width:480px; background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-md); padding:8px; }
.substack-embed iframe { display:block; width:100%; max-width:464px; border:0; }
