/*
Theme Name: LogikalNaija
Theme URI: https://logikalnaija.com
Author: Felyx Consult Limited
Description: Custom news theme for LogikalNaija — News. Analysis. Perspective. Built with sections for News, Interviews & Podcasts (recorded virtually), Videos (shorts/long-form), and widgetized ad placements for monetization.
Version: 1.0
Requires PHP: 7.4
Text Domain: logikalnaija
*/

:root{
  --black:#0a0f0c;
  --ink:#0e1712;
  --green-deep:#0b3b24;
  --green:#0f7a3d;
  --green-bright:#39d97a;
  --gold:#c9a227;
  --paper:#eef0e6;
  --ink-light:#c7cdbc;
  --white:#fafaf7;
  --line: rgba(238,240,230,0.14);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--white);
  font-family:'Inter',sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Fraunces',serif; font-weight:600; letter-spacing:-0.01em;}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%; height:auto;}
.mono{font-family:'IBM Plex Mono',monospace; letter-spacing:0.02em;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
::selection{background:var(--green-bright); color:var(--black);}

/* ---------- TICKER ---------- */
.ticker-bar{background:var(--green-deep); border-bottom:1px solid var(--line); overflow:hidden; white-space:nowrap; padding:9px 0;}
.ticker-track{display:inline-flex; gap:48px; padding-left:100%; animation:scroll-ticker 38s linear infinite;}
.ticker-track span{font-size:12.5px; color:var(--ink-light); display:inline-flex; align-items:center; gap:10px;}
.ticker-track span::before{content:"●"; color:var(--green-bright); font-size:8px;}
@keyframes scroll-ticker{0%{transform:translateX(0);}100%{transform:translateX(-100%);}}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none; padding-left:24px;}}

/* ---------- HEADER ---------- */
header.site-header{position:sticky; top:0; z-index:50; background:rgba(10,15,12,0.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.nav-row{display:flex; align-items:center; justify-content:space-between; padding:16px 0;}
.logo{display:flex; align-items:baseline; gap:2px; font-family:'Fraunces',serif; font-weight:700; font-size:26px;}
.logo .naija{color:var(--green-bright);}
.tagline{font-size:10.5px; color:var(--ink-light); letter-spacing:0.14em; text-transform:uppercase; margin-left:10px; padding-left:10px; border-left:1px solid var(--line); display:none;}
@media(min-width:720px){.tagline{display:inline-block;}}
nav.main-nav ul{display:none; gap:28px; font-size:14px; font-weight:500; list-style:none;}
nav.main-nav{display:none; gap:28px; font-size:14px; font-weight:500;}
nav.main-nav a{color:var(--ink-light); transition:color .2s; margin-right:28px;}
nav.main-nav a:last-child{margin-right:0;}
nav.main-nav a:hover{color:var(--green-bright);}
@media(min-width:940px){nav.main-nav ul{display:flex;} nav.main-nav{display:flex;}}
.nav-actions{display:flex; align-items:center; gap:14px;}
.btn{display:inline-flex; align-items:center; gap:8px; background:var(--green); color:var(--white); padding:10px 18px; border-radius:2px; font-size:13.5px; font-weight:600; border:none; cursor:pointer; transition:background .2s;}
.btn:hover{background:var(--green-bright); color:var(--black);}
.menu-toggle{background:none; border:none; color:var(--white); font-size:22px; cursor:pointer;}
@media(min-width:940px){.menu-toggle{display:none;}}
.mobile-nav{display:none; flex-direction:column; padding:14px 0; border-top:1px solid var(--line);}
.mobile-nav.open{display:flex;}
.mobile-nav a{padding:10px 0; font-size:14.5px; color:var(--ink-light); border-bottom:1px solid var(--line);}
@media(min-width:940px){.mobile-nav{display:none !important;}}

/* ---------- AD SLOTS ---------- */
.ad-slot-wrap{border:1px dashed rgba(238,240,230,0.28); background:rgba(238,240,230,0.03); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:4px; color:var(--ink-light); text-align:center; font-size:11px; text-transform:uppercase; letter-spacing:0.12em; min-height:90px; padding:12px;}
.ad-slot-wrap span.small{font-size:10px; opacity:0.6; letter-spacing:0.06em; text-transform:none;}
.ad-leaderboard{margin:20px 0;}
.ad-native{grid-column:1/-1; border-color:var(--gold); color:var(--gold); padding:22px; min-height:auto; background:rgba(201,162,39,0.05);}
.ad-sidebar{min-height:260px;}
.widget-populated .ad-slot-wrap{display:none;}

/* ---------- HERO ---------- */
.hero{padding:40px 0 56px;}
.hero-grid{display:grid; gap:24px; grid-template-columns:1fr;}
@media(min-width:900px){.hero-grid{grid-template-columns:1.6fr 1fr;}}
.lead-story{position:relative; overflow:hidden;}
.lead-story img{width:100%; height:380px; object-fit:cover; filter:saturate(0.9) contrast(1.05);}
.lead-story .overlay{position:absolute; inset:0; background:linear-gradient(to top, rgba(10,15,12,0.95) 10%, rgba(10,15,12,0.15) 60%, transparent 100%);}
.lead-story .content{position:absolute; left:0; right:0; bottom:0; padding:28px;}
.tag{display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.1em; color:var(--black); background:var(--green-bright); padding:4px 9px; margin-bottom:12px;}
.tag.gold{background:var(--gold);}
.tag.ghost{background:transparent; border:1px solid var(--green-bright); color:var(--green-bright);}
.lead-story h1, .lead-story h2{font-size:clamp(26px,3.4vw,38px); line-height:1.15; margin-bottom:10px;}
.lead-story p.dek{color:var(--ink-light); font-size:15px; max-width:520px;}
.meta-row{display:flex; gap:14px; margin-top:14px; font-size:12px; color:var(--ink-light);}
.side-stories{display:flex; flex-direction:column; gap:18px;}
.side-story{display:flex; gap:14px; border-bottom:1px solid var(--line); padding-bottom:18px;}
.side-story:last-child{border-bottom:none;}
.side-story img{width:96px; height:96px; object-fit:cover; flex-shrink:0;}
.side-story h3{font-size:16px; line-height:1.3; margin-bottom:6px;}
.side-story .tag{margin-bottom:8px;}

/* ---------- SECTIONS ---------- */
.section{padding:52px 0;}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:28px; border-bottom:2px solid var(--white); padding-bottom:14px;}
.section-head h2{font-size:26px;}
.section-head .see-all{font-size:13px; color:var(--green-bright); font-weight:600;}
.eyebrow{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--green-bright); text-transform:uppercase; letter-spacing:0.12em; margin-bottom:6px; display:block;}

