/* NotMyManatee palette v2 - loosely inspired by (not copied from) Gulf-coast blues/greens.
   The disclaimer banner stays bright yellow/black so it is always the most visible element. */
:root{
  --ink:#1c2a35;      /* body text */
  --slate:#2a4a5e;    /* primary: wordmark, headings, footer */
  --sea:#1b6f66;      /* secondary: links, active nav */
  --aqua:#8fdde6;     /* light accent on slate */
  --clay:#b0452a;     /* accent: example label, hover */
  --sand:#e9dfd0;     /* soft panel */
  --mist:#e3f1f2;     /* quote panel */
  --paper:#f5f2ec;    /* page background */
  --card:#ffffff;
  --muted:#4f5b64;
  --rule:#d5d9d6;
  --banner:#ffd84d;
  --violet:#5b4a8b;   /* Elections tag */
  --ochre:#7a5a1e;    /* Commentary tag */
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --serif:Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 var(--serif)}
.container{max-width:1180px;margin:0 auto;padding:0 20px}
a{color:var(--sea)}
a:hover{color:var(--clay)}
img{max-width:100%;height:auto;display:block}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Disclaimer banner: top + most visible */
.disclaimer-banner{background:var(--banner);color:#000;font:700 14px/1.45 var(--sans);padding:11px 0;border-bottom:3px solid #000;text-align:center}
.disclaimer-banner a,.disclaimer-banner a:hover{color:#000;text-decoration:underline}

/* Masthead */
.masthead{text-align:center;padding:10px 0 14px}
.masthead-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font:600 12px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--rule);padding-bottom:8px;margin-bottom:14px}
.brand{font:900 clamp(2.4rem,7vw,4.4rem)/1 var(--serif);color:var(--slate);text-decoration:none;letter-spacing:-.02em;text-transform:uppercase}
.brand:hover{color:var(--slate)}
.tagline{color:var(--muted);margin:.45em 0 0;font-style:italic;font-size:1rem}

/* Section nav */
.section-nav{border-top:3px double var(--slate);border-bottom:1px solid var(--slate);background:var(--paper);position:relative}
.section-nav::after{content:"";display:block;height:5px;background:linear-gradient(90deg,var(--slate) 0 40%,var(--sea) 40% 70%,var(--aqua) 70% 85%,var(--clay) 85% 100%)}
.section-nav ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center;flex-wrap:wrap}
.section-nav a{display:block;padding:11px 14px;color:var(--slate);text-decoration:none;font:700 13.5px var(--sans);text-transform:uppercase;letter-spacing:.06em;border-bottom:3px solid transparent}
.section-nav a[aria-current=page]{color:var(--sea);border-bottom-color:var(--sea)}
.section-nav a:hover{color:var(--clay);border-bottom-color:var(--clay)}
.nav-toggle{position:absolute;opacity:0;pointer-events:none}
.nav-toggle-label{display:none}

