/*
Theme Name: Kadence Child
Template: kadence
*/

/* =========================================================
   JAR TEA – STORIES + WINNERS + FB COMMENTS (FINAL)
   - Archive grid + filters
   - Winners grid
   - Single story image safety
   - Facebook-style comments (NO duplicates)
========================================================= */

/* ------------------------------
   Global wrappers
------------------------------ */
.jt-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:16px;
}
.jt-hero{ margin:0 0 26px; }
.jt-hero h1{
  font-size:28px;
  line-height:1.2;
  margin:0 0 6px;
}
.jt-muted{ opacity:.75; margin:0 0 12px; }

/* ------------------------------
   Filters
------------------------------ */
.jt-filters{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.jt-filters input,
.jt-filters select{
  width:100%;
  padding:10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  background:#fff;
}
.jt-btn{
  display:inline-block;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#111;
  color:#fff;
  cursor:pointer;
  text-decoration:none;
  font-weight:700;
}
.jt-btn:hover{ opacity:.92; }

/* ------------------------------
   Stories Grid
------------------------------ */
.jt-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.jt-card{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 25px rgba(0,0,0,.06);
}
.jt-card img{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}
.jt-card-body{ padding:14px; }
.jt-card-body h3{
  margin:0 0 8px;
  font-size:18px;
}
.jt-card-body p{
  margin:0 0 10px;
  opacity:.9;
}

/* ------------------------------
   Single story safety (Kadence)
------------------------------ */
body.single-jt_story .entry-hero,
body.single-jt_story .entry-hero-container,
body.single-jt_story .entry-content-wrap{
  max-width:900px;
  margin:0 auto;
  padding:16px;
}
body.single-jt_story .entry-content img,
body.single-jt_story .entry-content figure img,
body.single-jt_story .entry-hero img{
  max-height:420px !important;
  width:100% !important;
  object-fit:cover !important;
  border-radius:16px !important;
  display:block !important;
}

/* =========================================================
   WINNERS PAGE (Shortcode/Grid)
========================================================= */

/* Make winners page container centered + wide */
body.page-slug-winners .content-container,
body.page-slug-winners .site-container,
body.page-slug-winners .content-wrap,
body.page-slug-winners .entry-content-wrap,
body.page-slug-winners .site-content,
body.page-slug-winners .content-area{
  max-width:1200px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Winners page wrapper */
.jt-winners-page{
  max-width:1200px;
  margin:0 auto;
  padding:28px 16px;
}

/* Hero / top box */
.jt-winners-hero{ margin:0 0 22px; }
.jt-winners-hero-inner{
  background:#fff;
  border-radius:18px;
  padding:22px;
  box-shadow:0 14px 30px rgba(0,0,0,.06);
}
.jt-winners-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#f6c343;
  color:#111;
  font-weight:800;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  margin-bottom:10px;
}
.jt-winners-hero h2{
  margin:0 0 6px;
  font-size:28px;
  line-height:1.2;
}
.jt-winners-btn{
  display:inline-block;
  background:#111;
  color:#fff !important;
  text-decoration:none;
  padding:12px 16px;
  border-radius:14px;
  font-weight:800;
}

/* Winners grid */
.jt-winners-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:24px;
  align-items:stretch;
}

/* Header box inside grid (if used) */
.jt-winners-grid .jt-winners-hero,
.jt-winners-grid .jt-winners-header,
.jt-winners-grid .jt-winners-top{
  grid-column:1 / -1;
}

/* Winner Card */
.jt-winner-card{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 14px 30px rgba(0,0,0,.06);
  position:relative;
  transition:transform .25s ease;
}
.jt-winner-card:hover{ transform:translateY(-6px); }