/* ---------- NEWS GRID / CARDS ---------- */
.news-grid{display:grid; gap:26px; grid-template-columns:1fr;}
@media(min-width:700px){.news-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:1020px){.news-grid{grid-template-columns:1fr 1fr 1fr;}}
.story-card img{width:100%; height:190px; object-fit:cover; margin-bottom:14px;}
.story-card h3{font-size:18px; line-height:1.32; margin-bottom:8px;}
.story-card p{font-size:13.5px; color:var(--ink-light);}
.story-card .meta-row{margin-top:12px;}

/* ---------- INTERVIEWS ---------- */
.interviews-section{background:var(--ink); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.scroll-row{display:flex; gap:22px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory;}
.scroll-row::-webkit-scrollbar{height:6px;}
.scroll-row::-webkit-scrollbar-thumb{background:var(--line);}
.interview-card{flex:0 0 300px; scroll-snap-align:start; background:rgba(238,240,230,0.03); border:1px solid var(--line);}
.thumb{position:relative; height:180px; overflow:hidden;}
.thumb img{width:100%; height:100%; object-fit:cover; transition:transform .4s;}
.interview-card:hover .thumb img, .video-card:hover .thumb img{transform:scale(1.06);}
.play-btn{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52px; height:52px; border-radius:50%; background:rgba(10,15,12,0.55); border:1.5px solid var(--green-bright); display:flex; align-items:center; justify-content:center;}
.play-btn::after{content:""; width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:13px solid var(--green-bright); margin-left:3px;}
.play-btn::before{content:""; position:absolute; inset:-8px; border-radius:50%; border:1px solid rgba(57,217,122,0.4); animation:pulse-ring 2.4s ease-out infinite;}
@keyframes pulse-ring{0%{transform:scale(0.9); opacity:0.9;}100%{transform:scale(1.35); opacity:0;}}
.duration-badge{position:absolute; bottom:8px; right:8px; background:rgba(10,15,12,0.85); font-family:'IBM Plex Mono',monospace; font-size:11px; padding:2px 7px;}
.virtual-badge{position:absolute; top:8px; left:8px; background:var(--gold); color:var(--black); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; padding:3px 7px;}
.virtual-badge.podcast{background:var(--green-bright);}
.interview-body{padding:16px;}
.interview-body h3{font-size:16px; margin-bottom:6px; line-height:1.3;}
.interview-body p{font-size:12.5px; color:var(--ink-light);}

/* ---------- VIDEOS ---------- */
.tabs{display:flex; gap:8px; margin-bottom:24px;}
.tab-btn{background:transparent; border:1px solid var(--line); color:var(--ink-light); padding:8px 18px; font-size:13px; cursor:pointer; font-family:'IBM Plex Mono',monospace;}
.tab-btn.active{background:var(--green-bright); color:var(--black); border-color:var(--green-bright); font-weight:600;}
.video-grid{display:grid; gap:22px; grid-template-columns:1fr;}
@media(min-width:640px){.video-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:960px){.video-grid{grid-template-columns:1fr 1fr 1fr;}}
.video-card{cursor:pointer;}
.video-card .thumb{height:170px;}
.video-card h4{font-size:14.5px; margin-top:10px; line-height:1.3;}
.video-hidden{display:none;}

/* ---------- SPLIT / SIDEBAR ---------- */
.split{display:grid; gap:32px; grid-template-columns:1fr;}
@media(min-width:940px){.split{grid-template-columns:2.2fr 1fr;}}
.sidebar-stack{display:flex; flex-direction:column; gap:24px;}
.newsletter-box{background:var(--green-deep); border:1px solid var(--line); padding:22px;}
.newsletter-box h4{font-size:17px; margin-bottom:8px;}
.newsletter-box p{font-size:13px; color:var(--ink-light); margin-bottom:14px;}
.newsletter-box form{display:flex; flex-direction:column; gap:10px;}
.newsletter-box input{padding:11px 12px; border:1px solid var(--line); background:rgba(0,0,0,0.2); color:var(--white); font-size:13.5px;}
.trending-list{border:1px solid var(--line); padding:18px;}
.trending-list ul{list-style:none;}
.trending-list li{display:flex; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:13.5px;}
.trending-list li:last-child{border-bottom:none;}
.trending-list .num{font-family:'IBM Plex Mono',monospace; color:var(--green-bright); font-weight:600;}

/* ---------- SINGLE POST ---------- */
.single-header{padding:44px 0 28px; border-bottom:1px solid var(--line);}
.single-header h1{font-size:clamp(28px,4vw,44px); line-height:1.15; margin-bottom:16px;}
.single-featured img{width:100%; max-height:460px; object-fit:cover; margin:28px 0;}
.entry-content{font-size:16px; line-height:1.75; color:var(--ink-light); max-width:760px;}
.entry-content p{margin-bottom:20px;}
.entry-content h2, .entry-content h3{color:var(--white); margin:32px 0 14px;}
.entry-content a{color:var(--green-bright); text-decoration:underline;}
.entry-content img{margin:20px 0;}
.video-embed{position:relative; padding-bottom:56.25%; height:0; overflow:hidden; margin:28px 0; max-width:760px;}
.video-embed iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.related-row{margin-top:48px; padding-top:32px; border-top:1px solid var(--line);}

/* ---------- FOOTER ---------- */
footer.site-footer{background:var(--ink); border-top:1px solid var(--line); padding:52px 0 24px; margin-top:40px;}
.footer-grid{display:grid; gap:36px; grid-template-columns:1fr; margin-bottom:36px;}
@media(min-width:800px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;}}
.site-footer h5{font-size:13px; text-transform:uppercase; letter-spacing:0.1em; color:var(--ink-light); margin-bottom:16px;}
.site-footer ul{list-style:none;}
.site-footer li{margin-bottom:10px; font-size:13.5px;}
.site-footer li a:hover{color:var(--green-bright);}
.socials{display:flex; gap:12px; margin-top:16px;}
.socials a{width:34px; height:34px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:13px;}
.socials a:hover{border-color:var(--green-bright); color:var(--green-bright);}
.footer-bottom{border-top:1px solid var(--line); padding-top:20px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:12px; color:var(--ink-light);}
.footer-links-fallback{display:flex; flex-direction:column; gap:10px; font-size:13.5px;}
.footer-links-fallback a:hover{color:var(--green-bright);}

/* ---------- ARCHIVE ---------- */
.archive-header{padding:44px 0 24px;}
.archive-header h1{font-size:clamp(26px,4vw,38px);}
.pagination{display:flex; gap:10px; margin-top:36px;}
.pagination a, .pagination span{border:1px solid var(--line); padding:8px 14px; font-size:13px;}
.pagination .current{background:var(--green-bright); color:var(--black); border-color:var(--green-bright);}