/* =====================================================================
   BRANDON MYSLIWIEC PUBLISHING — the library
   Origin: the publishing seal — parchment cream, forest green, gold,
   quill & open book. A LIGHT, editorial world (a deliberate contrast to
   the dark brand pages). Series pages re-theme via CSS vars set inline,
   so each series carries a palette drawn from its own covers.
   body[data-page="publishing"] = the light library
   body[data-page="series"]     = a themed series page (overrides vars)
   ===================================================================== */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/fraunces-400.woff2') format('woff2');}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/fraunces-500.woff2') format('woff2');}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/fraunces-600.woff2') format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/fraunces-400-italic.woff2') format('woff2');}

body[data-page="publishing"],body[data-page="series"]{
  --paper:#f4ecd9; --paper-2:#ece0c6; --ink:#241d12; --ink-soft:#5b513f;
  --green:#41573f; --gold:#b3893a; --line:rgba(36,29,18,.16); --accent:var(--green);
  --serif:'Fraunces',Georgia,serif; --sans:'Archivo',system-ui,sans-serif;
  background:var(--paper); color:var(--ink); padding-top:var(--nav-h);
  font-family:var(--sans); line-height:1.65; overflow-x:hidden;
}
.p-wrap{max-width:1140px;margin-inline:auto;padding-inline:clamp(18px,4vw,44px)}
body[data-page="publishing"] h1,body[data-page="publishing"] h2,body[data-page="publishing"] h3,
body[data-page="series"] h1,body[data-page="series"] h2,body[data-page="series"] h3{font-family:var(--serif);font-weight:500;line-height:1.1;letter-spacing:-.01em}
.p-rule{display:flex;align-items:center;gap:1rem;color:var(--gold);justify-content:center}
.p-rule::before,.p-rule::after{content:"";height:1px;background:var(--gold);flex:1;max-width:120px;opacity:.6}
.smallcaps{font-family:var(--sans);text-transform:uppercase;letter-spacing:.24em;font-size:.72rem;font-weight:600;color:var(--green)}

/* ---- MASTHEAD ------------------------------------------------------ */
.p-masthead{text-align:center;padding:clamp(40px,6vw,80px) 0 clamp(28px,4vw,48px)}
.p-masthead .seal{width:clamp(110px,16vw,168px);margin:0 auto 1.4rem;filter:drop-shadow(0 8px 20px rgba(36,29,18,.25))}
.p-masthead h1{font-size:clamp(2.3rem,5.4vw,4rem);margin:.4rem 0}
.p-masthead .tag{font-style:italic;font-family:var(--serif);font-size:clamp(1.1rem,2vw,1.5rem);color:var(--ink-soft)}
.p-masthead p.intro{max-width:60ch;margin:1.4rem auto 0;color:var(--ink-soft)}

/* ---- SERIES SUB-NAV ------------------------------------------------ */
.series-nav{position:sticky;top:var(--nav-h);z-index:50;background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:blur(8px);border-block:1px solid var(--line);margin-bottom:clamp(28px,4vw,52px)}
.series-nav .row{display:flex;gap:clamp(.8rem,2vw,1.8rem);overflow-x:auto;padding:.9rem 0;justify-content:center;flex-wrap:wrap}
.series-nav a{white-space:nowrap;font-family:var(--sans);font-size:.86rem;font-weight:600;color:var(--ink-soft);padding:.2em 0;border-bottom:2px solid transparent;transition:.2s}
.series-nav a:hover,.series-nav a[aria-current="page"]{color:var(--green);border-bottom-color:var(--gold)}

/* ---- LIBRARY (series cards) --------------------------------------- */
.p-library{padding-bottom:clamp(40px,6vw,80px)}
.lib-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,3vw,32px)}
@media(max-width:760px){.lib-grid{grid-template-columns:1fr}}
.series-card{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,28px);align-items:center;
  background:var(--paper-2);border:1px solid var(--line);border-radius:6px;padding:clamp(18px,2.4vw,26px);transition:transform .25s,box-shadow .25s}
.series-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px -24px rgba(36,29,18,.5)}
.series-card img{width:clamp(96px,12vw,128px);aspect-ratio:2/3;object-fit:cover;border-radius:3px;box-shadow:0 10px 24px -10px rgba(0,0,0,.5);
  transform:rotate(-2deg)}
.series-card .sc-body h3{font-size:clamp(1.3rem,2.4vw,1.7rem);margin-bottom:.3rem}
.series-card .sc-body .log{font-style:italic;font-family:var(--serif);color:var(--ink-soft);margin-bottom:.6rem}
.series-card .sc-body .meta{font-size:.8rem;color:var(--green);font-weight:600;letter-spacing:.04em}
.series-card .go{margin-top:.7rem;display:inline-flex;align-items:center;gap:.4em;font-weight:700;color:var(--green)}
.series-card:hover .go{color:var(--gold)}