/* Layout */
main.container{padding-top:26px;padding-bottom:44px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:start}
.section-title{font:800 13px var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--slate);border-top:3px solid var(--slate);padding-top:8px;margin:34px 0 16px}
.section-head{font:900 2rem/1.1 var(--serif);color:var(--slate);border-bottom:3px solid var(--slate);padding-bottom:10px;margin:0 0 20px}
.kicker{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.cat-tag{display:inline-block;font:800 11px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:#fff;background:var(--slate);padding:3px 8px;border-radius:2px;text-decoration:none}
.cat-tag:hover{color:#fff;filter:brightness(1.15)}
.cat-county-commission{background:var(--slate)}.cat-budget-taxes{background:var(--sea)}.cat-development-growth{background:var(--clay)}.cat-elections{background:var(--violet)}.cat-commentary{background:var(--ochre)}
.label-example{display:inline-block;font:800 11px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:#000;background:var(--banner);border:1.5px solid #000;padding:2px 7px;border-radius:2px}
.meta{color:var(--muted);font:13px var(--sans);margin:.3em 0}
.byline{color:var(--muted);font:14px var(--sans);margin:.6em 0 0}
.byline strong{color:var(--ink)}
.dek{font-size:1.12rem;color:var(--muted);margin:.4em 0}

/* Media placeholders (used when a post has no image) */
.media-placeholder{display:flex;align-items:flex-end;padding:14px;text-decoration:none;color:#fff;font:800 13px var(--sans);text-transform:uppercase;letter-spacing:.1em}
.media-placeholder span{background:rgba(0,0,0,.35);padding:3px 8px;border-radius:2px}
.cat-bg-county-commission{background:linear-gradient(135deg,#2a4a5e,#41687f)}
.cat-bg-budget-taxes{background:linear-gradient(135deg,#1b6f66,#3c9a8e)}
.cat-bg-development-growth{background:linear-gradient(135deg,#b0452a,#d0784f)}
.cat-bg-elections{background:linear-gradient(135deg,#5b4a8b,#8a79b8)}
.cat-bg-commentary{background:linear-gradient(135deg,#7a5a1e,#b08a44)}

/* Lead story */
.lead{background:var(--card);border:1px solid var(--rule);display:grid;grid-template-columns:1.25fr 1fr}
.lead-media{min-height:300px;display:flex}
.lead-media img{width:100%;height:100%;object-fit:cover}
.lead-body{padding:22px 24px}
.lead h2{font:900 clamp(1.7rem,3.2vw,2.4rem)/1.12 var(--serif);margin:.15em 0 .25em}
.lead h2 a{color:var(--slate);text-decoration:none}
.lead h2 a:hover{color:var(--clay);text-decoration:underline}

/* Story cards grid */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--rule);display:flex;flex-direction:column}
.card-media{height:140px;display:flex;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover}
.card-body{padding:14px 16px 16px}
.card h3{font:800 1.2rem/1.25 var(--serif);margin:.2em 0}
.card h3 a{color:var(--slate);text-decoration:none}
.card h3 a:hover{color:var(--clay);text-decoration:underline}
.card .summary{margin:.4em 0 0;font-size:.95rem}
.grid-3 .card-media{height:100px}
.grid-3 .card h3{font-size:1.05rem}
.empty{color:var(--muted);font-family:var(--sans)}

/* Sidebar */
.sidebar{display:flex;flex-direction:column;gap:20px}
.box{background:var(--card);border:1px solid var(--rule);padding:16px 18px;font:14px/1.5 var(--sans)}
.box h2{font:800 13px var(--sans);text-transform:uppercase;letter-spacing:.1em;color:var(--slate);margin:0 0 10px}
.box p{margin:.5em 0}
.box-independent{border:2px solid #000;border-top:8px solid var(--banner)}
.box-independent h2{font-size:15px;letter-spacing:.02em;text-transform:none;color:#000}
.box-headlines ol{margin:0;padding:0;list-style:none;counter-reset:h}
.box-headlines li{counter-increment:h;padding:9px 0 9px 30px;border-top:1px solid var(--rule);position:relative}
.box-headlines li:first-child{border-top:0}
.box-headlines li::before{content:counter(h);position:absolute;left:0;top:7px;font:900 20px var(--serif);color:var(--sea)}
.box-headlines li a{font:700 15px/1.3 var(--serif);color:var(--slate);text-decoration:none;display:block}
.box-headlines li a:hover{color:var(--clay);text-decoration:underline}
.box-headlines .meta{display:block;font-size:12px}
.rss-link{font-size:13px;margin-bottom:0}

/* Article */
.article{min-width:0}
.article-header{border-bottom:1px solid var(--rule);padding-bottom:16px;margin-bottom:22px;max-width:70ch}
.article h1{font:900 clamp(1.9rem,4.4vw,2.9rem)/1.1 var(--serif);color:var(--slate);margin:.2em 0 .2em}
.article-image{margin:0 0 22px}
.article-image figcaption{font:13px var(--sans);color:var(--muted);margin-top:6px}
.content{max-width:68ch;font-size:1.08rem;line-height:1.7}
.content h2,.content h3{color:var(--slate);font-family:var(--serif)}
.content h2{margin-top:1.6em}
.content blockquote{margin:1.2em 0;padding:10px 16px;background:var(--mist);border-left:5px solid var(--slate)}
.content blockquote p{margin:.3em 0}
.content table{border-collapse:collapse;font:15px var(--sans);margin:1em 0}
.content th,.content td{border:1px solid var(--rule);padding:6px 10px;text-align:left}
.content th{background:var(--sand)}
.post-disclaimer{max-width:68ch;margin:32px 0 16px;padding:12px 16px;border:1px solid var(--rule);border-left:5px solid var(--slate);background:#fff;font:14px/1.5 var(--sans);color:var(--muted)}
.related{margin-top:10px}

/* Footer */
.site-footer{background:var(--slate);color:#fff;padding:28px 0 40px;font:14px/1.55 var(--sans);border-top:6px solid var(--sea)}
.site-footer a{color:var(--aqua)}
.site-footer a:hover{color:#fff}
.footer-disclaimer{background:#fff;color:var(--ink);padding:12px 16px;border-radius:4px;border-left:6px solid var(--banner);max-width:900px}
.footer-disclaimer a{color:var(--sea)}
.footer-disclaimer a:hover{color:var(--clay)}
.copy{font-size:13px;color:#dbe7ea}

/* Responsive */
@media (max-width:960px){
  .layout{grid-template-columns:minmax(0,1fr)}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .lead{grid-template-columns:1fr}
  .lead-media{min-height:180px}
  .nav-toggle-label{display:block;padding:11px 0;font:800 14px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--slate);cursor:pointer}
  .section-nav ul{display:none;flex-direction:column}
  .nav-toggle:checked ~ ul{display:flex}
  .nav-toggle:focus-visible + .nav-toggle-label{outline:3px solid var(--sea)}
  .section-nav a{padding:10px 0;border-bottom:1px solid var(--rule)}
}
@media (max-width:560px){
  body{font-size:16px}
  .disclaimer-banner{font-size:13px;text-align:left}
  .grid,.grid-3{grid-template-columns:1fr}
  .masthead-top{justify-content:center}
  .edition{display:none}
}
