/*
Theme Name: HK Rayot Cinematic
Theme URI: https://haifa-krayot.co.il
Author: HK News
Description: Dark cinematic news theme — Haifa & Krayot
Version: 4.3
Text Domain: hkrayot
*/

/* ── Reset (NO direction on body!) ── */
*{box-sizing:border-box;margin:0;padding:0;}

html,body{
  font-family:'Heebo',sans-serif;
  background:#050e1a;
  min-height:100vh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

a{text-decoration:none;color:inherit;}
img{max-width:100%;height:auto;display:block;}
button{font-family:inherit;cursor:pointer;}

/* ── Frame: direction:rtl ONLY here, centered with margin:auto ── */
.frame{
  font-family:'Heebo',sans-serif;
  direction:rtl;
  position:relative;
  min-height:100vh;
  background:#050e1a;
  width:100%;
  max-width:100%;
  margin:0;
}

@keyframes drift2{0%{transform:translate(0,0);}100%{transform:translate(-25px,-30px);}}
@keyframes drift3{0%{transform:translate(0,0) scale(1);}100%{transform:translate(20px,15px) scale(1.15);}}

.skyline{
  position:absolute;bottom:0;left:0;right:0;height:110px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 110' preserveAspectRatio='none'%3E%3Cpath d='M0,110 L0,70 L20,70 L20,55 L35,55 L35,50 L50,50 L50,55 L65,55 L65,40 L70,40 L70,35 L80,35 L80,40 L95,40 L95,55 L110,55 L110,30 L115,30 L115,10 L120,10 L120,30 L125,30 L125,55 L140,55 L140,45 L160,45 L160,55 L175,55 L175,50 L185,50 L185,55 L200,55 L200,35 L205,35 L205,55 L220,55 L220,60 L240,60 L240,45 L255,45 L255,42 L265,42 L265,45 L280,45 L280,60 L300,60 L300,50 L315,50 L315,45 L325,45 L325,50 L340,50 L340,38 L350,38 L350,50 L365,50 L365,55 L380,55 L380,48 L390,48 L390,55 L410,55 L410,65 L430,65 L430,50 L445,50 L445,42 L458,42 L458,38 L465,38 L465,42 L478,42 L478,50 L495,50 L495,55 L510,55 L510,45 L525,45 L525,55 L545,55 L545,60 L560,60 L560,50 L575,50 L575,55 L590,55 L590,65 L610,65 L610,55 L630,55 L630,60 L650,60 L650,65 L680,65 L680,70 L700,70 L700,110 Z' fill='rgba(255,255,255,0.04)'/%3E%3C/svg%3E");
  background-size:100% 100%;
  opacity:0.6;
}

.diag-line{
  position:absolute;top:0;left:20%;width:1px;height:100%;
  background:linear-gradient(to bottom,transparent,rgba(255,140,0,0.12) 40%,transparent);
  transform:skewX(-15deg);
}

/* ── Glass Nav ── */
.glass-nav{
  background:rgba(255,255,255,0.05);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,0.08);
  padding:12px 18px;
  display:flex;align-items:center;gap:14px;
  position:sticky;top:0;z-index:100;
}
/* WP custom logo */
.glass-nav .custom-logo-link{display:flex;align-items:center;flex-shrink:0;}
.glass-nav .custom-logo-link img,.glass-nav .custom-logo{height:34px;width:auto;max-width:160px;object-fit:contain;}
/* Fallback logo pill */
.logo{
  background:linear-gradient(135deg,#ff8c00,#ffa733);
  border-radius:50px;padding:6px 16px;
  font-size:13px;font-weight:700;color:#fff;
  white-space:nowrap;letter-spacing:0.3px;flex-shrink:0;
}
.site-name{font-size:16px;font-weight:700;color:#fff;letter-spacing:-0.5px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* Mobile: hide long site name — logo pill is enough */
@media(max-width:480px){.site-name{display:none;}}
.weather{
  background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.1);
  border-radius:50px;padding:5px 12px;font-size:11px;color:rgba(255,255,255,0.65);
  display:flex;align-items:center;gap:5px;flex-shrink:0;
}
.glass-search{
  margin-right:auto;
  background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);
  border-radius:50px;padding:5px 14px;
  font-size:12px;color:rgba(255,255,255,0.5);
  cursor:pointer;display:flex;align-items:center;gap:6px;
  flex-shrink:0;border:none;transition:background 0.2s;
}
.glass-search:hover{background:rgba(255,255,255,0.13);}

