/*
Theme Name: Victor Agina Editorial
Theme URI: https://victoragina.com.ng
Author: Victor Agina
Author URI: https://victoragina.com.ng
Description: A clean, responsive editorial theme for finance and online-income blogs. Serif headlines, category color-coding, trust-focused author blocks, and SEO-friendly semantic markup built in.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: victoragina
*/

:root{
  --ink:       #12182B;
  --paper:     #FFFFFF;
  --paper-2:   #F6F5F1;
  --line:      #E4E1D8;
  --muted:     #6E7280;
  --teal:      #2F6F5E;
  --gold:      #B8862E;
  --rust:      #A94B34;
  --focus:     #1F4FD8;

  --serif: "Source Serif 4", Georgia, serif;
  --sans:  "Inter", -apple-system, Segoe UI, sans-serif;
  --mono:  "JetBrains Mono", ui-monospace, monospace;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); line-height:1.55; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }

.wrap{ max-width:760px; margin:0 auto; padding:0 20px; }

/* ---------- Masthead ---------- */
.masthead{ border-bottom:1px solid var(--line); background:var(--paper); position:relative; z-index:30; }
.masthead-inner{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  max-width:1040px; margin:0 auto; padding:14px 20px;
}

/* Logo: hard-capped height fixes oversized/padded logo files */
.logo{
  font-family:var(--serif); font-weight:700; font-size:1.3rem; letter-spacing:-.01em;
  display:flex; align-items:center; height:36px; max-height:36px; flex-shrink:0; overflow:hidden;
}
.logo span{ color:var(--teal); }
.logo img,
.logo .site-logo-img{
  max-height:36px !important; height:36px !important; width:auto !important;
  object-fit:contain !important; display:block;
}

.menu-btn{
  width:38px; height:38px; border:1px solid var(--line); border-radius:8px;
  background:none; display:none; place-items:center; cursor:pointer; flex-shrink:0;
}
.menu-btn svg{ width:18px; height:18px; stroke:var(--ink); }

/* Nav: single row, dropdowns on hover/focus */
.nav-strip-wrap{ flex:1; min-width:0; }
.nav-strip{
  display:flex; align-items:center; gap:22px; list-style:none; margin:0; padding:0;
  overflow-x:auto; scrollbar-width:none;
}
.nav-strip::-webkit-scrollbar{ display:none; }
.nav-strip > li{ position:relative; flex-shrink:0; }
.nav-strip > li > a{
  display:block; font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;
  color:var(--muted); white-space:nowrap; padding:8px 0; border-bottom:2px solid transparent;
}
.nav-strip > li > a:hover,
.nav-strip > li.current-menu-item > a{ color:var(--ink); border-color:var(--teal); }

/* Sub-menus: hidden by default, shown as a dropdown card on hover/focus */
.nav-strip .sub-menu{
  display:none; position:absolute; top:100%; left:0; z-index:40;
  min-width:210px; margin:0; padding:8px 0; list-style:none;
  background:var(--paper); border:1px solid var(--line); border-radius:10px;
  box-shadow:0 12px 28px rgba(18,24,43,.10);
}
.nav-strip li:hover > .sub-menu,
.nav-strip li:focus-within > .sub-menu{ display:block; }
.nav-strip .sub-menu a{
  display:block; padding:9px 16px; font-size:.8rem; font-weight:500;
  text-transform:none; letter-spacing:0; color:var(--ink); border-bottom:none;
}
.nav-strip .sub-menu a:hover{ background:var(--paper-2); }
.nav-strip li.menu-item-has-children > a::after{ content:"▾"; margin-left:5px; font-size:.65em; opacity:.6; }

/* ---------- Mobile nav ---------- */
@media (max-width: 860px){
  .menu-btn{ display:grid; }
  .nav-strip-wrap{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--paper); border-bottom:1px solid var(--line);
    max-height:75vh; overflow-y:auto; padding:8px 20px 18px;
  }
  .nav-strip-wrap.is-open{ display:block; }
  .nav-strip{ flex-direction:column; align-items:flex-start; gap:0; overflow:visible; }
  .nav-strip > li{ width:100%; }
  .nav-strip > li > a{ padding:12px 0; border-bottom:1px solid var(--line); width:100%; }
  .nav-strip .sub-menu{
    display:block; position:static; box-shadow:none; border:none; border-radius:0;
    padding:0 0 4px 14px; background:none;
  }
  .nav-strip .sub-menu a{ padding:8px 0; color:var(--muted); }
  .nav-strip li.menu-item-has-children > a::after{ display:none; }
}