.jt-winner-badge{
  position:absolute;
  top:12px;
  left:12px;
  background:linear-gradient(135deg,#f7b500,#ff8c00);
  color:#111;
  font-weight:800;
  font-size:12px;
  padding:6px 12px;
  border-radius:999px;
  box-shadow:0 6px 15px rgba(0,0,0,.15);
}

.jt-winner-thumb img,
.jt-winner-card img{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}

.jt-winner-body{ padding:16px 16px 18px; }
.jt-winner-title{
  margin:0 0 8px;
  font-size:20px;
  line-height:1.25;
}
.jt-winner-title a{ text-decoration:none; color:inherit; }

.jt-winner-meta{
  font-size:13px;
  opacity:.75;
  margin-bottom:10px;
}

.jt-winner-prize{
  background:#f8f9fb;
  border-left:4px solid #f7b500;
  padding:10px 12px;
  font-size:14px;
  margin:8px 0 10px;
}

.jt-winner-excerpt{
  margin:0 0 14px;
  opacity:.9;
}

.jt-winner-readmore{
  display:inline-block;
  background:#111;
  color:#fff !important;
  text-decoration:none;
  padding:10px 14px;
  border-radius:12px;
  font-weight:800;
}

/* Empty state */
.jt-winners-empty{
  background:#fff;
  border-radius:18px;
  padding:16px;
  box-shadow:0 14px 30px rgba(0,0,0,.06);
}

/* Responsive */
@media (max-width:980px){
  .jt-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .jt-filters{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .jt-winners-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:560px){
  .jt-grid{ grid-template-columns:1fr; }
  .jt-filters{ grid-template-columns:1fr; }
  .jt-card img{ height:190px; }
  .jt-winner-thumb img,
  .jt-winner-card img{ height:180px; }
  .jt-winners-grid{ grid-template-columns:1fr; }
}

/* =========================================================
   FACEBOOK-STYLE COMMENTS (FINAL, NO DUPLICATES)
   Works on single story/post pages
========================================================= */

/* Remove numbering (1. 2.) */
ol.comment-list,
.commentlist,
.comment-list{
  list-style:none !important;
  padding-left:0 !important;
  margin-left:0 !important;
}
ol.comment-list > li,
.commentlist > li,
.comment-list > li,
li.comment{
  list-style:none !important;
}
ol.comment-list > li::before,
.commentlist > li::before,
.comment-list > li::before,
li.comment::before{
  content:none !important;
  display:none !important;
}

/* Hide ALL default WP meta + reply/edit blocks (we show only custom UI) */
.comment-meta,
.comment-metadata,
.comment-footer,
.reply{
  display:none !important;
}
.comment-reply-link,
.comment-edit-link{
  display:none !important;
}

/* Comment card look */
.comment-body{
  display:flex !important;
  gap:12px !important;
  align-items:flex-start !important;
  background:#fff !important;
  border-radius:14px !important;
  padding:14px !important;
  box-shadow:0 10px 30px rgba(0,0,0,.06) !important;
  margin:14px 0 !important;
  position:relative !important;
}

/* Avatar */
.comment-author .avatar,
.comment-author img{
  width:44px !important;
  height:44px !important;
  border-radius:999px !important;
  object-fit:cover !important;
  background:#e9eef6 !important;
}

/* Keep "John says:" in one line (no break) */
.comment-author,
.comment-author .fn,
.comment-author .says{
  display:inline !important;
  white-space:nowrap !important;
  line-height:1.2 !important;
}
.comment-author .says{
  margin-left:6px !important;
  font-weight:700 !important;
  opacity:.75 !important;
}

/* Text */
.comment-content{
  margin-top:6px !important;
  line-height:1.65 !important;
}

/* Replies indentation like FB thread */
.comment-list .children,
.commentlist .children{
  margin-top:12px !important;
  margin-left:24px !important;
  padding-left:14px !important;
  border-left:2px solid #e6ebf2 !important;
}

/* Admin / bypostauthor highlight (single clean line) */
.bypostauthor .comment-body{
  border-left:4px solid #0b5cff !important;
  padding-left:12px !important;
  border-top-left-radius:14px !important;
  border-bottom-left-radius:14px !important;
}

/* Your custom action row (ONLY ONE) */
.jt-comment-actions{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  margin-top:10px !important;
}

/* Action buttons pill */
.jt-comment-actions a,
.jt-comment-actions button,
.jt-comment-actions .jt-act{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  height:auto !important;
  padding:6px 12px !important;
  border-radius:999px !important;
  border:1px solid rgba(0,0,0,.08) !important;
  background:#f6f8fb !important;
  font-size:13px !important;
  line-height:1 !important;
  text-decoration:none !important;
  cursor:pointer !important;
}
.jt-comment-actions a:hover,
.jt-comment-actions button:hover,
.jt-comment-actions .jt-act:hover{
  background:#eef3ff !important;
}

/* Like state */
.jt-comment-actions .jt-like{
  background:#eef3ff !important;
  border-color:rgba(0, 102, 255, 0.15) !important;
  min-width:72px !important;
  box-shadow:none !important;
}
.jt-comment-actions .jt-like.jt-liked{
  background:#dbe9ff !important;
  color:#0b5cff !important;
}
.jt-comment-actions .jt-like .jt-like-count{
  font-weight:800 !important;
  min-width:18px !important;
  text-align:center !important;
}

/* Prevent any duplicate custom action row if printed twice */
.jt-comment-actions + .jt-comment-actions{
  display:none !important;
}

/* Mobile adjustments */
@media (max-width:640px){
  .comment-body{ gap:10px !important; }
  .comment-author,
  .comment-author .fn,
  .comment-author .says{ white-space:normal !important; }
  .jt-comment-actions{ gap:6px !important; }
}
/* =========================================================
   JAR TEA – COMMENTS FIX PACK (PASTE AT END)
   Fix: big grey avatar/placeholder + duplicate action rows
========================================================= */

/* 1) Kill the BIG grey blocks (avatar/placeholder stretching) */
.comment-body .comment-author,
.comment-body .vcard{
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 56px !important;
}

.comment-body img.avatar,
.comment-body .avatar{
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  display: block !important;
}

/* Some themes/plugins render avatar as a DIV with background */
.comment-body .avatar{
  background-size: cover !important;
  background-position: center !important;
  overflow: hidden !important;
}

/* If any placeholder block exists, force it small */
.comment-body .comment-author::before,
.comment-body .vcard::before{
  content: none !important;
  display: none !important;
}

/* 2) Hide date/meta line (your screenshot still shows it) */
.comment-metadata,
.comment-meta,
.comment-meta a,
.commentmetadata,
.comment-meta-item{
  display: none !important;
}

/* 3) Show ONLY ONE action row (hide duplicates safely) */
.comment-body .jt-comment-actions{
  display: none !important;         /* hide all first */
}
.comment-body .jt-comment-actions:first-of-type{
  display: flex !important;         /* show only first one */
}

/* 4) If Reply button appears outside your action row, hide it */
.comment-body .reply,
.comment-body .comment-reply-link,
.comment-body .comment-edit-link{
  display: none !important;
}

/* 5) Make sure comment layout stays clean */
.comment-body{
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}
/* =========================================================
   FINAL OVERRIDE FIX (PASTE AT VERY END of style.css)
   Fix: BIG GREY AVATAR PLACEHOLDER + DUPLICATE ACTION ROW
========================================================= */

/* Target Kadence/WP comment area strongly */
.comments-area,
#comments,
.comment-respond,
.comment-list,
.commentlist{
  overflow: visible !important;
}

/* 1) HARD LIMIT: any avatar/placeholder inside comments */
.comments-area .avatar,
#comments .avatar,
.comment-list .avatar,
.commentlist .avatar,
.comments-area img.avatar,
#comments img.avatar,
.comment-list img.avatar,
.commentlist img.avatar,
.comments-area .comment-author .avatar,
#comments .comment-author .avatar,
.comments-area .comment-author img,
#comments .comment-author img{
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  display: block !important;
  float: none !important;
}

/* If avatar is a DIV with background/SVG */
.comments-area .avatar{
  background-size: cover !important;
  background-position: center !important;
  overflow: hidden !important;
}

/* Some plugins render huge SVG inside avatar box */
.comments-area .avatar svg,
#comments .avatar svg,
.comment-list .avatar svg{
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  margin: 11px auto !important; /* center inside 44px */
}

/* 2) STOP the avatar wrapper from becoming a big rectangle */
.comments-area .comment-author,
#comments .comment-author,
.comments-area .vcard,
#comments .vcard{
  width: auto !important;
  max-width: 56px !important;
  flex: 0 0 56px !important;
  display: block !important;
}

