/* ============================================================
   JKM soft-editorial system — Master Beauty Photography
   Scope: body.jkm-style  (blog listing page 4338 + single posts)
   Selectors verified in-browser against Jupiter + mk_blog.

   LANDMARKS (hard-won, don't re-guess):
     #theme-page-bg.master-holder-bg = the white page backdrop
     .mk-blog-meta        = CONTAINER (meta + title + excerpt + btn)
     .mk-blog-meta-wrapper = the actual meta line
     .mkhb-*              = Jupiter Header Builder rows
     .mk-header-toolbar   = top contact/date strip
   ============================================================ */

body.jkm-style{
  --paper:#E8E0D4; --well:#DBCEBC; --hl:#FFFCF6; --shade:#C6B8A2;
  --ink:#29241C; --ink2:#4A4236; --bodyc:#6B6152; --muted:#867A68;
  --mono:#A2957F; --faint:#BEB2A0; --sep:#CFC4B1; --terra:#BE6E50;
  --raised:8px 8px 20px rgba(198,184,162,.6),-8px -8px 20px rgba(255,252,246,.92);
  --raised-sm:5px 5px 12px rgba(198,184,162,.55),-5px -5px 12px rgba(255,252,246,.9);
  --inset:inset 4px 4px 9px rgba(198,184,162,.55),inset -4px -4px 9px rgba(255,252,246,.9);
  background:var(--paper) !important;
  color:var(--bodyc) !important;
  font-family:'Geist',sans-serif !important;
}

/* ---------- Canvas: every structural surface = paper ---------- */
html,
body.jkm-style #theme-page-bg,
body.jkm-style .master-holder-bg,
body.jkm-style #mk-boxed-layout,
body.jkm-style .mk-main-wrapper,
body.jkm-style .mk-main-wrapper-holder,
body.jkm-style #mk-page-introduce,
body.jkm-style .mk-header,
body.jkm-style .mk-header-bg,
body.jkm-style [class*="mkhb"],
body.jkm-style [class*="mk-header"],
body.jkm-style #mk-header,
body.jkm-style #mk-nav-holder,
body.jkm-style #mk-footer,
body.jkm-style #sub-footer{
  background:#E8E0D4 !important;
  background-color:#E8E0D4 !important;
  background-image:none !important;
  box-shadow:none !important;
  border-color:rgba(41,36,28,.08) !important;
}

/* Content wrappers stay transparent so the canvas shows */
body.jkm-style #theme-page,
body.jkm-style .theme-page-wrapper,
body.jkm-style .theme-content,
body.jkm-style .mk-padding-wrapper,
body.jkm-style .mk-grid,
body.jkm-style .mk-blog-container,
body.jkm-style .mk-blog-wrapper,
body.jkm-style .blog-holder,
body.jkm-style .mk-isotope,
body.jkm-style .vc_row,
body.jkm-style .vc_row-fluid,
body.jkm-style .vc_column_container,
body.jkm-style .vc_column-inner,
body.jkm-style .wpb_column,
body.jkm-style .wpb_wrapper,
body.jkm-style .entry-content,
body.jkm-style main,
body.jkm-style section{
  background:transparent !important;
  background-color:transparent !important;
  box-shadow:none !important;
}

/* Hide the top contact/date strip */
body.jkm-style .mk-header-toolbar{display:none !important;}

/* ---------- Typography ---------- */
body.jkm-style h1,
body.jkm-style h2,
body.jkm-style h3,
body.jkm-style h4,
body.jkm-style h5,
body.jkm-style h1 a, body.jkm-style h2 a,
body.jkm-style h3 a, body.jkm-style h4 a{
  font-family:'Archivo',sans-serif !important;
  font-weight:500 !important;
  color:var(--ink) !important;
  letter-spacing:-0.026em !important;
  line-height:1.1 !important;
  text-transform:none !important;
}
body.jkm-style h1{font-size:clamp(32px,4.2vw,50px) !important;margin:0 0 28px !important;}
body.jkm-style h2{font-size:clamp(26px,3.2vw,38px) !important;margin:0 0 24px !important;}
body.jkm-style h3{font-size:clamp(20px,2.2vw,27px) !important;margin:0 0 18px !important;}
body.jkm-style h4{font-size:19px !important;font-weight:700 !important;margin:0 0 14px !important;}

body.jkm-style p,
body.jkm-style li,
body.jkm-style .the-excerpt,
body.jkm-style .the-excerpt p{
  font-family:'Geist',sans-serif !important;
  font-size:17px !important;
  line-height:1.62 !important;
  color:var(--bodyc) !important;
  letter-spacing:normal !important;
  text-transform:none !important;
}
body.jkm-style a{text-decoration:none !important;transition:color .2s ease;}
body.jkm-style a:hover{color:var(--terra) !important;}