/* ---------- Ticker ---------- */
.ticker{
  background:var(--ink); color:var(--paper); font-family:var(--mono);
  font-size:.75rem; letter-spacing:.03em; padding:8px 20px; overflow:hidden;
  white-space:nowrap; text-overflow:ellipsis;
}
.ticker span{ opacity:.55; margin-right:6px; }

/* ---------- Featured post ---------- */
.featured{ padding:28px 0 8px; }
.featured .eyebrow{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  color:var(--teal); margin-bottom:12px;
}
.featured .eyebrow::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--teal); }
.featured h1, .featured h2.entry-title{
  font-family:var(--serif); font-size:clamp(1.6rem, 5vw, 2.3rem); line-height:1.15;
  font-weight:700; margin:0 0 14px; letter-spacing:-.01em;
}
.featured p.dek{ color:var(--muted); font-size:1rem; margin:0 0 16px; max-width:60ch; }
.featured .meta, .card .meta{
  display:flex; align-items:center; gap:10px; font-size:.8rem; color:var(--muted); flex-wrap:wrap;
}
.avatar{ width:22px; height:22px; border-radius:50%; background:var(--paper-2); border:1px solid var(--line); object-fit:cover; }
.featured img.hero{
  width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:10px; margin-top:18px;
  border:1px solid var(--line);
}

/* ---------- Feed ---------- */
.feed{ padding:8px 0 60px; }
.feed h2.section-label{
  font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em;
  color:var(--muted); margin:36px 0 16px; padding-top:24px; border-top:1px solid var(--line);
}

.card{
  display:grid; grid-template-columns:96px 1fr; gap:16px;
  padding:18px 0 18px 14px; margin-left:-17px; border-bottom:1px solid var(--line);
  border-left:3px solid var(--line);
}
.card img{ width:96px; height:96px; object-fit:cover; border-radius:8px; border:1px solid var(--line); }
.card .tag{
  display:inline-block; font-size:.68rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; padding:3px 8px; border-radius:99px; margin-bottom:6px; background:var(--paper-2); color:var(--muted);
}
.card.cat-forex{ border-left-color:var(--teal); }
.card.cat-forex .tag{ background:#EAF2EF; color:var(--teal); }
.card.cat-hustle{ border-left-color:var(--gold); }
.card.cat-hustle .tag{ background:#F7EFDF; color:var(--gold); }
.card.cat-caution{ border-left-color:var(--rust); }
.card.cat-caution .tag{ background:#F5E9E5; color:var(--rust); }

.card h3{ font-family:var(--serif); font-size:1.05rem; line-height:1.3; font-weight:600; margin:0 0 6px; letter-spacing:-.005em; }
.card p.excerpt{
  font-size:.85rem; color:var(--muted); margin:0 0 8px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card .meta{ font-size:.72rem; }

/* ---------- Single post ---------- */
.single-content{ font-size:1.02rem; padding:20px 0 10px; }
.single-content p{ margin:0 0 1.2em; }
.single-content h2{ font-family:var(--serif); margin:1.6em 0 .6em; }
.single-content img{ border-radius:10px; border:1px solid var(--line); margin:1em 0; }
.single-content blockquote{
  border-left:3px solid var(--teal); margin:1.5em 0; padding:.2em 0 .2em 1em; color:var(--muted); font-style:italic;
}

/* ---------- Author trust block ---------- */
.author-block{
  display:flex; gap:14px; align-items:flex-start; background:var(--paper-2);
  border:1px solid var(--line); border-radius:12px; padding:18px; margin:40px 0;
}
.author-block .avatar{ width:44px; height:44px; flex-shrink:0; }
.author-block h4{ margin:0 0 4px; font-family:var(--serif); font-size:1rem; }
.author-block p{ margin:0; font-size:.82rem; color:var(--muted); }

/* ---------- Pagination ---------- */
.pagination{ display:flex; gap:10px; padding:10px 0 40px; font-size:.85rem; }
.pagination a, .pagination span{ padding:6px 12px; border:1px solid var(--line); border-radius:6px; }

footer.site-footer{ border-top:1px solid var(--line); padding:28px 0 50px; font-size:.78rem; color:var(--muted); }
footer.site-footer a{ text-decoration:underline; }

@media (min-width:600px){
  .card{ grid-template-columns:140px 1fr; }
  .card img{ width:140px; height:140px; }
}

@media (prefers-reduced-motion: reduce){ *{ scroll-behavior:auto !important; } }