/* ── Search Overlay ── */
.search-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(5,14,26,0.94);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);align-items:flex-start;padding-top:80px;}
.search-overlay.active{display:flex;}
.search-overlay__box{width:100%;max-width:600px;margin:0 auto;padding:0 16px;position:relative;}
.search-overlay__box input[type="search"],.search-overlay__box .search-field{width:100%;background:rgba(255,255,255,0.09);border:1px solid rgba(255,255,255,0.18);border-radius:50px;padding:14px 20px;font-size:16px;color:#fff;font-family:'Heebo',sans-serif;direction:rtl;outline:none;}
.search-overlay__box input::placeholder,.search-overlay__box .search-field::placeholder{color:rgba(255,255,255,0.38);}
.search-overlay__close{position:absolute;left:24px;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,0.55);font-size:20px;}

/* ── Tab Nav ── */
.tab-nav{
  background:rgba(255,255,255,0.03);
  border-bottom:1px solid rgba(255,255,255,0.07);
  padding:0 18px;display:flex;gap:2px;
  position:sticky;top:58px;z-index:90;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.tab-nav::-webkit-scrollbar{display:none;}
/* WP list items */
.tab-nav ul{display:flex;gap:2px;list-style:none;padding:0;margin:0;width:max-content;min-width:100%;}
.tab-nav li a,.tab{
  display:block;padding:9px 13px;font-size:12px;font-family:'Heebo',sans-serif;
  color:rgba(255,255,255,0.45);cursor:pointer;
  border-radius:8px 8px 0 0;transition:all 0.2s;font-weight:400;
  white-space:nowrap;border-bottom:2px solid transparent;
}
.tab-nav li.active a,.tab.active{color:#ff8c00;font-weight:600;border-bottom:2px solid #ff8c00;background:rgba(255,140,0,0.06);}
.tab-nav li a:hover,.tab:hover:not(.active){color:rgba(255,255,255,0.8);}

/* ── Breaking Bar ── */
.breaking{
  background:rgba(20,30,48,0.75);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,0.07);
  border-right:3px solid #ff8c00;
  padding:7px 16px;
  display:flex;align-items:center;gap:10px;
  position:relative;z-index:10;overflow:hidden;
}
.break-badge{
  background:rgba(255,140,0,0.2);color:#ffa733;
  border:1px solid rgba(255,140,0,0.35);
  font-size:10px;font-weight:700;padding:3px 10px;border-radius:50px;
  white-space:nowrap;font-family:'Heebo',sans-serif;
  display:flex;align-items:center;gap:5px;flex-shrink:0;
}
.live-dot{width:6px;height:6px;border-radius:50%;background:#ff8c00;animation:pulse 1.3s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.25;}}
.ticker-wrap{overflow:hidden;flex:1;}
.ticker-text{font-size:12px;color:rgba(255,255,255,0.75);white-space:nowrap;font-family:'Heebo',sans-serif;display:inline-block;animation:tick 22s linear infinite;}
@keyframes tick{0%{transform:translateX(-100%);}100%{transform:translateX(120%);}}

/* ── Hero Grid ── */
.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:10px;padding:12px;position:relative;z-index:5;}

.hero-main{
  background:rgba(255,255,255,0.05);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:18px;padding:18px;min-height:130px;
  display:flex;flex-direction:column;justify-content:flex-end;
  cursor:pointer;transition:all 0.25s;position:relative;overflow:hidden;
}
.hero-main::after{content:'';position:absolute;inset:0;border-radius:18px;background:linear-gradient(135deg,rgba(255,140,0,0.05) 0%,transparent 60%);pointer-events:none;}
.hero-main:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,140,0,0.3);transform:translateY(-2px);}
.top-accent{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#ff8c00 30%,transparent);border-radius:18px 18px 0 0;}
.hero-main__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.35;border-radius:18px;}
.hero-main__gradient{position:absolute;inset:0;background:linear-gradient(to top,rgba(5,14,26,0.95) 0%,rgba(5,14,26,0.3) 60%,transparent 100%);border-radius:18px;}
.hero-main__body{position:relative;z-index:2;}

