/*
Theme Name: BlogHash Child
Template: bloghash
Author: SuperPahal Academy
Description: Child theme of BlogHash. Adds a ForumIAS-style custom homepage (front-page.php) with Latest Articles, live What's New widget, Academy banner, and 6 permanent SSC CGL category sections. Update-safe — parent BlogHash is never modified.
Version: 1.0.3
Text Domain: bloghash-child
*/

/* ============================================================
   SUPERPAHAL FORUM-STYLE HOMEPAGE
   (scoped under #sp-home so nothing else on the site is affected)
   ============================================================ */

:root{
  --sp-cream:#fbf7ef; --sp-paper2:#f4f1ea;
  --sp-orange:#f4811f; --sp-orange-d:#e0730f; --sp-orange-s:#fef3e8;
  --sp-gold:#fcd34d; --sp-gold-d:#d97706;
  --sp-navy:#1a1a2e; --sp-navy2:#0d1929; --sp-blue:#2a3f6f;
  --sp-ink:#1a1a2e; --sp-muted:#6b7280; --sp-hair:#ece5d6; --sp-card:#ffffff;
  --sp-green:#16a34a; --sp-purple:#7c3aed; --sp-red:#dc2626;
}

#sp-home{background:var(--sp-cream);font-family:'DM Sans',sans-serif;color:var(--sp-ink);line-height:1.6;padding-bottom:10px;}
#sp-home *{box-sizing:border-box;}
#sp-home a{text-decoration:none;color:inherit;}
#sp-home img{max-width:100%;height:auto;}
.sp-wrap{max-width:1180px;margin:0 auto;padding:0 20px;}

/* ===== HERO ROW ===== */
/* Latest Articles (center) sets the row height; banner + What's New stretch to match it. */
.sp-hero{display:grid;grid-template-columns:1.05fr 1.25fr 0.95fr;gap:20px;padding:28px 0 8px;align-items:stretch;}
.sp-block{background:var(--sp-card);border-radius:16px;border:1px solid var(--sp-hair);overflow:hidden;display:flex;flex-direction:column;}
.sp-block-head{display:flex;align-items:center;gap:8px;padding:16px 18px 12px;border-bottom:1px solid var(--sp-hair);flex-shrink:0;}
.sp-block-head .sp-bar{width:4px;height:20px;background:var(--sp-orange);border-radius:3px;}
.sp-block-head h2{font-family:'Sora',sans-serif;font-size:15px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--sp-navy);margin:0;}

/* clickable "Latest Articles" heading */
#sp-home a.sp-latest-head{text-decoration:none;cursor:pointer;transition:background .15s;}
#sp-home a.sp-latest-head:hover{background:var(--sp-orange-s);}
#sp-home a.sp-latest-head h2{color:var(--sp-navy)!important;}
.sp-head-arrow{margin-left:auto;font-size:12px;color:var(--sp-orange-d)!important;opacity:0;transform:translateX(-4px);transition:opacity .15s,transform .15s;}
#sp-home a.sp-latest-head:hover .sp-head-arrow{opacity:1;transform:translateX(0);}

/* banner — a TALL banner image fills the entire column: full height, no crop, no gaps.
   Designed for a portrait banner (~0.73 ratio) matching the column, so cover fills
   perfectly. Column height matches the Latest Articles / What's New columns. */
.sp-banner{padding:0;border:none;background:transparent;}
#sp-home .sp-banner a{flex:1 1 auto;display:block;position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--sp-hair);min-height:220px;background:var(--sp-card);}
#sp-home .sp-banner a img{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;object-position:center;display:block;margin:0;}

