/*
Theme Name: SciFeed
Theme URI: https://example.com
Author: BusinessToMark
Description: A dense, Yahoo News-style WordPress theme built around a strict rule: only posts with a featured image ever appear on the homepage, anywhere - the hero module and the main feed both automatically skip any post without one. Includes a top hero module (one big story plus three smaller ones), a continuous latest-articles feed mixing every category, and a sidebar with a live category list and a Popular Posts widget. Fully portable - no site name or category is hardcoded.
Version: 1.0
Requires at least: 5.9
Requires PHP: 7.4
Text Domain: scifeed
*/

:root{
  --sf-accent:#6001d2;
  --sf-black:#232a31;
  --sf-gray:#6e7780;
  --sf-border:#e8e8e8;
  --sf-font: -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--sf-font);color:var(--sf-black);background:#fff;}
a{color:inherit;text-decoration:none;}
.container{max-width:900px;margin:0 auto;padding:0 20px;}

.sf-header{border-bottom:1px solid var(--sf-border);padding:18px 0;}
.sf-header-inner{display:flex;align-items:center;justify-content:space-between;}
.sf-logo{font-size:24px;font-weight:800;}
.sf-nav{display:flex;gap:22px;list-style:none;margin:0;padding:0;}
.sf-nav a{font-size:13.5px;font-weight:700;color:var(--sf-gray);}
.sf-nav a:hover{color:var(--sf-accent);}

.sf-page-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--sf-gray);margin:26px 0 4px;}

.sf-feed{border-top:1px solid var(--sf-border);}
.sf-item{display:flex;gap:18px;padding:22px 0;border-bottom:1px solid var(--sf-border);align-items:flex-start;}
.sf-item-thumb{width:170px;height:110px;object-fit:cover;border-radius:6px;flex-shrink:0;}
.sf-item-body{flex:1;min-width:0;}
.sf-item-tag{color:var(--sf-accent);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;}
.sf-item h3{font-size:18px;line-height:1.3;font-weight:800;margin:5px 0 6px;}
.sf-item:hover h3{color:var(--sf-accent);}
.sf-item-dek{font-size:14px;color:#444;line-height:1.5;margin:0 0 8px;}
.sf-item-meta{font-size:12.5px;color:var(--sf-gray);}
.sf-item-meta b{color:var(--sf-black);}

.sf-loadmore-status{text-align:center;padding:24px 0;font-size:13px;color:#999;}

.sf-footer{border-top:1px solid var(--sf-border);padding:30px 0;margin-top:30px;text-align:center;font-size:12.5px;color:var(--sf-gray);}

@media(max-width:600px){
  .sf-item{flex-direction:column;}
  .sf-item-thumb{width:100%;height:180px;}
}

/* ---- 2-column layout with sidebar ---- */
.sf-layout{display:grid;grid-template-columns:2.3fr 1fr;gap:36px;align-items:start;max-width:1140px;}
.container.wide{max-width:1140px;}
.sf-sidebar-block{margin-bottom:30px;}
.sf-sidebar-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;border-bottom:2px solid var(--sf-black);padding-bottom:10px;margin:0 0 4px;}
.sf-cat-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--sf-border);font-size:13.5px;font-weight:600;}
.sf-cat-item:hover{color:var(--sf-accent);}
.sf-cat-count{color:var(--sf-gray);font-weight:700;}
.sf-pop-item{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--sf-border);align-items:flex-start;}
.sf-pop-thumb{width:70px;height:60px;object-fit:cover;border-radius:6px;flex-shrink:0;}
.sf-pop-item h5{font-size:13.5px;font-weight:800;line-height:1.32;margin:0;}
.sf-pop-item:hover h5{color:var(--sf-accent);}

/* ---- Top hero module: big story (left) + 1 top + 2 small (right) ---- */
.sf-hero-module{display:grid;grid-template-columns:1.8fr 1fr;gap:16px;margin:20px 0 30px;}
.sf-hero-main{position:relative;display:block;border-radius:4px;overflow:hidden;}
.sf-hero-main-img{width:100%;height:420px;object-fit:cover;display:block;}
.sf-hero-overlay{position:absolute;left:0;right:0;bottom:0;padding:24px;background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.05));}
.sf-hero-source{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.sf-hero-source-badge{background:#0072d6;color:#fff;font-size:10px;font-weight:900;padding:2px 6px;border-radius:2px;}
.sf-hero-source span{color:#fff;font-size:13px;font-weight:700;}
.sf-hero-overlay h1{color:#fff;font-size:26px;line-height:1.28;font-weight:800;margin:0;}

.sf-hero-side{display:flex;flex-direction:column;gap:16px;}
.sf-hero-top-story{position:relative;border-radius:4px;overflow:hidden;display:block;flex:1;}
.sf-hero-top-img{width:100%;height:190px;object-fit:cover;display:block;}
.sf-hero-side-small-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.sf-hero-small-img{width:100%;height:100px;object-fit:cover;border-radius:4px;margin-bottom:8px;}
.sf-hero-small h5{font-size:13.5px;font-weight:700;line-height:1.32;margin:0 0 6px;}
.sf-hero-small:hover h5{color:var(--sf-accent);}
.sf-hero-small-source{font-size:11px;color:var(--sf-gray);display:flex;align-items:center;gap:4px;}

@media(max-width:900px){
  .sf-hero-module{grid-template-columns:1fr;}
  .sf-hero-side-small-row{grid-template-columns:1fr 1fr;}
}

/* ---------- Single article ---------- */
.sf-breadcrumb{font-size:12.5px;color:var(--sf-gray);margin:20px 0 6px;}
.sf-breadcrumb a{color:var(--sf-gray);}
.sf-breadcrumb a:hover{color:var(--sf-accent);}
.sf-article-header{padding-bottom:16px;border-bottom:1px solid var(--sf-border);margin-bottom:20px;}
.sf-article-header h1{font-size:32px;line-height:1.2;font-weight:800;margin:8px 0 12px;}
.sf-article-byline{font-size:13px;color:var(--sf-gray);}
.sf-article-byline b{color:var(--sf-black);}
.sf-article-thumb{width:100%;height:auto;max-height:480px;object-fit:contain;background:#f5f5f5;margin-bottom:22px;border-radius:6px;}
.sf-article-layout{display:grid;grid-template-columns:2.2fr 1fr;gap:36px;align-items:start;}
.sf-article-body{font-size:17px;line-height:1.75;color:#1a1a1a;}
.sf-article-body p{margin:0 0 20px;}
.sf-article-body h2{font-size:23px;font-weight:800;margin:32px 0 12px;}
.sf-article-body a{color:var(--sf-accent);text-decoration:underline;}
.sf-cat-title-bar{padding:24px 0 14px;border-bottom:2px solid var(--sf-black);margin-bottom:20px;}
.sf-cat-title-bar h1{font-size:26px;font-weight:800;margin:0;}

@media(max-width:900px){
  .sf-article-layout{grid-template-columns:1fr;}
}