/* Charleston Wire — clean, text-forward newspaper styling */
:root{
  --ink:#141414; --ink2:#4b4b4b; --ink3:#8a8a8a;
  --paper:#ffffff; --wash:#f7f6f3; --line:#e3e1dc; --line2:#c9c6bf;
  --indigo:#0a2e5c; --indigo-deep:#071f40; --gold:#c9a227; --navy:#0a2e5c; --amber:#9a6a12;
  --serif:Georgia,'Iowan Old Style','Times New Roman',serif;
  --sans:-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}

/* masthead */
.topbar{border-bottom:1px solid var(--line);font-size:12px;color:var(--ink2)}
.topbar .wrap{display:flex;justify-content:space-between;padding-top:7px;padding-bottom:7px}
.masthead-band{background:linear-gradient(180deg,#0d3565,var(--indigo-deep));border-bottom:3px solid var(--gold)}
.masthead{text-align:center;padding:22px 0 18px}
.flagmark{display:block;margin:0 auto 6px}
.masthead h1{font-family:var(--serif);font-size:clamp(34px,6vw,58px);letter-spacing:.5px;margin:0;font-weight:700;color:#fff}
.masthead h1 .wire{color:var(--gold)}
.masthead .tag{font-size:13px;color:#c7d5ea;margin-top:5px}
.navstrip{border-bottom:2px solid var(--indigo);margin-top:0}
.navstrip .wrap{display:flex;gap:22px;justify-content:center;padding-top:8px;padding-bottom:8px;font-size:12.5px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;flex-wrap:wrap}
.navstrip a{text-decoration:none}
.navstrip a:hover{color:var(--indigo)}

/* hero */
.hero{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;padding:26px 0 22px;border-bottom:1px solid var(--line)}
.kicker{font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--indigo)}
.hero h2{font-family:var(--serif);font-size:clamp(30px,4.4vw,50px);line-height:1.08;margin:8px 0 10px;font-weight:700}
.hero h2 a{text-decoration:none}
.hero h2 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.hero .desc{font-size:16.5px;line-height:1.55;color:var(--ink2);font-family:var(--serif)}
.hero img{width:100%;height:100%;max-height:340px;object-fit:cover;display:block;border:1px solid var(--line)}
.meta{font-size:12.5px;color:var(--ink3);margin-top:10px}
.meta b{color:var(--ink2);font-weight:600}
.tag-latest{display:inline-block;background:var(--indigo);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:1px;padding:2px 7px;border-radius:2px;vertical-align:2px;margin-right:7px}

/* columns */
.cols{display:grid;grid-template-columns:1fr 1fr 340px;gap:30px;padding:24px 0 8px}
.colhead{font-family:var(--serif);font-size:19px;font-weight:700;border-bottom:2px solid var(--ink);padding-bottom:6px;margin:0 0 4px}
.subhead{font-size:11.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--navy);margin:18px 0 2px}
.story{display:flex;gap:13px;padding:12px 0;border-bottom:1px solid var(--line)}
.story img{width:86px;height:64px;object-fit:cover;flex:none;border:1px solid var(--line)}
.story h3{font-family:var(--serif);font-size:16.5px;line-height:1.28;margin:0 0 4px;font-weight:700}
.story h3 a{text-decoration:none}
.story h3 a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.story p{font-size:13.5px;line-height:1.45;color:var(--ink2);margin:0}
.rail{background:var(--wash);padding:16px 16px 8px;border:1px solid var(--line);align-self:start}
.rail .colhead{border-bottom-color:var(--gold)}
.rail .story{padding:10px 0}
.rail .story img{width:60px;height:46px}
.rail .story h3{font-size:14.5px}
.rail .story p{display:none}
.empty{color:var(--ink3);font-size:14px;padding:14px 0}
.why{font-size:13.5px;line-height:1.45;color:var(--indigo);margin:5px 0 0;font-family:var(--serif);font-style:italic}
.why b{font-style:normal}
.prio-chip{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#fff;background:var(--gold);border-radius:3px;padding:2px 7px}
.tipband{border-top:3px solid var(--gold);background:var(--wash);margin-top:30px;padding:22px 0 26px}
.tipband h2{font-family:var(--serif);font-size:22px;margin:0 0 6px;color:var(--indigo-deep)}
.tipband p{font-size:14px;color:var(--ink2);line-height:1.55;max-width:640px;margin:0 0 12px}
.tipband textarea{width:100%;font-size:14.5px;padding:10px;border:1px solid var(--line2);border-radius:6px;font-family:var(--sans)}
.tiprow{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.tiprow input{flex:1;min-width:170px;font-size:14px;padding:9px 10px;border:1px solid var(--line2);border-radius:6px}
.tiprow button{background:var(--indigo);color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:700;padding:10px 20px;cursor:pointer}
.tiprow button:hover{background:var(--indigo-deep)}
footer{border-top:3px double var(--indigo);margin-top:26px;padding:16px 0 30px;font-size:12.5px;color:var(--ink2);line-height:1.6}
@media (max-width:900px){
  .hero{grid-template-columns:1fr}
  .cols{grid-template-columns:1fr}
}

/* ---------------- admin ---------------- */
.adminbar{background:var(--indigo-deep);color:#fff}
.adminbar .wrap{display:flex;align-items:center;gap:16px;padding-top:12px;padding-bottom:12px}
.adminbar .brand{font-family:var(--serif);font-size:20px;font-weight:700}
.adminbar .brand span{color:var(--gold)}
.adminbar button,.btn{background:#fff;color:var(--ink);border:1px solid var(--line2);border-radius:6px;font-size:13.5px;font-weight:600;padding:8px 14px;cursor:pointer}
.adminbar button:hover{background:var(--wash)}
.tabs{display:flex;gap:8px;margin:18px 0 6px}
.tabs button{border:1px solid var(--line2);background:#fff;border-radius:999px;padding:7px 16px;font-size:13.5px;font-weight:600;cursor:pointer}
.tabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pcard{display:flex;gap:16px;border:1px solid var(--line);border-radius:10px;padding:14px;margin:12px 0;background:#fff}
.pcard img{width:150px;height:104px;object-fit:cover;border:1px solid var(--line);border-radius:6px;flex:none}
.pcard .main{flex:1;min-width:0}
.srcchip{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--navy);background:#eef2f7;border-radius:3px;padding:2px 7px}
.pcard h3{font-family:var(--serif);font-size:18px;margin:7px 0 4px;line-height:1.3}
.pcard h3 a{text-decoration:none}
.pcard h3 a:hover{text-decoration:underline}
.pcard p{font-size:13.5px;color:var(--ink2);line-height:1.5;margin:0 0 6px}
.editor{border-top:1px dashed var(--line2);margin-top:10px;padding-top:10px;display:grid;gap:8px}
.editor label{font-size:11.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--ink2)}
.editor input[type=text]{width:100%;font-size:15px;padding:9px 10px;border:1px solid var(--line2);border-radius:6px;font-family:var(--serif)}
.editor .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.editor select{font-size:14px;padding:8px;border:1px solid var(--line2);border-radius:6px;background:#fff}
.approve{background:var(--indigo);color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:700;padding:9px 18px;cursor:pointer}
.approve:hover{background:var(--indigo-deep)}
.discard{background:#fff;color:var(--ink2);border:1px solid var(--line2);border-radius:6px;font-size:13.5px;font-weight:600;padding:9px 14px;cursor:pointer}
.discard:hover{color:var(--indigo);border-color:var(--indigo)}
.herolab{font-size:13.5px;display:flex;gap:6px;align-items:center;color:var(--ink2)}
.pubrow{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin:8px 0}
.pubrow .grow{flex:1;min-width:0}
.pubrow h4{margin:0;font-family:var(--serif);font-size:15.5px}
.herobadge{background:var(--amber);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.8px;border-radius:3px;padding:2px 6px}
.note{font-size:13px;color:var(--ink2);background:var(--wash);border:1px solid var(--line);border-radius:8px;padding:10px 14px;line-height:1.55}
@media (max-width:700px){ .pcard{flex-direction:column} .pcard img{width:100%;height:150px} }

.tipconfirm{display:block;margin-top:10px;font-size:13px;line-height:1.45;color:var(--ink2);cursor:pointer}
.tipconfirm input{margin-right:7px}
.legalfoot{margin-top:10px}
.legalpage h2{font-family:var(--serif);margin:26px 0 8px}
.legalpage p,.legalpage li{line-height:1.6;color:var(--ink2)}