/* The accent clause (injected by JS) */
body.jkm-style .jkm-serif{
  font-family:'Instrument Serif',serif !important;
  font-style:italic !important;
  font-weight:400 !important;
  letter-spacing:-0.01em !important;
  color:inherit !important;
}

/* ---------- Mono labels ---------- */
body.jkm-style .mk-blog-meta-wrapper,
body.jkm-style .mk-blog-meta-wrapper a,
body.jkm-style .mk-blog-meta-wrapper span,
body.jkm-style .mk-blog-meta-wrapper time,
body.jkm-style .blog-meta-item,
body.jkm-style .mk-blog-author,
body.jkm-style .mk-categories,
body.jkm-style .blog-single-meta,
body.jkm-style .blog-single-meta a,
body.jkm-style .blog-single-meta span,
body.jkm-style .single-post-tags,
body.jkm-style .single-post-tags a{
  font-family:'Geist Mono',monospace !important;
  font-size:10.5px !important;
  line-height:1.7 !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
  font-style:normal !important;
  color:var(--mono) !important;
}
body.jkm-style .mk-blog-meta-wrapper{margin-bottom:24px !important;}

/* ---------- LISTING: post cards ---------- */
body.jkm-style article.mk-blog-modern-item,
body.jkm-style article.mk-blog-classic-item,
body.jkm-style article.mk-isotop-item{
  background:var(--paper) !important;
  border:none !important;
  border-radius:36px !important;
  box-shadow:var(--raised) !important;
  padding:44px 46px 48px !important;
  margin-bottom:64px !important;
  /* out of Isotope's absolute positions (single column) */
  position:relative !important;
  left:auto !important; top:auto !important; right:auto !important;
  transform:none !important; float:none !important;
  width:100% !important; max-width:100% !important;
  margin-left:0 !important; margin-right:0 !important;
  box-sizing:border-box !important; display:block !important;
}
body.jkm-style .mk-isotope,
body.jkm-style .mk-blog-container,
body.jkm-style .blog-holder{
  position:static !important; height:auto !important; min-height:0 !important;
}

/* .mk-blog-meta is a CONTAINER — must not inherit mono/uppercase */
body.jkm-style .mk-blog-meta{
  background:transparent !important;
  font-family:'Geist',sans-serif !important;
  font-size:17px !important;
  letter-spacing:normal !important;
  text-transform:none !important;
  font-style:normal !important;
  color:var(--bodyc) !important;
}
body.jkm-style h3.the-title,
body.jkm-style .the-title,
body.jkm-style .the-title a{
  font-family:'Archivo',sans-serif !important;
  font-weight:500 !important;
  font-size:clamp(22px,2.4vw,30px) !important;
  line-height:1.14 !important;
  letter-spacing:-0.026em !important;
  color:var(--ink) !important;
  margin:0 0 24px !important;
}
body.jkm-style .the-excerpt{margin:0 0 36px !important;}
body.jkm-style .blog-modern-social-section{
  background:transparent !important;
  border-color:rgba(41,36,28,.08) !important;
  padding-top:8px !important;
}
body.jkm-style .blog-modern-social-section a,
body.jkm-style .blog-modern-social-section span{
  font-family:'Geist Mono',monospace !important;
  font-size:10px !important;
  color:var(--mono) !important;
}

/* ---------- SINGLE POST ---------- */
body.jkm-style article.mk-blog-single{
  background:var(--paper) !important;
  border:none !important;
  border-radius:36px !important;
  box-shadow:var(--raised) !important;
  padding:44px 46px 48px !important;
  margin-bottom:56px !important;
  box-sizing:border-box !important;
}
body.jkm-style h2.blog-single-title{
  font-family:'Archivo',sans-serif !important;
  font-weight:500 !important;
  font-size:clamp(28px,3.4vw,42px) !important;
  line-height:1.1 !important;
  letter-spacing:-0.028em !important;
  color:var(--ink) !important;
  margin:32px 0 20px !important;
}
body.jkm-style .blog-single-meta{margin-bottom:28px !important;}
body.jkm-style .mk-single-content{
  font-family:'Geist',sans-serif !important;
  font-size:17px !important;
  line-height:1.68 !important;
  color:var(--bodyc) !important;
}
body.jkm-style .mk-single-content p{margin:0 0 22px !important;}
body.jkm-style .mk-single-content img{border-radius:20px !important;}
body.jkm-style .mk-single-content a{color:var(--terra) !important;}
body.jkm-style .mk-single-content blockquote{
  font-family:'Instrument Serif',serif !important;
  font-style:italic !important;
  font-size:24px !important;
  line-height:1.4 !important;
  color:var(--terra) !important;
  border:none !important;
  padding:8px 0 8px 26px !important;
  border-left:2px solid var(--sep) !important;
}

