/* ============================================================
   JMWatch — shared stylesheet
   "Saxon Paper" palette + typography, LOCKED.
   See JMWATCH_STYLE.md. Do not drift toward defaults.
   ============================================================ */

@font-face{font-family:'Newsreader';font-style:normal;font-weight:400 500;font-display:swap;src:url('/fonts/newsreader-medium.woff') format('woff');}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:400 500;font-display:swap;src:url('/fonts/newsreader-mediumitalic.woff') format('woff');}

:root{
  --paper:#F4EEE3;
  --surface:#EBE3D5;
  --ink:#25211C;
  --ink-deep:#1A1714;
  --oxblood:#7A1E2B;
  --brass:#9A7B3F;
  --divider:#D9CEBC;
  --caption:#7a6a58;
  --stand:#5a4a3a;
  --maxw:760px;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Newsreader',Georgia,serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.container{max-width:var(--maxw);margin:0 auto;padding-left:40px;padding-right:40px;}

/* ---- navigation ---- */
.nav{border-bottom:1px solid var(--divider);position:sticky;top:0;background:var(--paper);z-index:10;}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:20px 0;}
.logo{font-family:'Newsreader',serif;font-weight:500;font-size:22px;color:var(--ink-deep);letter-spacing:-0.01em;text-decoration:none;}
.logo .jm{color:var(--oxblood);}
.navlinks{display:flex;gap:26px;font-family:Georgia,serif;font-size:13.5px;}
.navlinks a{color:var(--stand);text-decoration:none;padding-bottom:3px;border-bottom:1.5px solid transparent;transition:color .15s ease,border-color .15s ease;}
.navlinks a:hover{color:var(--ink-deep);}
.navlinks a.on{color:var(--ink-deep);border-bottom-color:var(--oxblood);}

/* ---- generic page header ---- */
.phead{padding:56px 0 12px;}
.kicker{font-family:Georgia,serif;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--oxblood);margin-bottom:20px;}
.phead h1{font-family:'Newsreader',serif;font-weight:500;font-size:40px;line-height:1.1;color:var(--ink-deep);letter-spacing:-0.02em;margin-bottom:16px;}
.phead .intro{font-family:'Newsreader',serif;font-size:18px;line-height:1.6;color:var(--ink);max-width:54ch;}

/* ---- home hero ---- */
.hero-home{padding:64px 0 30px;}
.hero-home h1{font-family:'Newsreader',serif;font-weight:500;font-size:46px;line-height:1.08;color:var(--ink-deep);letter-spacing:-0.02em;margin-bottom:22px;max-width:16ch;}
.hero-home p{font-family:'Newsreader',serif;font-size:19px;line-height:1.6;color:var(--ink);max-width:54ch;margin-bottom:16px;}
.hr-soft{height:1px;background:var(--divider);margin:24px 0 6px;}

