/*
Theme Name: Counterpoint
Theme URI: https://counterpoint.id
Author: Counterpoint
Author URI: https://counterpoint.id
Description: Open Source Research for Justice — Counterpoint independent investigative collective theme.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: counterpoint
Tags: dark, investigative, journalism
*/

/* ── RESET ─────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth}
body{
  background:#0d0d0d;color:#e0e0e0;
  font-family:'Inter',sans-serif;font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
::-webkit-scrollbar{width:2px}
::-webkit-scrollbar-thumb{background:#2a2a2a}

:root{
  --line:rgba(255,255,255,0.09);
  --dim:rgba(255,255,255,0.45);
  --accent:#6ee7b7;
  --bg:#0d0d0d;
  --g:clamp(20px,5vw,80px);
}

/* ── CONTAINER ─────────────────────────── */
.wrap{
  max-width:1380px;
  margin:0 auto;
  padding:0 var(--g);
}

/* ── NAV ──────────────────────────────── */
#nav{
  position:sticky;top:0;z-index:200;
  background:#0d0d0d;
  border-bottom:1px solid var(--line);
}

.nav-bar{
  max-width:1380px;margin:0 auto;
  height:54px;
  display:flex;align-items:center;
  justify-content:space-between;
  padding:0 var(--g);
  border-bottom:1px solid var(--line);
}