.side-stack{display:flex;flex-direction:column;gap:10px;}
.side-card{
  background:rgba(255,255,255,0.05);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.09);
  border-radius:15px;padding:13px;flex:1;
  cursor:pointer;transition:all 0.2s;display:block;
}
.side-card:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,140,0,0.2);}

/* ── Tag Pill / Category Badge ── */
.tag-pill{
  background:rgba(255,140,0,0.18);color:#ffa733;
  border:1px solid rgba(255,140,0,0.25);
  font-size:10px;font-weight:600;padding:2px 9px;
  border-radius:50px;display:inline-block;margin-bottom:8px;
  font-family:'Heebo',sans-serif;
}
.tag-pill.blue  {background:rgba(0,100,255,0.2);color:#80b0ff;border-color:rgba(0,100,255,0.3);}
.tag-pill.green {background:rgba(0,180,80,0.2); color:#60e090;border-color:rgba(0,180,80,0.3);}
.tag-pill.purple{background:rgba(140,60,255,0.2);color:#c090ff;border-color:rgba(140,60,255,0.3);}
.tag-pill.red   {background:rgba(255,60,60,0.2); color:#ff8888;border-color:rgba(255,60,60,0.3);}

/* ── Card Text ── */
.card-title{font-size:14px;font-weight:500;color:#fff;line-height:1.5;font-family:'Heebo',sans-serif;}
.card-title.lg{font-size:16px;font-weight:700;line-height:1.45;}
.card-meta{font-size:10px;color:rgba(255,255,255,0.35);margin-top:8px;font-family:'Heebo',sans-serif;}

/* ── Trending Strip ── */
.trending-strip{
  margin:0 12px 12px;
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);
  border-radius:13px;padding:10px 14px;
  display:flex;align-items:center;gap:12px;
  position:relative;z-index:5;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
}
.trending-strip::-webkit-scrollbar{display:none;}
.trend-label{font-size:10px;color:#ff8c00;font-weight:700;white-space:nowrap;flex-shrink:0;}
.trend-item{
  font-size:11px;color:rgba(255,255,255,0.6);
  background:rgba(255,255,255,0.06);border-radius:50px;
  padding:3px 10px;cursor:pointer;transition:all 0.2s;font-family:'Heebo',sans-serif;
  white-space:nowrap;flex-shrink:0;
}
.trend-item:hover{color:#fff;background:rgba(255,140,0,0.15);}

/* ── Bottom 3-col ── */
.bottom-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 12px 12px;position:relative;z-index:5;}
.bottom-card{
  background:rgba(255,255,255,0.04);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:13px;padding:12px;cursor:pointer;transition:all 0.2s;display:block;
}
.bottom-card:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,140,0,0.18);}
.bottom-cat{font-size:10px;color:#ff8c00;font-weight:600;margin-bottom:5px;}
.bottom-title{font-size:11px;color:rgba(255,255,255,0.8);line-height:1.45;}
.bottom-meta{font-size:10px;color:rgba(255,255,255,0.35);margin-top:5px;}

/* ── News Section ── */
.section{padding:0 12px 12px;position:relative;z-index:5;}
.section__header{display:flex;align-items:center;justify-content:space-between;padding:4px 0 10px;}
.section__title{font-size:14px;font-weight:700;color:#fff;}
.section__title::before{content:'';display:inline-block;width:3px;height:14px;background:#ff8c00;border-radius:2px;margin-left:8px;vertical-align:middle;}
.section__more{font-size:11px;color:#ff8c00;opacity:0.8;}
.card--h{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:13px;padding:11px;transition:all 0.2s;margin-bottom:8px;display:flex;}
.card--h:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,140,0,0.18);}
.card-thumb{width:80px;height:68px;object-fit:cover;border-radius:9px;flex-shrink:0;}
.img-placeholder{width:80px;height:68px;background:rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:center;font-size:22px;border-radius:9px;flex-shrink:0;}
.card-body{flex:1;min-width:0;}

/* ── Story CTA ── */
.story-cta{margin:4px 12px 12px;background:linear-gradient(135deg,rgba(255,140,0,0.15),rgba(255,100,0,0.08));border:1px solid rgba(255,140,0,0.22);border-radius:18px;padding:18px;text-align:center;position:relative;overflow:hidden;z-index:5;}
.story-cta::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,140,0,0.4),transparent);}
.story-cta__title{font-size:15px;font-weight:700;margin-bottom:6px;}
.story-cta__sub{font-size:12px;color:rgba(255,255,255,0.6);margin-bottom:14px;}
.story-cta__btn{display:inline-block;background:#ff8c00;color:#fff;font-size:13px;font-weight:700;padding:9px 24px;border-radius:50px;}
.story-cta__btn:hover{background:#ffa733;}

/* ── Single Article ── */
.single-wrap{padding:14px 12px;position:relative;z-index:5;}
.single-cat-badge{margin-bottom:12px;}
.single-title{font-size:22px;font-weight:900;line-height:1.38;margin-bottom:12px;}
.single-meta{font-size:12px;color:rgba(255,255,255,0.5);margin-bottom:16px;display:flex;gap:6px;flex-wrap:wrap;}
.single-hero-img{width:100%;border-radius:18px;margin-bottom:18px;max-height:280px;object-fit:cover;}
.single-content{font-size:16px;line-height:1.85;color:rgba(255,255,255,0.87);}
.single-content p{margin-bottom:16px;}
.single-content h2,.single-content h3{font-size:18px;font-weight:700;margin:22px 0 10px;}
.single-content blockquote{border-right:3px solid #ff8c00;padding:10px 16px;margin:16px 0;background:rgba(255,140,0,0.06);border-radius:0 8px 8px 0;color:rgba(255,255,255,0.75);font-style:italic;}
.single-content img{width:100%;border-radius:16px;margin:16px 0;}

/* ── Category Page ── */
.cat-page{padding:14px 12px;position:relative;z-index:5;}
.cat-page__title{font-size:20px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.cat-page__title span{font-size:11px;color:rgba(255,255,255,0.5);background:rgba(255,255,255,0.07);padding:3px 10px;border-radius:50px;}

/* ── Footer ── */
.site-footer{background:rgba(255,255,255,0.03);border-top:1px solid rgba(255,255,255,0.07);padding:28px 16px;text-align:center;position:relative;z-index:5;}
.site-footer .custom-logo-link img,.site-footer .custom-logo{height:36px;width:auto;margin:0 auto 12px;object-fit:contain;}
.site-footer__logo{font-size:14px;font-weight:700;color:#ff8c00;margin-bottom:8px;}
.site-footer__desc{font-size:12px;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:16px;}
.site-footer__social{display:flex;gap:14px;justify-content:center;margin-bottom:14px;}
.site-footer__social a{font-size:18px;opacity:0.65;transition:opacity 0.2s;}
.site-footer__social a:hover{opacity:1;}
.site-footer__links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:12px;}
.site-footer__links a{font-size:11px;color:rgba(255,255,255,0.45);}
.site-footer__links a:hover{color:#ff8c00;}
.site-footer__copy{font-size:10px;color:rgba(255,255,255,0.22);}

/* ── Pagination ── */
.nav-links{display:flex;gap:8px;justify-content:center;padding:16px 0;flex-wrap:wrap;}
.nav-links a,.nav-links span{display:inline-block;padding:6px 14px;border-radius:50px;font-size:12px;background:rgba(255,255,255,0.07);color:rgba(255,255,255,0.7);border:1px solid rgba(255,255,255,0.07);transition:all 0.2s;}
.nav-links a:hover{background:rgba(255,140,0,0.2);color:#ff8c00;}
.nav-links span.current{background:#ff8c00;color:#fff;border-color:#ff8c00;}

/* ── 404 / Static Page ── */
.page-404{padding:60px 16px;text-align:center;position:relative;z-index:5;}
.page-404__code{font-size:80px;font-weight:900;color:#ff8c00;opacity:0.65;line-height:1;margin-bottom:12px;}
.page-404__msg{font-size:20px;font-weight:700;margin-bottom:8px;}
.page-404__sub{font-size:14px;color:rgba(255,255,255,0.5);margin-bottom:24px;}
.page-404__btn{display:inline-block;background:#ff8c00;color:#fff;padding:10px 28px;border-radius:50px;font-size:14px;font-weight:700;}
.page-content{padding:14px 12px;position:relative;z-index:5;}
.page-title{font-size:22px;font-weight:900;margin-bottom:16px;}
.page-body{font-size:15px;line-height:1.8;color:rgba(255,255,255,0.87);}
.page-body p{margin-bottom:14px;}

/* ══ MOBILE: small fixes ══ */
@media(max-width:480px){
  .hero-grid{grid-template-columns:1fr 1.6fr;gap:8px;padding:10px;}
  .side-card{padding:10px;}
  .card-title{font-size:13px;}
}

/* ══ DESKTOP: just scale the frame up ══ */
@media(min-width:700px){
  .hero-main{min-height:180px;}
  .card-title.lg{font-size:20px;}
}
@media(min-width:1000px){
  .hero-main{min-height:240px;}
  .card-title.lg{font-size:26px;}
  .hero-grid{padding:16px;gap:14px;}
}
@media(min-width:1280px){
  .hero-main{min-height:300px;}
  .card-title.lg{font-size:30px;}
}

/* ── Inner page wrapper ── */
.page-inner{position:relative;z-index:5;}

/* ── Category badges ── */
.cat-badge{display:inline-block;font-size:10px;font-weight:700;padding:3px 10px;border-radius:50px;margin-bottom:8px;text-decoration:none;}
.cat-badge--green{background:rgba(34,197,94,0.18);color:#4ade80;border:1px solid rgba(34,197,94,0.25);}
.cat-badge--blue{background:rgba(59,130,246,0.18);color:#60a5fa;border:1px solid rgba(59,130,246,0.25);}
.cat-badge--purple{background:rgba(168,85,247,0.18);color:#c084fc;border:1px solid rgba(168,85,247,0.25);}
.cat-badge--red{background:rgba(239,68,68,0.18);color:#f87171;border:1px solid rgba(239,68,68,0.25);}
.cat-badge:not([class*="--"]){background:rgba(255,140,0,0.18);color:#ffa733;border:1px solid rgba(255,140,0,0.25);}

/* ── Single page ── */
.single-meta{font-size:11px;color:rgba(255,255,255,0.45);margin-bottom:18px;display:flex;gap:8px;flex-wrap:wrap;}
.single-hero-img{width:100%;border-radius:16px;margin:16px 0;max-height:320px;object-fit:cover;}
.page-content{padding:14px 12px;position:relative;z-index:5;}
.page-title{font-size:22px;font-weight:900;margin-bottom:16px;}
.page-body{font-size:15px;line-height:1.8;color:rgba(255,255,255,0.85);}


/* ══ ARTICLE SINGLE PAGE — white card over dark bg ══ */
.article-outer{
  position:relative;z-index:5;
  padding:16px 12px 40px;
}
.article-card{
  background:#fff;
  border-radius:20px;
  padding:24px 20px 32px;
  color:#111;
  box-shadow:0 8px 40px rgba(0,0,0,0.45);
}

/* category badge inside card */
.article-cat-badge{
  display:inline-block;font-size:10px;font-weight:700;
  padding:3px 12px;border-radius:50px;margin-bottom:14px;
  text-decoration:none;
}
.article-card .cat-badge--green{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7;}
.article-card .cat-badge--blue{background:#dbeafe;color:#1e40af;border:1px solid #93c5fd;}
.article-card .cat-badge--purple{background:#ede9fe;color:#5b21b6;border:1px solid #c4b5fd;}
.article-card .cat-badge--red{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;}
.article-card .cat-badge--orange,
.article-card .article-cat-badge:not([class*="--"]){background:#fff7ed;color:#92400e;border:1px solid #fcd34d;}

.article-title{
  font-size:22px;font-weight:900;line-height:1.35;
  margin:0 0 12px;color:#0d1117;
}
.article-meta{
  display:flex;gap:6px;flex-wrap:wrap;align-items:center;
  font-size:11px;color:#6b7280;margin-bottom:18px;
}
.article-meta__sep{color:#d1d5db;}

.article-hero-wrap{
  margin:0 -4px 22px;
  border-radius:14px;overflow:hidden;
}
.article-hero-img{
  width:100%;display:block;
  max-height:300px;object-fit:cover;
}

.article-body{
  font-size:15px;line-height:1.9;color:#1f2937;
  direction:rtl;
}
.article-body p{margin-bottom:16px;}
.article-body h2,.article-body h3{
  font-size:18px;font-weight:800;margin:24px 0 10px;color:#111;
}
.article-body a{color:#d97706;text-decoration:none;}
.article-body a:hover{text-decoration:underline;}
.article-body blockquote{
  border-right:4px solid #f59e0b;
  padding:10px 16px;margin:20px 0;
  background:#fffbeb;border-radius:8px;
  font-style:italic;color:#78350f;
}
.article-body ul,.article-body ol{
  padding-right:20px;margin-bottom:16px;
}
.article-body li{margin-bottom:6px;}

/* related posts section */
.article-related{
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid #e5e7eb;
}
.article-related__title{
  font-size:14px;font-weight:800;color:#374151;
  margin:0 0 16px;
}
.article-related__grid{display:flex;flex-direction:column;gap:12px;}

.rel-card{
  display:flex;gap:12px;align-items:flex-start;
  text-decoration:none;padding:10px;
  border-radius:12px;background:#f9fafb;
  border:1px solid #e5e7eb;
  transition:background 0.15s;
}
.rel-card:hover{background:#f3f4f6;}
.rel-card__img{
  width:80px;height:60px;object-fit:cover;
  border-radius:8px;flex-shrink:0;
}
.rel-card__placeholder{
  width:80px;height:60px;background:#e5e7eb;
  border-radius:8px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:22px;
}
.rel-card__body{flex:1;min-width:0;}
.rel-card__cat{
  display:inline-block;font-size:9px;font-weight:700;
  padding:2px 8px;border-radius:50px;margin-bottom:4px;
}
.rel-card__title{font-size:13px;font-weight:700;color:#111;line-height:1.4;}
.rel-card__time{font-size:10px;color:#9ca3af;margin-top:4px;}
/* ── AdSense ad units ── */
.hk-ad-unit{
  margin:20px -4px 24px;
  background:rgba(255,255,255,0.04);
  border-radius:12px;
  overflow:hidden;
  min-height:90px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hk-ad-unit ins{min-width:280px;width:100%;}