/* 3) Clean comment layout (avatar left, content right) */
.comments-area .comment-body,
#comments .comment-body{
  display: flex !important;
  gap: 12px !important;
  align-items: flex-start !important;
}

/* Content area takes remaining space */
.comments-area .comment-body .comment-content,
#comments .comment-body .comment-content{
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
}

/* 4) Remove numbering "1. 2." */
ol.comment-list,
.commentlist,
.comment-list{
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
ol.comment-list > li,
.commentlist > li,
.comment-list > li,
li.comment{
  list-style: none !important;
}
ol.comment-list > li::before,
.commentlist > li::before,
.comment-list > li::before,
li.comment::before{
  content: none !important;
  display: none !important;
}

/* 5) Hide WP default meta/reply blocks (so only your UI remains) */
.comments-area .comment-metadata,
.comments-area .comment-meta,
.comments-area .comment-meta a,
.comments-area .reply,
#comments .comment-metadata,
#comments .comment-meta,
#comments .reply{
  display: none !important;
}

/* 6) If your custom buttons appear twice: keep ONLY FIRST row */
.comment-body .jt-comment-actions{
  display: none !important;
}
.comment-body .jt-comment-actions:first-of-type{
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

/* If two action rows are adjacent, hide the second */
.jt-comment-actions + .jt-comment-actions{
  display: none !important;
}

/* 7) Replies indentation (clean) */
.comment-list .children,
.commentlist .children{
  margin-left: 22px !important;
  padding-left: 14px !important;
  border-left: 2px solid rgba(0,0,0,.08) !important;
}

/* 8) Admin highlight (single clean line) */
.bypostauthor .comment-body{
  border-left: 4px solid #0b5cff !important;
  padding-left: 12px !important;
  border-top-left-radius: 14px !important;
  border-bottom-left-radius: 14px !important;
}
/*
Theme Name: Kadence Child
Template: kadence
*/

/* ==================================================
   GLOBAL RESET FOR WP COMMENTS (KADENCE SAFE)
================================================== */

#comments,
.comment-list,
.commentlist,
.comment {
  background: transparent !important;
  box-shadow: none !important;
}

.comment-list,
.commentlist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.comment,
.comment-body,
.comment-content,
.comment-meta {
  background: none !important;
  box-shadow: none !important;
}

/* REMOVE NUMBERING COMPLETELY */
.comment-list li::before,
.commentlist li::before {
  content: none !important;
  display: none !important;
}

/* ==================================================
   FACEBOOK STYLE COMMENT CARD
================================================== */

.comment-body {
  display: flex !important;
  gap: 14px !important;
  align-items: flex-start !important;
  background: #ffffff !important;
  padding: 16px !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.06) !important;
  margin-bottom: 18px !important;
}