.nav-ham{
  display:flex;flex-direction:column;gap:5px;
  cursor:pointer;width:22px;flex-shrink:0;
}
.nav-ham span{display:block;height:1.5px;background:#e0e0e0;transition:transform .2s,opacity .2s}
.nav-ham.open span:nth-child(1){transform:rotate(45deg) translate(4.5px,4.5px)}
.nav-ham.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-ham.open span:nth-child(3){transform:rotate(-45deg) translate(4.5px,-4.5px)}

.nav-logo{
  font-size:14px;font-weight:700;
  letter-spacing:0.13em;text-transform:uppercase;
  color:#fff;white-space:nowrap;
  flex-shrink:0;
}
.nav-logo span{font-weight:300}

.nav-desktop{display:none}
.nav-search-m{font-size:18px;cursor:pointer;color:var(--dim);line-height:1;flex-shrink:0}

/* ── Mobile secondary link row ── */
.nav-mobile-row{
  display:flex;align-items:center;
  padding:0 var(--g);
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  max-width:1380px;margin:0 auto;
}
.nav-mobile-row::-webkit-scrollbar{display:none}
.nav-mobile-row a{
  font-size:11px;font-weight:500;
  text-transform:uppercase;letter-spacing:0.07em;
  padding:10px 18px 10px 0;
  white-space:nowrap;flex-shrink:0;
  color:var(--dim);transition:color .15s;
}
.nav-mobile-row a:hover{color:#fff}
.nav-mobile-row a.active,
.nav-mobile-row a.current-menu-item{
  color:#fff;font-style:italic;font-weight:400;
  text-transform:none;letter-spacing:0;
  border-bottom:1px solid rgba(255,255,255,0.35);padding-bottom:8px;
}
.nav-mobile-row a.campaign{color:var(--accent);font-weight:600}

@media(min-width:901px){
  .nav-ham{display:none}
  .nav-search-m{display:none}

  .nav-desktop{
    display:flex;align-items:center;gap:30px;
  }
  .nav-desktop a{
    font-size:10.5px;font-weight:500;
    text-transform:uppercase;letter-spacing:0.08em;
    color:var(--dim);transition:color .15s;
    white-space:nowrap;
  }
  .nav-desktop a:hover{color:#fff}
  .nav-desktop a.active,
  .nav-desktop a.current-menu-item{
    color:#fff;font-style:italic;
    text-transform:none;letter-spacing:0;font-weight:400;font-size:12px;
    border-bottom:1px solid rgba(255,255,255,0.35);padding-bottom:1px;
  }
  .nav-desktop a.campaign{
    color:var(--accent);font-weight:600;font-style:normal;
    text-transform:uppercase;letter-spacing:0.07em;font-size:10px;
    display:flex;align-items:center;gap:6px;border:none;
  }
  .nav-desktop a.campaign::before{
    content:'';width:5px;height:5px;border-radius:50%;
    background:var(--accent);animation:blink 2s infinite;flex-shrink:0;
  }
  .nav-desktop-search{
    font-size:16px;cursor:pointer;color:var(--dim);
    transition:color .15s;line-height:1;
  }
  .nav-desktop-search:hover{color:#fff}
  .nav-mobile-row{display:none}
}

@media(max-width:900px){
  .nav-logo{
    position:absolute;left:50%;transform:translateX(-50%);
  }
  .nav-mobile-row{display:none}
  .nav-mobile-row.open{display:flex}
}

@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}

/* ── HERO ─────────────────────────────── */
.hero{
  padding:clamp(36px,7vw,96px) 0;
  border-bottom:1px solid var(--line);
}
.hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(32px,5vw,64px);
  align-items:start;
}
@media(min-width:901px){
  .hero-grid{grid-template-columns:1fr 300px}
}

.hero-eyebrow{
  font-size:9px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.14em;
  color:var(--accent);margin-bottom:18px;
  display:flex;align-items:center;gap:8px;
}
.hero-eyebrow::before{
  content:'';display:inline-block;
  width:18px;height:1px;background:var(--accent);
}

.hero-headline{
  font-size:clamp(32px,6vw,76px);
  font-weight:700;letter-spacing:-0.04em;
  line-height:0.97;color:#fff;
}
.hero-headline em{
  display:block;
  font-style:normal;font-weight:300;
  color:rgba(255,255,255,0.38);
}

.hero-desc{
  margin-top:clamp(20px,3vw,32px);
  font-size:clamp(12px,1.05vw,13.5px);
  font-weight:300;line-height:1.9;
  color:var(--dim);
  max-width:540px;
}

/* Stats box */
.hero-stats{border:1px solid var(--line)}
.hero-stat{
  padding:clamp(14px,2.5vw,24px);
  border-bottom:1px solid var(--line);
}
.hero-stat:last-child{border-bottom:none}
.hero-stat-n{
  font-size:clamp(28px,4vw,48px);
  font-weight:700;letter-spacing:-0.05em;
  color:#fff;line-height:1;
}
.hero-stat-l{
  font-size:9px;font-weight:600;
  text-transform:uppercase;letter-spacing:0.1em;
  color:rgba(255,255,255,0.2);
  margin-top:6px;
}

@media(max-width:900px){
  .hero-stats{
    display:grid;grid-template-columns:repeat(3,1fr);
  }
  .hero-stat{border-bottom:none;border-right:1px solid var(--line)}
  .hero-stat:last-child{border-right:none}
}

.hero-img{
  margin-top:clamp(24px,3vw,40px);
  border-top:1px solid var(--line);
  padding-top:clamp(24px,3vw,40px);
}
.hero-img img{
  width:100%;
  max-height:520px;
  object-fit:cover;
  display:block;
}

/* ── SECTION HEADER ──────────────────── */
.sec-hd{
  display:flex;align-items:center;gap:12px;
  padding:clamp(28px,4vw,44px) 0 clamp(18px,2.5vw,28px);
}
.sec-hd-label{
  font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.13em;
  color:var(--accent);white-space:nowrap;
}
.sec-hd-count{
  font-size:10px;color:rgba(255,255,255,0.18);
  letter-spacing:0.06em;
}
.sec-hd-line{flex:1;height:1px;background:var(--line)}

/* ── INVESTIGATION GRID ──────────────── */
.inv-list{
  display:grid;
  grid-template-columns:1fr;
  background:var(--line);
  gap:1px;
  outline:1px solid var(--line);
}
@media(min-width:740px){
  .inv-list{grid-template-columns:1fr 1fr}
}

.inv-card{
  background:#0d0d0d;
  display:flex;flex-direction:column;
  text-decoration:none;color:inherit;
  transition:background .2s;
  overflow:hidden;
}
.inv-card:hover{background:#111}

.inv-thumb{
  position:relative;overflow:hidden;
  aspect-ratio:16/9;
  flex-shrink:0;
  border-bottom:1px solid var(--line);
}
.inv-thumb-dark{
  background:linear-gradient(155deg,#1d1a15 0%,#090806 52%,#252018 100%);
}
.inv-thumb-dark::after{
  content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(
    0deg,
    transparent 0,transparent 3px,
    rgba(255,255,255,0.016) 3px,rgba(255,255,255,0.016) 4px
  );
}
.inv-thumb-mono{
  background:linear-gradient(135deg,#1f1f1f 0%,#141414 100%);
}
.inv-thumb::before{
  content:'';position:absolute;inset:0;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity:.5;mix-blend-mode:overlay;
}

.inv-thumb img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;z-index:2;
}

.inv-badge{
  position:absolute;top:14px;left:14px;z-index:3;
  font-size:7.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;
  background:var(--accent);color:#0d0d0d;padding:3px 9px;
}

.inv-id-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.inv-id{
  font-size:9px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.16em;
  color:rgba(255,255,255,0.18);
}
.inv-arrow{
  font-size:16px;line-height:1;
  color:rgba(255,255,255,0.1);
  transition:color .15s, transform .2s;
}
.inv-card:hover .inv-arrow{
  color:var(--accent);
  transform:translateX(4px);
}

.inv-title{
  padding:clamp(10px,1.5vw,14px) 16px clamp(10px,1.5vw,14px);
  font-size:clamp(13px,1.15vw,15px);
  font-weight:600;letter-spacing:-0.018em;
  line-height:1.28;color:#fff;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}

.inv-meta{
  display:grid;grid-template-columns:1fr 1fr;
  flex-shrink:0;
}
.inv-mc{
  padding:9px 14px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.inv-mc:nth-child(even){border-right:none}
.inv-mc:nth-child(n+3){border-bottom:none}
.inv-ml{
  font-size:7.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.1em;
  color:rgba(255,255,255,0.17);
  margin-bottom:3px;
}
.inv-mv{font-size:11px;font-weight:400;line-height:1.4;color:#d8d8d8}
.inv-mv.hi{color:var(--accent);font-weight:500}

.inv-desc{
  padding:clamp(10px,1.5vw,14px) 16px clamp(14px,2vw,20px);
  font-size:11.5px;font-weight:300;
  line-height:1.78;color:var(--dim);
  flex:1;
}

/* ── CAMPAIGN ─────────────────────────── */
.camp-box{
  border:1px solid var(--line);
  background:#0d0d0d;
}
.camp-hd{
  padding:13px 18px;
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.camp-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--accent);animation:blink 2s infinite;flex-shrink:0;
}
.camp-status{
  font-size:9px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.1em;color:var(--accent);
}
.camp-sep{font-size:9px;color:rgba(255,255,255,0.15)}
.camp-name{
  font-size:clamp(13px,1.4vw,16px);
  font-weight:700;letter-spacing:-0.01em;color:#fff;
}

.camp-body-grid{
  display:grid;grid-template-columns:1fr;
  border-bottom:1px solid var(--line);
}
@media(min-width:901px){
  .camp-body-grid{grid-template-columns:1fr 260px}
}
.camp-body{
  padding:clamp(14px,2vw,22px) 18px;
  font-size:12.5px;font-weight:300;line-height:1.88;color:var(--dim);
}
@media(min-width:901px){
  .camp-body{border-right:1px solid var(--line)}
}
.camp-stats-col{
  padding:0;
  display:flex;flex-direction:column;
}
@media(max-width:900px){
  .camp-stats-col{
    flex-direction:row;
    border-top:1px solid var(--line);
  }
}
.camp-stat{
  flex:1;padding:clamp(12px,2vw,20px) 18px;
  border-bottom:1px solid var(--line);
}
.camp-stat:last-child{border-bottom:none}
@media(max-width:900px){
  .camp-stat{border-bottom:none;border-right:1px solid var(--line)}
  .camp-stat:last-child{border-right:none}
}
.camp-stat-n{
  font-size:clamp(22px,2.8vw,34px);
  font-weight:700;color:#fff;letter-spacing:-0.04em;line-height:1;
}
.camp-stat-l{
  font-size:8.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.1em;color:rgba(255,255,255,0.18);margin-top:5px;
}
.camp-ft{
  padding:11px 18px;
  display:flex;align-items:center;gap:18px;
}
.camp-cta{
  font-size:11px;font-weight:500;color:var(--accent);
  border-bottom:1px solid rgba(110,231,183,0.3);
  padding-bottom:1px;transition:border-color .15s;
}
.camp-cta:hover{border-color:var(--accent)}
.camp-geo{font-size:10px;font-weight:300;color:rgba(255,255,255,0.18)}

/* ── ABOUT ────────────────────────────── */
.about-box{border:1px solid var(--line);background:#0d0d0d}
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.about-cell{padding:clamp(16px,2.5vw,28px)}
.about-cell:first-child{border-right:1px solid var(--line)}
.about-lbl{
  font-size:8px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.13em;
  color:rgba(255,255,255,0.18);margin-bottom:10px;
}

@media(max-width:600px){
  .about-grid{grid-template-columns:1fr}
  .about-cell:first-child{border-right:none;border-bottom:1px solid var(--line)}
}

/* ── FOOTER ───────────────────────────── */
footer{
  border-top:1px solid var(--line);
  margin-top:clamp(28px,5vw,56px);
  padding:clamp(12px,1.5vw,16px) var(--g);
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px;
  max-width:none;
}
.ft-inner{
  max-width:1380px;margin:0 auto;width:100%;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px;
}
.ft-logo{font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:#fff}
.ft-logo span{font-weight:300}
.ft-copy{font-size:10px;color:rgba(255,255,255,0.18)}
.ft-links{display:flex;gap:18px;flex-wrap:wrap}
.ft-links a{
  font-size:9px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.07em;color:rgba(255,255,255,0.2);transition:color .15s;
}
.ft-links a:hover{color:#fff}
@media(max-width:600px){
  .ft-inner{flex-direction:column;align-items:flex-start}
}

/* ── PAGE CONTENT ─────────────────────── */
.page-content{
  padding:clamp(36px,7vw,80px) 0;
}
.page-eyebrow{
  font-size:9px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.14em;
  color:var(--accent);margin-bottom:18px;
  display:flex;align-items:center;gap:8px;
}
.page-eyebrow::before{
  content:'';display:inline-block;
  width:18px;height:1px;background:var(--accent);
}
.page-title{
  font-size:clamp(28px,4.5vw,60px);
  font-weight:700;letter-spacing:-0.04em;
  line-height:1.0;color:#fff;
  margin-bottom:clamp(20px,3vw,36px);
}
.page-title em{
  display:block;
  font-style:normal;font-weight:300;
  color:rgba(255,255,255,0.38);
}
.page-body{
  font-size:clamp(13px,1.1vw,14.5px);font-weight:300;
  line-height:1.88;color:var(--dim);
  max-width:720px;
}
.page-body p{margin-bottom:1.5em}
.page-body h2{
  font-size:clamp(18px,2vw,24px);font-weight:600;
  color:#fff;letter-spacing:-0.02em;
  margin:clamp(24px,3.5vw,40px) 0 12px;
}
.page-body h3{
  font-size:clamp(14px,1.4vw,18px);font-weight:600;
  color:#fff;letter-spacing:-0.01em;
  margin:clamp(18px,2.5vw,28px) 0 10px;
}
.page-body a{
  color:var(--accent);
  border-bottom:1px solid rgba(110,231,183,0.3);
  transition:border-color .15s;
}
.page-body a:hover{border-color:var(--accent)}
.page-body ul,.page-body ol{
  padding-left:1.6em;margin-bottom:1.5em;
}
.page-body blockquote{
  border-left:2px solid var(--accent);
  padding:10px 20px;margin:24px 0;
  font-style:italic;color:rgba(255,255,255,0.5);
}

/* ── UTILS ────────────────────────────── */
.gap{padding-top:clamp(24px,4.5vw,56px)}
