/* =========================================================
   News Portal — Editorial theme
   ========================================================= */
:root{
  --ink:#14181f;
  --paper:#f7f5ef;
  --paper-dim:#eeeae0;
  --rule:#d8d3c4;
  --red:#b6362c;
  --red-dark:#8e2a22;
  --steel:#2b4a6f;
  --muted:#6b6558;
  --serif: Georgia, 'Times New Roman', 'Source Serif Pro', serif;
  --sans: -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --radius: 2px;
}

*{box-sizing:border-box;}
html{scroll-padding-top:80px;}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{max-width:1180px;margin:0 auto;padding:0 20px;}

h1,h2,h3,h4{font-family:var(--serif);line-height:1.15;margin:0 0 .4em;}

/* ---------- Header / Masthead ---------- */
.site-header{
  background:var(--ink);
  color:var(--paper);
  border-bottom:4px solid var(--red);
  position:sticky;top:0;z-index:50;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;gap:20px;
}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:1.5rem;color:#fff;}
.logo-mark{font-size:1.3rem;}
.main-nav{display:flex;gap:22px;font-size:.92rem;letter-spacing:.02em;}
.main-nav a{opacity:.88;padding:6px 0;border-bottom:2px solid transparent;}
.main-nav a:hover{opacity:1;border-color:var(--red);}
.header-actions{display:flex;align-items:center;gap:12px;}
.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:1.4rem;cursor:pointer;}

.btn{display:inline-block;padding:9px 18px;border-radius:var(--radius);font-size:.9rem;cursor:pointer;border:1px solid transparent;font-weight:600;transition:background .15s ease,border-color .15s ease,transform .1s ease;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--red);color:#fff;border-color:var(--red);}
.btn-primary:hover{background:var(--red-dark);}
.btn-outline{border-color:rgba(255,255,255,.5);color:#fff;}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn-steel{background:var(--steel);color:#fff;}
.btn-danger{background:#a33;color:#fff;}
.btn-sm{padding:5px 12px;font-size:.8rem;}

/* ---------- Hero ---------- */
.hero{
  display:grid;grid-template-columns:1.3fr 1fr;gap:34px;
  padding:34px 0;border-bottom:1px solid var(--rule);
}
.hero-media img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.hero-eyebrow{color:var(--red);font-weight:700;font-size:.85rem;margin-bottom:8px;}
.hero h1{font-size:2.1rem;}
.hero-meta{color:var(--muted);font-size:.88rem;margin:10px 0 14px;}
.hero p{color:#3c382f;}
.hero-side{border-left:1px solid var(--rule);padding-left:28px;}
.hero-side h3{font-size:1rem;border-bottom:2px solid var(--ink);display:inline-block;padding-bottom:4px;margin-bottom:14px;}
.side-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule);}
.side-item:last-child{border-bottom:none;}
.side-item img{width:70px;height:52px;object-fit:cover;flex-shrink:0;}
.side-item h4{font-size:.95rem;margin:0 0 4px;}
.side-item span{font-size:.78rem;color:var(--muted);}

/* ---------- Section headings ---------- */
.section{padding:30px 0;}
.section-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:3px solid var(--ink);margin-bottom:20px;padding-bottom:6px;}
.section-head h2{font-size:1.4rem;}
.section-head a{font-size:.85rem;color:var(--red);font-weight:600;}