/* AVATAR – FIX GREY BLOCK ISSUE */
.comment-author img.avatar {
  width: 48px !important;
  height: 48px !important;
  max-width: 48px !important;
  max-height: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  background: #e5e7eb !important;
  display: block !important;
}

/* REMOVE ANY THEME BACKGROUND ON AVATAR WRAPPER */
.comment-author {
  background: none !important;
}

/* ==================================================
   AUTHOR + TEXT
================================================== */

.comment-content {
  flex: 1 !important;
  padding: 0 !important;
}

.comment-author .fn {
  font-weight: 700 !important;
  color: #0a2540 !important;
}

.comment-author .says {
  margin-left: 6px !important;
  opacity: .7 !important;
}

.comment-text {
  margin: 6px 0 10px !important;
}

/* DATE */
.comment-metadata {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin-top: 6px !important;
}

/* ==================================================
   ACTION BUTTONS (LIKE FACEBOOK)
================================================== */

.comment-actions {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: 10px !important;
}

.comment-actions a,
.comment-actions button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: #f2f4f7 !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  font-size: 13px !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.comment-actions a:hover {
  background: #e8f0ff !important;
}

/* ==================================================
   ADMIN / OFFICIAL REPLY
================================================== */

.bypostauthor .comment-body {
  border-left: 4px solid #0b5cff !important;
  padding-left: 12px !important;
}

/* ==================================================
   REPLIES (THREAD STYLE)
================================================== */

.comment-list .children {
  margin-left: 28px !important;
  padding-left: 14px !important;
  border-left: 2px solid #e6ebf2 !important;
}

/* ==================================================
   REMOVE DUPLICATE DEFAULT WP ELEMENTS
================================================== */

.reply,
.comment-reply-link {
  display: none !important;
}

/* ==================================================
   MOBILE FIX
================================================== */

@media (max-width: 640px) {
  .comment-body {
    padding: 14px !important;
  }
}
/* =========================================
   FIX: DUPLICATE ACTION BUTTON ROW (KEEP ONE)
   ========================================= */

/* If the buttons are printed twice, hide the 2nd one */
.comment-body .comment-actions + .comment-actions{
  display:none !important;
}

/* If you are still using the older class from previous version */
.comment-body .jt-comment-actions + .jt-comment-actions{
  display:none !important;
}

/* Sometimes one row is inside .reply or .comment-meta area */
.comment-body .reply .comment-actions,
.comment-body .comment-meta .comment-actions,
.comment-body .comment-metadata ~ .comment-actions{
  display:none !important;
}

/* Hide any leftover default WP "Reply" row (Kadence sometimes prints twice) */
.comment-body .reply,
.comment-body .comment-reply-link{
  display:none !important;
}

/* =========================================
   HARD FIX: keep only ONE action row per comment
   (hide all, show last)
   ========================================= */

