/* ============================================================
   JKM refinements — loaded after jkm-style.css
   ============================================================ */

/* ------------------------------------------------------------
   HEADER / NAV (applies on listing + single posts)
   Jupiter top-aligns the menu links: they sat at y=35 while the
   logo centred at y=82. Flex-centre the menu against the full
   header height so the two line up.
   ------------------------------------------------------------ */
body.jkm-style #mk-main-navigation,
body.jkm-style .mk-main-navigation > ul{
  display:flex !important;
  align-items:center !important;
  height:100% !important;
}
body.jkm-style .mk-main-navigation > ul > li{
  display:flex !important;
  align-items:center !important;
}
/* Breathing room on the right of the nav */
body.jkm-style .mk-main-navigation{
  padding-right:27px !important;
}

/* ------------------------------------------------------------
   SINGLE POSTS
   1. Remove the page-title box (duplicate H1 + breadcrumbs).
   2. Halve the navbar -> article gap. It was 114px, stacked from
      four values; each is halved here to land on 57px:
        #theme-page padding-top      32 -> 16
        .theme-page-wrapper margin    20 -> 10
        .theme-page-wrapper padding   32 -> 16
        .theme-content padding        30 -> 15
      31px of that sits directly above the card, so the raised
      shadow (-8px offset + 20px blur) still clears.
      Scoped to .single-post so the listing keeps its own spacing.
   ------------------------------------------------------------ */
body.jkm-style.single-post #mk-page-introduce{
  display:none !important;
}
body.jkm-style.single-post #theme-page{
  padding-top:16px !important;
}
body.jkm-style.single-post .theme-page-wrapper{
  margin-top:10px !important;
  padding-top:16px !important;
}
body.jkm-style.single-post .theme-content{
  padding-top:15px !important;
}

/* ------------------------------------------------------------
   LINK COLOURS
   Terracotta is for BODY-COPY links only. Do NOT use a blanket
   "#theme-page a" rule — that ID selector outranks the headline
   rules and turns every post title terracotta.
   ------------------------------------------------------------ */
body.jkm-style .mk-single-content a,
body.jkm-style .textwidget a,
body.jkm-style .widget_text a,
body.jkm-style .widget_block a,
body.jkm-style .mk-about-author-wrapper a,
body.jkm-style .comment-content a{
  color:#BE6E50 !important;
}
body.jkm-style .mk-single-content a:hover,
body.jkm-style .textwidget a:hover,
body.jkm-style .widget_block a:hover,
body.jkm-style .comment-content a:hover{
  color:#29241C !important;
}

/* Headlines: ink at rest, terracotta on hover. */
body.jkm-style #theme-page h3.the-title,
body.jkm-style #theme-page h3.the-title a,
body.jkm-style #theme-page .the-title a,
body.jkm-style #theme-page h2.blog-single-title,
body.jkm-style #theme-page .blog-similar-posts h4 a,
body.jkm-style .the-title a,
body.jkm-style h2.blog-single-title{
  color:#29241C !important;
}
body.jkm-style #theme-page h3.the-title a:hover,
body.jkm-style #theme-page .the-title a:hover,
body.jkm-style #theme-page .blog-similar-posts h4 a:hover,
body.jkm-style .the-title a:hover{
  color:#BE6E50 !important;
}

body.jkm-style .the-title .jkm-serif,
body.jkm-style h2.blog-single-title .jkm-serif{
  color:inherit !important;
}

/* Meta lines stay mono/muted */
body.jkm-style #theme-page .mk-blog-meta-wrapper a,
body.jkm-style #theme-page .blog-single-meta a,
body.jkm-style #theme-page .single-post-tags a,
body.jkm-style .mk-breadcrumbs a{
  color:#A2957F !important;
}
body.jkm-style #theme-page .mk-blog-meta-wrapper a:hover,
body.jkm-style #theme-page .blog-single-meta a:hover{
  color:#BE6E50 !important;
}

/* ------------------------------------------------------------
   LISTING: native image ratio (no crop, no letterbox bands).
   Banners are ~3:1 with edge-to-edge artwork: a centred 16:9 crop
   cuts ~20% off each side; letterboxing leaves 225px of dead space
   in a 545px frame. Native ratio avoids both.
   Single posts keep 16:9 — sources are ~1.63:1, so ~8% crop.
   When banners are re-exported at 1920x1080, delete this block.
   ------------------------------------------------------------ */
body.jkm-style.page-id-4338 .featured-image{
  aspect-ratio:auto !important;
  height:auto !important;
  padding-bottom:0 !important;
}
body.jkm-style.page-id-4338 .featured-image img{
  height:auto !important;
  object-fit:contain !important;
  position:static !important;
}

/* No justified text — it opens rivers in narrow columns */
body.jkm-style .widget,
body.jkm-style .widget p,
body.jkm-style .mk-single-content,
body.jkm-style .mk-single-content p,
body.jkm-style .textwidget,
body.jkm-style .textwidget p{
  text-align:left !important;
}

/* Prev/next post tabs */
body.jkm-style .mk-post-nav{
  background:#E8E0D4 !important;
  background-color:#E8E0D4 !important;
  border:none !important;
  box-shadow:5px 5px 14px rgba(198,184,162,.55) !important;
}
body.jkm-style .mk-post-nav.mk-post-prev{border-radius:0 20px 20px 0 !important;}
body.jkm-style .mk-post-nav.mk-post-next{border-radius:20px 0 0 20px !important;}
body.jkm-style .mk-post-nav i,
body.jkm-style .mk-post-nav .mk-nav-arrow,
body.jkm-style .mk-post-nav a{color:#4A4236 !important;}

/* Testimonial blocks embedded in post content */
body.jkm-style .testimonial-quote,
body.jkm-style .testimonial-holder{
  background:#E8E0D4 !important;
  background-color:#E8E0D4 !important;
  border:none !important;
  border-radius:20px !important;
  box-shadow:inset 4px 4px 9px rgba(198,184,162,.55),inset -4px -4px 9px rgba(255,252,246,.9) !important;
}

/* Comments */
body.jkm-style #comments h3,
body.jkm-style #comments h4,
body.jkm-style .comment-reply-title{
  font-family:'Archivo',sans-serif !important;
  color:#29241C !important;
}
body.jkm-style .comment-author,
body.jkm-style .comment-meta,
body.jkm-style .comment-metadata{
  font-family:'Geist Mono',monospace !important;
  font-size:10.5px !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
  color:#A2957F !important;
}

/* Related posts row */
body.jkm-style .blog-similar-posts img{
  border-radius:20px !important;
  box-shadow:5px 5px 12px rgba(198,184,162,.55),-5px -5px 12px rgba(255,252,246,.9) !important;
}
body.jkm-style .blog-similar-posts h4{
  font-family:'Archivo',sans-serif !important;
  font-weight:500 !important;
}