/* Author box, related posts, comments — raised paper cards */
body.jkm-style .mk-about-author-wrapper,
body.jkm-style .blog-similar-posts,
body.jkm-style .comment-content,
body.jkm-style #comments .commentlist > li{
  background:var(--paper) !important;
  border:none !important;
  border-radius:26px !important;
  box-shadow:var(--raised-sm) !important;
  padding:26px !important;
  margin-bottom:22px !important;
}
body.jkm-style .single-post-tags{margin:26px 0 !important;}

/* Page title bar / breadcrumbs */
body.jkm-style #mk-page-introduce,
body.jkm-style .mk-page-title-box{
  background:var(--paper) !important;
  border-color:rgba(41,36,28,.08) !important;
}
body.jkm-style h1.page-title{
  font-family:'Archivo',sans-serif !important;
  font-weight:500 !important;
  text-transform:none !important;
  letter-spacing:-0.026em !important;
  color:var(--ink) !important;
}
body.jkm-style .mk-breadcrumbs,
body.jkm-style .mk-breadcrumbs a,
body.jkm-style .mk-breadcrumbs span{
  font-family:'Geist Mono',monospace !important;
  font-size:10px !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
  color:var(--mono) !important;
}

/* ---------- Featured media — 16:9, crop to fill ---------- */
body.jkm-style .featured-image{
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  border-radius:26px !important;
  box-shadow:var(--raised) !important;
  margin-bottom:36px !important;
}
body.jkm-style .featured-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
  max-width:none !important;
  border-radius:26px !important;
  background-color:var(--well) !important;
}
@supports not (aspect-ratio: 16 / 9){
  body.jkm-style .featured-image{position:relative !important;height:0 !important;padding-bottom:56.25% !important;}
  body.jkm-style .featured-image img{position:absolute !important;inset:0 !important;}
}

/* ---------- Controls ---------- */
body.jkm-style .mk-button,
body.jkm-style a.mk-button,
body.jkm-style button,
body.jkm-style input[type="submit"]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:48px !important;
  padding:0 30px !important;
  border:none !important;
  border-radius:999px !important;
  background:var(--paper) !important;
  background-image:none !important;
  color:var(--ink) !important;
  font-family:'Geist Mono',monospace !important;
  font-size:11px !important;
  font-weight:400 !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
  box-shadow:var(--raised-sm) !important;
  transition:box-shadow .22s ease,transform .22s ease,color .2s ease;
  cursor:pointer;
}
body.jkm-style .mk-button *{color:var(--ink) !important;background:transparent !important;}
body.jkm-style .mk-button:hover,
body.jkm-style button:hover,
body.jkm-style input[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:9px 9px 18px rgba(198,184,162,.7),-9px -9px 18px rgba(255,252,246,.95) !important;
}
body.jkm-style .mk-button:active,
body.jkm-style button:active{
  transform:translateY(0);
  box-shadow:inset 5px 5px 11px rgba(198,184,162,.65),inset -5px -5px 11px rgba(255,252,246,.9) !important;
}

/* Form fields = inset wells */
body.jkm-style input[type="text"],
body.jkm-style input[type="email"],
body.jkm-style input[type="url"],
body.jkm-style input[type="search"],
body.jkm-style input[type="password"],
body.jkm-style textarea{
  background:var(--paper) !important;
  border:none !important;
  border-radius:18px !important;
  padding:14px 20px !important;
  font-family:'Geist',sans-serif !important;
  font-size:16px !important;
  color:var(--ink) !important;
  box-shadow:var(--inset) !important;
  outline:none !important;
}

/* ---------- Sidebar + footer widgets ---------- */
body.jkm-style .widget{
  background:var(--paper) !important;
  border:none !important;
  border-radius:26px !important;
  padding:28px !important;
  margin-bottom:32px !important;
  box-shadow:var(--raised) !important;
}
body.jkm-style .widgettitle,
body.jkm-style .widget-title{
  font-family:'Geist Mono',monospace !important;
  font-size:10.5px !important;
  font-weight:400 !important;
  letter-spacing:0.16em !important;
  text-transform:uppercase !important;
  color:var(--mono) !important;
  margin-bottom:18px !important;
}
body.jkm-style .widget li{
  font-family:'Geist',sans-serif !important;
  font-size:14px !important;
  padding:9px 0 !important;
  line-height:1.45 !important;
  border-color:rgba(41,36,28,.08) !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}