/* ---- card grid (home sections) ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;padding:14px 0 56px;}
.card{background:var(--surface);border-radius:10px;padding:26px 24px 24px;transition:transform .18s ease, box-shadow .18s ease;}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(40,33,25,0.10);}
.card .num{font-family:Georgia,serif;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--brass);margin-bottom:14px;}
.card h3{font-family:'Newsreader',serif;font-weight:500;font-size:20px;line-height:1.2;color:var(--ink-deep);margin-bottom:10px;}
.card p{font-family:'Newsreader',serif;font-size:15px;line-height:1.55;color:#3a342c;margin-bottom:16px;}
.card .go{font-family:Georgia,serif;font-size:13.5px;color:var(--oxblood);border-bottom:1px solid var(--oxblood);padding-bottom:2px;text-decoration:none;}

/* ---- featured (dark) ---- */
.feat{background:var(--ink);border-radius:10px;padding:30px 32px;margin-bottom:50px;}
.feat .lbl{font-family:Georgia,serif;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:#c89b5a;margin-bottom:12px;}
.feat h3{font-family:'Newsreader',serif;font-weight:500;font-size:24px;line-height:1.2;color:var(--paper);margin-bottom:8px;}
.feat p{font-family:'Newsreader',serif;font-size:15.5px;line-height:1.55;color:#cfc4b2;margin-bottom:14px;max-width:56ch;}
.feat .go{font-family:Georgia,serif;font-size:13.5px;color:#e8b574;border-bottom:1px solid #8a6a3a;padding-bottom:2px;text-decoration:none;}

/* ---- index list (guide / essays) ---- */
.list{padding:30px 0 50px;}
.item{display:block;text-decoration:none;padding:26px 0;border-top:1px solid var(--divider);transition:padding-left .18s ease;}
.item:hover{padding-left:8px;}
.item .meta{font-family:Georgia,serif;font-size:12px;color:var(--brass);margin-bottom:9px;}
.item h2{font-family:'Newsreader',serif;font-weight:500;font-size:25px;line-height:1.16;color:var(--ink-deep);margin-bottom:8px;}
.item p{font-family:'Newsreader',serif;font-size:16px;line-height:1.5;color:#3a342c;max-width:62ch;margin-bottom:12px;}
.item .go{font-family:Georgia,serif;font-size:13.5px;color:var(--oxblood);border-bottom:1px solid var(--oxblood);padding-bottom:2px;}
.tag{display:inline-block;font-family:Georgia,serif;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;padding:3px 9px;border-radius:3px;margin-right:8px;}
.tag.ready{color:var(--oxblood);background:var(--surface);}
.tag.planned{color:var(--caption);border:1px solid #c9bca6;}
.item.soon{opacity:0.6;}
.item.soon:hover{padding-left:0;cursor:default;}
.more{font-family:Georgia,serif;font-style:italic;font-size:13.5px;color:var(--caption);border-top:1px solid var(--divider);padding-top:26px;}

/* ---- article ---- */
.art{padding:48px 0 56px;}
.art .standfirst{font-family:'Newsreader',serif;font-style:italic;font-size:19px;line-height:1.4;color:var(--stand);margin-bottom:26px;max-width:56ch;}
.byline{display:flex;align-items:center;gap:12px;margin-bottom:30px;padding-bottom:26px;border-bottom:1px solid var(--divider);}
.byline .av{width:38px;height:38px;border-radius:50%;background:var(--oxblood);color:var(--paper);display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;font-size:14px;font-weight:500;}
.byline .t{font-family:Georgia,serif;font-size:13px;color:var(--stand);line-height:1.4;}
.byline .t .n{color:var(--ink-deep);}
.prose{font-family:'Newsreader',serif;font-size:17.5px;line-height:1.68;color:var(--ink);}
.prose p{margin-bottom:20px;}
.prose h2{font-family:'Newsreader',serif;font-weight:500;font-size:25px;line-height:1.2;color:var(--ink-deep);margin:38px 0 16px;}
.prose a{color:var(--oxblood);text-decoration:underline;text-underline-offset:2px;}
.pq{font-family:'Newsreader',serif;font-style:italic;font-size:21px;line-height:1.42;color:var(--ink-deep);padding:8px 0 8px 22px;border-left:3px solid var(--oxblood);margin:30px 0;max-width:52ch;}

/* ---- footer ---- */
.foot{border-top:1px solid var(--divider);background:var(--surface);margin-top:40px;}
.foot-in{padding:26px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.foot .l{font-family:'Newsreader',serif;font-weight:500;font-size:16px;color:var(--ink-deep);}
.foot .l .jm{color:var(--oxblood);}
.foot .r{font-family:Georgia,serif;font-size:12.5px;color:var(--stand);}

@media(max-width:600px){
  .container{padding-left:22px;padding-right:22px;}
  .hero-home h1{font-size:33px;}
  .phead h1{font-size:31px;}
  .nav-in{padding:18px 0;}
  .navlinks{gap:18px;}
}

/* Back to top */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.backtotop{text-align:center;padding:8px 0 44px}
.backtotop a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #D9CEBC;border-radius:50%;color:#7A1E2B;text-decoration:none;font-size:20px;line-height:1;transition:border-color .15s}
.backtotop a:hover{border-color:#7A1E2B}

/* Read next */
.readnext{border-top:1px solid #D9CEBC;margin-top:28px;padding:26px 0 2px}
.readnext .kicker{margin-bottom:10px}
.readnext .rn,
.readnext .rn:link,
.readnext .rn:visited,
.readnext .rn:hover,
.readnext .rn:active{font-size:21px;color:#7A1E2B;text-decoration:underline;text-underline-offset:3px}