/* latest articles */
.sp-latest .sp-block-head h2 .fa-solid{color:var(--sp-orange);font-size:13px;margin-right:2px;}
.sp-artlist{padding:8px 0;flex:1;}
#sp-home a.sp-viewall{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px 14px 14px;padding:12px 18px;border-radius:10px;background:var(--sp-navy);border:none;font-family:'Sora',sans-serif;font-size:13px;font-weight:700;color:#fff!important;text-transform:uppercase;letter-spacing:.04em;text-decoration:none;transition:background .15s,gap .15s;flex-shrink:0;}
#sp-home a.sp-viewall:hover,#sp-home a.sp-viewall:focus{background:var(--sp-orange);color:#fff!important;gap:12px;}
#sp-home a.sp-viewall .fa-solid{font-size:12px;color:#fff!important;}
#sp-home a.sp-art{display:block;padding:13px 18px;border-bottom:1px solid var(--sp-hair);text-decoration:none;transition:background .15s;}
.sp-art:last-child{border-bottom:none;}
.sp-art:hover{background:var(--sp-orange-s);}
.sp-art.feat{background:linear-gradient(90deg,var(--sp-gold) 0,var(--sp-gold) 4px,#fffdf5 4px,#fffdf5 100%);}
.sp-art.feat:hover{background:linear-gradient(90deg,var(--sp-orange) 0,var(--sp-orange) 4px,var(--sp-orange-s) 4px,var(--sp-orange-s) 100%);}
#sp-home .sp-art-title{font-size:14px;font-weight:600;color:var(--sp-ink)!important;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sp-art.feat .sp-art-title{font-weight:700;}
.sp-art-meta{font-size:11px;color:var(--sp-muted);margin-top:4px;display:flex;align-items:center;gap:5px;}
.sp-art-meta .fa-regular{font-size:11px;color:var(--sp-orange);}

/* what's new (dark) — matches sibling height; inner list scrolls, never dictates height */
.sp-wn{background:var(--sp-navy2);border:none;padding:0;}
.sp-wn .wnbox{background:var(--sp-navy2);border-radius:16px;overflow:hidden;height:100%;display:flex;flex-direction:column;position:relative;}
.wn-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0;}
.wn-trow{display:flex;align-items:center;gap:10px;}
.wn-icon{background:var(--sp-red);border-radius:8px;padding:6px 8px;font-size:14px;color:#fff;line-height:1;}
.wn-t1{font-size:15px;font-weight:700;color:#fff;line-height:1.2;font-family:'Sora',sans-serif;}
.wn-t2{font-size:10px;color:#8899aa;letter-spacing:.08em;text-transform:uppercase;}
.wn-live{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--sp-red);font-weight:600;background:rgba(220,38,38,.12);padding:3px 8px;border-radius:20px;}
.wn-ld{width:6px;height:6px;border-radius:50%;background:var(--sp-red);display:inline-block;animation:wnPulse 1.5s ease infinite;}
/* the list fills remaining space; its scrolling track is absolutely positioned so tall content can't stretch the column */
.wn-list{flex:1 1 auto;min-height:0;position:relative;overflow:hidden;}
.wn-track{position:absolute;top:0;left:0;right:0;will-change:transform;}
.wn-list:hover .wn-track{animation-play-state:paused!important;}
.wn-item{padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.07);}
.wn-cat{display:flex;align-items:center;gap:5px;margin-bottom:5px;}
.wn-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.wn-clabel{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.wc-live .wn-dot{background:var(--sp-orange);}.wc-live .wn-clabel{color:var(--sp-orange);}
.wc-free .wn-dot{background:var(--sp-green);}.wc-free .wn-clabel{color:var(--sp-green);}
.wc-new .wn-dot{background:#3498db;}.wc-new .wn-clabel{color:#3498db;}
.wc-info .wn-dot{background:#95a5a6;}.wc-info .wn-clabel{color:#95a5a6;}
.wc-update .wn-dot{background:#f39c12;}.wc-update .wn-clabel{color:#f39c12;}
.wn-heading{font-size:13px;font-weight:600;color:#fff;margin:0 0 4px;line-height:1.4;}
.wn-desc{font-size:12px;color:#8899aa;margin:0 0 7px;line-height:1.5;}
.wn-link{font-size:12px;color:var(--sp-gold);font-weight:600;}
.wn-link:hover{text-decoration:underline;}
.wn-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-top:1px solid rgba(255,255,255,.08);flex-shrink:0;}
.wn-ticker{display:flex;align-items:center;gap:6px;font-size:11px;color:#4a6280;}
.wn-pulse{width:6px;height:6px;border-radius:50%;background:var(--sp-green);display:inline-block;animation:wnPulse 2s ease infinite;}
.wn-all{font-size:12px;color:var(--sp-gold);font-weight:600;}
@keyframes wnScroll{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes wnPulse{0%,100%{opacity:1}50%{opacity:.3}}

/* ===== CATEGORY SECTIONS ===== */
.sp-cats{padding:22px 0 40px;}
.sp-cats-title{text-align:center;margin:14px 0 22px;}
.sp-cats-title h2{font-family:'Playfair Display',serif;font-size:26px;font-weight:800;color:var(--sp-navy);margin:0;}
.sp-cats-title p{font-size:13px;color:var(--sp-muted);margin-top:4px;}
.sp-catgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.sp-cat{background:var(--sp-card);border-radius:16px;border:1px solid var(--sp-hair);overflow:hidden;display:flex;flex-direction:column;}
.sp-cat-head{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:2px solid;}
.sp-cat-h-l{display:flex;align-items:center;gap:10px;}
.sp-cat-ic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;flex-shrink:0;}
.sp-cat-name{font-family:'Sora',sans-serif;font-size:15px;font-weight:700;color:var(--sp-navy);line-height:1.2;}
.sp-cat-count{font-size:11px;color:var(--sp-muted);margin-top:1px;}
.sp-cat-view{font-size:12px;font-weight:600;color:var(--sp-orange-d);white-space:nowrap;}
.sp-cat-posts{padding:6px 0;flex:1;}
.sp-cat-post{display:flex;gap:10px;align-items:flex-start;padding:10px 18px;border-bottom:1px solid var(--sp-hair);transition:background .15s;}
#sp-home a.sp-cat-post{display:flex;gap:10px;align-items:flex-start;padding:10px 18px;border-bottom:1px solid var(--sp-hair);text-decoration:none;transition:background .15s;}
.sp-cat-post:last-child{border-bottom:none;}
.sp-cat-post:hover{background:var(--sp-paper2);}
.sp-cat-post .sp-num{font-family:'Sora',sans-serif;font-size:12px;font-weight:700;color:var(--sp-hair);min-width:16px;}
.sp-cat-post:hover .sp-num{color:var(--sp-orange);}
#sp-home .sp-cat-post .sp-txt{font-size:13px;font-weight:500;color:var(--sp-ink)!important;line-height:1.4;}
.sp-cat-post .sp-pl{font-size:10px;color:var(--sp-muted);margin-top:2px;}
#sp-home a.sp-cat-view{color:var(--sp-orange-d)!important;text-decoration:none;}
.sp-cat-empty{padding:16px 18px;font-size:12px;color:var(--sp-muted);}

/* pagination (All Articles page) */
.sp-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:26px 0 10px;}
.sp-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--sp-hair);background:var(--sp-card);font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:var(--sp-ink);transition:all .15s;}
.sp-pagination .page-numbers:hover{border-color:var(--sp-orange);color:var(--sp-orange-d);}
.sp-pagination .page-numbers.current{background:var(--sp-orange);border-color:var(--sp-orange);color:#fff;}
.sp-pagination .page-numbers.dots{border:none;background:transparent;}

/* permanent category accent colors */
.cat-updates .sp-cat-head{border-color:var(--sp-red);} .cat-updates .sp-cat-ic{background:var(--sp-red);}
.cat-apply .sp-cat-head{border-color:var(--sp-blue);} .cat-apply .sp-cat-ic{background:var(--sp-blue);}
.cat-strategy .sp-cat-head{border-color:var(--sp-orange);} .cat-strategy .sp-cat-ic{background:var(--sp-orange);}
.cat-subject .sp-cat-head{border-color:var(--sp-green);} .cat-subject .sp-cat-ic{background:var(--sp-green);}
.cat-career .sp-cat-head{border-color:var(--sp-purple);} .cat-career .sp-cat-ic{background:var(--sp-purple);}
.cat-pattern .sp-cat-head{border-color:var(--sp-gold-d);} .cat-pattern .sp-cat-ic{background:var(--sp-gold-d);}

/* ===== RESPONSIVE — desktop 3-col, mobile stacked ===== */
/* mobile order requirement: Latest Articles -> What's New -> Banner -> Categories */
@media (max-width:960px){
  .sp-hero{display:flex;flex-direction:column;gap:16px;}
  .sp-latest{order:1;}
  .sp-wn{order:2;}
  .sp-banner{order:3;}
  /* on mobile each block sizes to its own content — no forced equal height */
  /* banner shows FULL image (no crop) so it fits in one screen without swiping */
  #sp-home .sp-banner a{flex:none;height:auto;min-height:0;position:static;padding:0;}
  #sp-home .sp-banner a img{position:static!important;width:100%!important;height:auto!important;object-fit:contain;padding:0;}
  .sp-wn .wnbox{height:auto;}
  .wn-list{flex:none;height:300px;}
  .wn-track{position:relative;}
  .sp-catgrid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .sp-wrap{padding:0 14px;}
  .sp-hero{padding:18px 0 4px;}
  .sp-cats-title h2{font-size:22px;}
  .wn-list{height:270px;}
}

/* ===== HIDE FEATURED-IMAGE BANNER EVERYWHERE ===== */
/* Posts should show only their heading + content — never the big featured-image banner.
   This applies on single posts AND on all listing/archive pages (category, tag,
   search, author, date, blog index). The featured image itself is NOT deleted
   (still available for SEO / social-share previews), it's just never displayed.
   Note: this is scoped to article/post thumbnails, so the homepage custom banner
   (#sp-home .sp-banner) and the What's New widget are unaffected. */
.post-thumb.entry-media.thumbnail,
.bloghash-article > .post-thumb,
article .post-thumb,
article .entry-media.thumbnail,
.entry-media.thumbnail img.wp-post-image,
img.default-featured-img{
  display:none!important;
}
/* keep the homepage banner image visible (it is not a post thumbnail) */
#sp-home .sp-banner,
#sp-home .sp-banner a,
#sp-home .sp-banner a img{
  display:block!important;
}