/* WooCommerce product widget: <img> and title share one <a> */
body.jkm-style .product_list_widget li{display:block !important;padding:12px 0 !important;text-align:left !important;}
body.jkm-style .product_list_widget li a{
  display:flex !important; align-items:center !important; gap:10px !important;
  margin-bottom:6px !important; font-size:12.5px !important; line-height:1.35 !important;
  color:var(--ink2) !important;
}
body.jkm-style .product_list_widget li img{
  float:none !important; flex:0 0 48px !important; width:48px !important; height:auto !important;
  margin:0 !important; border-radius:10px !important;
  box-shadow:3px 3px 7px rgba(198,184,162,.5),-3px -3px 7px rgba(255,252,246,.85) !important;
}
body.jkm-style .product_list_widget li .amount,
body.jkm-style .product_list_widget li ins,
body.jkm-style .product_list_widget li del{
  display:inline-block !important; margin-left:58px !important;
  font-family:'Geist Mono',monospace !important; font-size:11px !important; color:var(--muted) !important;
}

/* Footer: drop Categories, widen the two columns beside it */
body.jkm-style #mk-footer .widget{padding:22px !important;}
body.jkm-style #mk-footer .mk-col-1-3:has(#categories-3),
body.jkm-style #mk-footer .widget_categories{display:none !important;}
body.jkm-style #mk-footer .mk-col-2-3 > .mk-col-1-3{width:50% !important;}

/* ---------- Pagination ---------- */
body.jkm-style .mk-pagination a,
body.jkm-style .page-numbers{
  border-radius:999px !important;
  background:var(--paper) !important;
  border:none !important;
  color:var(--ink2) !important;
  font-family:'Geist Mono',monospace !important;
  font-size:11px !important;
  box-shadow:var(--raised-sm) !important;
  min-width:42px; height:42px;
  display:inline-flex !important;
  align-items:center; justify-content:center;
  margin:0 5px !important;
}
body.jkm-style .page-numbers.current{box-shadow:var(--inset) !important;color:var(--ink) !important;}
body.jkm-style .mk-pagination{margin-top:52px !important;padding:16px 0 40px !important;}
body.jkm-style .mk-total-pages{
  position:static !important; float:none !important; display:block !important;
  margin-top:18px !important;
  font-family:'Geist Mono',monospace !important; font-size:10.5px !important;
  letter-spacing:0.14em !important; text-transform:uppercase !important; color:var(--mono) !important;
}

/* ---------- Rhythm ----------
   32px top pad: the raised shadow is -8px offset + 20px blur, so the
   card needs ~28px clearance or its own glow gets clipped. */
body.jkm-style #theme-page,
body.jkm-style .theme-page-wrapper{
  padding-top:32px !important;
  padding-bottom:80px !important;
}
body.jkm-style hr{border-color:rgba(41,36,28,.08) !important;}

/* ---------- ADMIN BAR: hands off ----------
   The button/input rules above also match WP's admin-bar search node
   and paint floating pills over the black strip. Reset ONLY inputs and
   buttons — a blanket "#wpadminbar *" rule kills the Dashicons font. */
#wpadminbar input,
#wpadminbar input[type="search"],
#wpadminbar input[type="text"],
#wpadminbar button{
  background:transparent !important; background-image:none !important;
  border:none !important; border-radius:0 !important; box-shadow:none !important;
  padding:0 4px !important; margin:0 !important;
  min-height:0 !important; height:auto !important; width:auto !important;
  display:inline-block !important;
  font-family:inherit !important; font-size:13px !important; font-weight:400 !important;
  letter-spacing:normal !important; text-transform:none !important;
  transform:none !important; color:#c3c4c7 !important;
}

/* ---------- Responsive ---------- */
@media (max-width:880px){
  body.jkm-style article.mk-blog-modern-item,
  body.jkm-style article.mk-blog-classic-item,
  body.jkm-style article.mk-isotop-item,
  body.jkm-style article.mk-blog-single{
    padding:26px 22px 30px !important;
    margin-bottom:40px !important;
    border-radius:26px !important;
  }
  body.jkm-style .featured-image{margin-bottom:24px !important;}
  body.jkm-style #theme-page,
  body.jkm-style .theme-page-wrapper{padding-top:20px !important;padding-bottom:44px !important;}
}

@media (prefers-reduced-motion:reduce){
  body.jkm-style *,
  body.jkm-style *::before,
  body.jkm-style *::after{transition-duration:.001ms !important;animation:none !important;}
}