/* Common containers */
.comment-body,
.comment-content,
.commentmetadata,
.comment-metadata{
  position: relative;
}

/* 1) Hide ALL action rows (both possible class names) */
.comment-body .jt-comment-actions,
.comment-body .comment-actions{
  display: none !important;
}

/* 2) Show ONLY the LAST action row inside each comment */
.comment-body .jt-comment-actions:last-of-type,
.comment-body .comment-actions:last-of-type{
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

/* 3) If actions appear inside comment text area, always hide those */
.comment-body .comment-content .jt-comment-actions,
.comment-body .comment-content .comment-actions,
.comment-body .comment-text .jt-comment-actions,
.comment-body .comment-text .comment-actions,
.comment-body .comment-content p .jt-comment-actions,
.comment-body .comment-content p .comment-actions{
  display: none !important;
}

/* 4) Hide default WP reply link row (often causes duplicates) */
.comment-body .reply,
.comment-body .comment-reply-link{
  display: none !important;
}
/* Submit Story page */
.jt-submit-wrap{max-width:900px;margin:0 auto;padding:18px}
.jt-submit-hero h1{margin:0 0 6px;font-size:30px}
.jt-submit-form{background:#fff;border-radius:16px;padding:16px;box-shadow:0 10px 25px rgba(0,0,0,.06)}
.jt-submit-form label{display:block;margin:12px 0 6px;font-weight:700}
.jt-submit-form input,.jt-submit-form select,.jt-submit-form textarea{
  width:100%;padding:10px;border:1px solid rgba(0,0,0,.12);border-radius:12px;background:#fff
}
.jt-submit-success{background:#e9fff0;border:1px solid rgba(0,0,0,.08);padding:14px;border-radius:14px;margin:12px 0}
.jt-submit-small{opacity:.8;margin-top:10px}
.jt-hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
/* Floating Submit Button */
.jt-float-submit{
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99999;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg,#0b5cff,#0033aa);
  color: #fff !important;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 16px 40px rgba(0,0,0,.25);
}

.jt-float-submit:hover{
  transform: translateY(-1px);
  opacity: .96;
}

@media (max-width: 640px){
  .jt-float-submit{
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: calc(100% - 24px);
    justify-content: center;
  }
}
/* Homepage Latest Stories Section */
.jt-home-stories{
  padding: 34px 0;
}
.jt-home-stories-wrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}
.jt-home-stories-head{
  display:flex;
  gap:16px;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-bottom: 16px;
}
.jt-home-stories-head h2{
  margin:0 0 6px;
  font-size: 28px;
}
.jt-home-stories-head p{
  margin:0;
  opacity:.85;
}
.jt-home-stories-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.jt-home-primary{
  background: linear-gradient(135deg,#0b5cff,#0033aa);
  color:#fff !important;
  text-decoration:none;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  box-shadow: 0 14px 30px rgba(0,0,0,.18);
}
.jt-home-secondary{
  background:#fff;
  color:#111 !important;
  text-decoration:none;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  border:1px solid rgba(0,0,0,.12);
}
.jt-home-stories-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
.jt-home-story-card{
  background:#fff;
  border-radius: 16px;
  overflow:hidden;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.jt-home-story-thumb img{
  width:100%;
  height: 210px;
  object-fit: cover;
  display:block;
}
.jt-home-story-noimg{
  height:210px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f3f4f6;
  color:#6b7280;
  font-weight:700;
}
.jt-home-story-body{ padding: 14px; }
.jt-home-story-body h3{ margin:0 0 8px; font-size:18px; }
.jt-home-story-body h3 a{ text-decoration:none; color:inherit; }
.jt-home-story-body p{ margin:0 0 10px; opacity:.9; }
.jt-home-read{
  display:inline-block;
  text-decoration:none;
  font-weight:800;
  padding:10px 14px;
  border-radius: 12px;
  background:#111;
  color:#fff !important;
}
.jt-home-story-skeleton{
  height: 320px;
  border-radius: 16px;
  background: linear-gradient(90deg,#f2f4f7, #e9eef6, #f2f4f7);
  background-size: 200% 100%;
  animation: jtShimmer 1.2s infinite linear;
}
@keyframes jtShimmer{
  0%{ background-position: 0% 0; }
  100%{ background-position: 200% 0; }
}

@media (max-width: 980px){
  .jt-home-stories-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px){
  .jt-home-stories-grid{ grid-template-columns: 1fr; }
  .jt-home-story-thumb img, .jt-home-story-noimg{ height: 180px; }
}