/* ---- FEATURED / OTHER --------------------------------------------- */
.p-featured{background:var(--paper-2);border-block:1px solid var(--line);padding:clamp(40px,6vw,80px) 0}
.p-featured h2,.p-other h2{font-size:clamp(1.7rem,3.4vw,2.4rem);text-align:center;margin-bottom:.4rem}
.p-featured .sub,.p-other .sub{text-align:center;color:var(--ink-soft);margin-bottom:2rem}
.shelf{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,28px)}
@media(max-width:820px){.shelf{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.shelf{grid-template-columns:repeat(2,1fr)}}
.book{display:flex;flex-direction:column}
.book .cv{position:relative;border-radius:3px;overflow:hidden;box-shadow:0 14px 30px -14px rgba(0,0,0,.55);aspect-ratio:2/3;background:#cdbf9f}
.book .cv img{width:100%;height:100%;object-fit:cover}
.book.soon .cv{display:grid;place-items:center;background:linear-gradient(160deg,var(--paper-2),#d8c9a8);border:1px dashed var(--line)}
.book.soon .cv span{font-family:var(--serif);font-style:italic;color:var(--ink-soft);text-align:center;padding:1rem}
.book h3{font-family:var(--serif);font-size:1rem;margin:.7rem 0 .15rem;line-height:1.2}
.book .bmeta{font-size:.78rem;color:var(--ink-soft);margin-bottom:.5rem}
.book .badge{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.2em .55em;border-radius:3px}
.badge-live{background:var(--green);color:#f4ecd9}
.badge-soon{background:transparent;border:1px solid var(--gold);color:var(--gold)}
.book .amz{margin-top:auto;padding-top:.6rem}
.btn-amz{display:inline-flex;align-items:center;gap:.4em;font-size:.82rem;font-weight:700;color:var(--green);border-bottom:2px solid var(--gold);padding-bottom:1px}
.btn-amz:hover{color:var(--gold)}
.p-other{padding:clamp(40px,6vw,80px) 0}

/* ---- buttons / CTA ------------------------------------------------- */
.btn-ink{display:inline-flex;align-items:center;gap:.5em;background:var(--green);color:#f4ecd9;font-weight:700;padding:.9em 1.6em;border-radius:4px;transition:.2s}
.btn-ink:hover{background:var(--ink)}
.btn-quill{display:inline-flex;align-items:center;gap:.5em;border:1px solid var(--green);color:var(--green);font-weight:700;padding:.9em 1.5em;border-radius:4px;transition:.2s}
.btn-quill:hover{background:var(--green);color:var(--paper)}
.p-cta{text-align:center;padding:clamp(56px,8vw,110px) 0}
.p-cta h2{font-size:clamp(1.9rem,4vw,2.8rem)}
.p-cta p{color:var(--ink-soft);max-width:52ch;margin:1rem auto 1.8rem}

/* =====================================================================
   SERIES PAGES — themed via inline vars (--paper/--ink/--accent/--gold)
   ===================================================================== */
.s-hero{padding:clamp(40px,7vw,90px) 0 clamp(32px,5vw,60px)}
.s-hero .inner{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,60px);align-items:center}
.s-hero .cover{width:100%;max-width:320px;margin-inline:auto;border-radius:5px;box-shadow:0 30px 60px -24px rgba(0,0,0,.6);transform:rotate(-2deg)}
.s-hero h1{font-size:clamp(2.2rem,5vw,3.6rem);margin:.5rem 0}
.s-hero .log{font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,2.2vw,1.6rem);color:var(--accent);margin-bottom:1rem}
.s-hero p{color:var(--ink-soft);max-width:54ch;margin-bottom:1rem}
.s-hero .cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.2rem}
.s-hero .crumb{margin-bottom:.6rem}
.s-hero .crumb a{color:var(--accent);font-weight:600;font-size:.85rem}

.s-section{padding:clamp(36px,5vw,72px) 0;border-top:1px solid var(--line)}
.s-section h2{font-size:clamp(1.6rem,3.4vw,2.4rem);margin-bottom:.3rem}
.s-section .sub{color:var(--ink-soft);margin-bottom:2rem}
.reading{display:flex;flex-direction:column;gap:clamp(14px,2vw,20px)}
.read-book{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,32px);align-items:center;
  background:color-mix(in srgb,var(--paper) 80%,transparent);border:1px solid var(--line);border-radius:6px;padding:clamp(16px,2.4vw,24px)}
.read-book .cv{width:clamp(80px,10vw,110px);aspect-ratio:2/3;object-fit:cover;border-radius:3px;box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.read-book .num{font-family:var(--serif);font-size:1.4rem;color:var(--accent);min-width:1.4em}
.read-book .rb-body h3{font-size:1.25rem;margin-bottom:.25rem}
.read-book .rb-body p{color:var(--ink-soft);font-size:.92rem;max-width:60ch;margin:.3rem 0}
.read-book .rb-side{text-align:right;display:flex;flex-direction:column;gap:.5rem;align-items:flex-end}
.read-book.soon{opacity:.92}
.read-book.soon .cv{display:grid;place-items:center;background:linear-gradient(160deg,var(--paper-2),#d8c9a8);border:1px dashed var(--line);font-family:var(--serif);font-style:italic;color:var(--ink-soft);font-size:.8rem;text-align:center}
@media(max-width:680px){.s-hero .inner{grid-template-columns:1fr}.s-hero .cover{order:-1}
  .read-book{grid-template-columns:auto 1fr}.read-book .rb-side{grid-column:1/-1;flex-direction:row;align-items:center;text-align:left}}

.arc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:760px){.arc-grid{grid-template-columns:1fr}}
.arc{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center;background:color-mix(in srgb,var(--paper) 80%,transparent);border:1px solid var(--line);border-radius:6px;padding:16px}
.arc img{width:64px;aspect-ratio:2/3;object-fit:cover;border-radius:3px}
.arc h3{font-size:1.05rem}.arc span{font-size:.78rem;color:var(--ink-soft)}