/* ---------- News list / grid ---------- */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.news-item > a:first-child{display:block;overflow:hidden;margin-bottom:10px;}
.news-item img{width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:0;transition:transform .35s ease;display:block;}
.news-item:hover img{transform:scale(1.06);}
.news-item h3 a:hover{color:var(--red);}
.news-item .cat-tag{color:var(--red);font-size:.75rem;font-weight:700;}
.news-item h3{font-size:1.08rem;margin:6px 0;}
.news-item p{color:var(--muted);font-size:.9rem;margin:0 0 6px;}
.news-item .meta{font-size:.78rem;color:#8a8474;}

.news-row{display:flex;gap:18px;padding:16px 0;border-bottom:1px solid var(--rule);}
.news-row img{width:180px;height:120px;object-fit:cover;flex-shrink:0;}
.news-row h3{font-size:1.1rem;margin:0 0 6px;}

/* ---------- Article page ---------- */
.article-head{padding:30px 0 10px;border-bottom:1px solid var(--rule);}
.article-head .cat-tag{color:var(--red);font-weight:700;font-size:.85rem;}
.article-head h1{font-size:2.2rem;margin:10px 0;}
.article-meta{color:var(--muted);font-size:.88rem;}
.article-image{margin:24px 0;}
.article-body{max-width:760px;font-size:1.08rem;line-height:1.75;color:#26241d;}
.article-body p{margin:0 0 1.1em;}

/* ---------- Journalist directory ---------- */
.filter-bar{display:flex;gap:12px;flex-wrap:wrap;padding:20px 0;border-bottom:1px solid var(--rule);margin-bottom:24px;}
.filter-bar input, .filter-bar select{padding:9px 12px;border:1px solid var(--rule);background:#fff;font-family:var(--sans);}
.filter-bar input{flex:1;min-width:200px;}

.journalist-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.j-card{border-top:3px solid var(--ink);padding-top:14px;transition:border-color .15s ease;}
.j-card:hover{border-top-color:var(--red);}
.j-card img{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:12px;filter:grayscale(15%);transition:filter .2s ease;}
.j-card:hover img{filter:grayscale(0%);}
.j-card h4{margin:0 0 2px;font-size:1.02rem;}
.j-card .role{color:var(--red);font-size:.8rem;font-weight:600;}
.j-card .dept{color:var(--muted);font-size:.82rem;margin:4px 0 10px;}

/* ---------- Journalist profile ---------- */
.profile-wrap{display:grid;grid-template-columns:260px 1fr;gap:40px;padding:34px 0;}
.profile-photo img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--rule);}
.profile-qr{text-align:center;margin-top:18px;padding-top:14px;border-top:1px solid var(--rule);}
.profile-qr img{margin:0 auto 8px;}
.profile-qr span{font-size:.78rem;color:var(--muted);}
.profile-name{font-size:1.9rem;}
.profile-role{color:var(--red);font-weight:600;margin-bottom:14px;}
.profile-detail{display:grid;grid-template-columns:130px 1fr;gap:6px 14px;font-size:.94rem;margin-bottom:20px;}
.profile-detail dt{color:var(--muted);}
.profile-social a{display:inline-block;margin-right:14px;font-size:.9rem;color:var(--steel);font-weight:600;}

/* ---------- Verification badge (QR view) ---------- */
.verify-box{max-width:420px;margin:60px auto;text-align:center;border:1px solid var(--rule);padding:34px;background:#fff;}
.verify-ok{color:#1c7c3c;font-size:1.3rem;font-weight:700;margin-bottom:6px;}
.verify-box img.avatar{width:96px;height:96px;object-fit:cover;border-radius:50%;margin:14px auto;}

/* ---------- Forms ---------- */
.form-card{background:#fff;border:1px solid var(--rule);padding:28px;max-width:520px;margin:40px auto;}
.form-card h2{text-align:center;}
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:.86rem;font-weight:600;margin-bottom:5px;}
.form-group input, .form-group select, .form-group textarea{
  width:100%;padding:10px 12px;border:1px solid var(--rule);font-family:var(--sans);font-size:.95rem;background:#fdfcfa;
}
.form-group textarea{resize:vertical;min-height:100px;}
.form-error{background:#fbe4e2;border:1px solid var(--red);color:var(--red-dark);padding:10px 14px;font-size:.88rem;margin-bottom:16px;}
.form-success{background:#e3f3e6;border:1px solid #1c7c3c;color:#1c5c30;padding:10px 14px;font-size:.88rem;margin-bottom:16px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:#cfcabf;margin-top:60px;padding:40px 0 0;}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px;padding-bottom:26px;}
.site-footer h3{color:#fff;font-size:1.2rem;}
.footer-links, .footer-social{display:flex;flex-direction:column;gap:8px;font-size:.9rem;}
.copyright{border-top:1px solid #333;padding:16px 20px;font-size:.8rem;text-align:center;color:#8a8474;}

/* ---------- Pagination ---------- */
.pagination{display:flex;gap:8px;justify-content:center;margin:30px 0;}
.pagination a, .pagination span{padding:8px 13px;border:1px solid var(--rule);font-size:.88rem;}
.pagination .active{background:var(--ink);color:#fff;border-color:var(--ink);}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .hero{grid-template-columns:1fr;}
  .hero-side{border-left:none;border-top:1px solid var(--rule);padding-left:0;padding-top:20px;}
  .news-grid{grid-template-columns:repeat(2,1fr);}
  .journalist-grid{grid-template-columns:repeat(2,1fr);}
  .profile-wrap{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr;}
}
@media (max-width: 640px){
  .main-nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--ink);flex-direction:column;padding:10px 20px;gap:0;border-bottom:3px solid var(--red);
  }
  .main-nav.open{display:flex;}
  .main-nav a{padding:10px 0;border-bottom:1px solid #2a2f38;}
  .nav-toggle{display:block;}
  .news-grid{grid-template-columns:1fr;}
  .journalist-grid{grid-template-columns:1fr;}
  .news-row{flex-direction:column;}
  .news-row img{width:100%;height:180px;}
}