/* The Fisher Hill Association — shared styles for all pages. */
:root{
  --brand:#c01a8f;        /* vivid magenta accent — links, buttons */
  --brand-deep:#9c1574;   /* deep magenta — sidebar, title blocks */
  --brand-press:#7a1059;
  --ink:#211522;
  --muted:#6b6068;
  --line:#ebe0e9;
  --soft:#fceaf6;
  --gold:#ffd400;          /* matches the map boundary */
  --cna:#d65f22;           /* WPCNA orange — non-Fisher-Hill items */
  --cna-press:#b34a1c;
  --cna-soft:#fdeee6;
}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; color:var(--ink); background:#fff;
  display:flex; min-height:100vh; -webkit-font-smoothing:antialiased;
}
a{ color:var(--brand); }

/* ── Sidebar ─────────────────────────────────────────────── */
.side{
  flex:0 0 288px; width:288px; background:var(--brand-deep); color:#fff;
  position:sticky; top:0; align-self:flex-start; height:100vh;
  display:flex; flex-direction:column; padding:34px 0 24px;
}
.side-brand{
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; font-size:34px; line-height:1.05;
  letter-spacing:-.01em; padding:0 30px 22px; margin:0; color:#fff; text-decoration:none;
}
.side-brand:hover{ opacity:.92; }
.side-rule{ height:2px; background:rgba(0,0,0,.55); margin:0 30px 10px; }
.side-nav{ display:flex; flex-direction:column; padding:10px 0; }
.side-nav a{
  color:#fff; text-decoration:none; font-size:20px; font-weight:500;
  padding:15px 30px; line-height:1.2; transition:background .12s;
  border-left:4px solid transparent;
}
.side-nav a:hover, .side-nav a:focus{ background:rgba(255,255,255,.10); }
.side-nav a.active{ background:rgba(0,0,0,.18); border-left-color:var(--gold); }
.side-foot{ margin-top:auto; padding:18px 30px 0; font-size:12px; color:rgba(255,255,255,.62); line-height:1.5; }

/* ── Content ─────────────────────────────────────────────── */
.main{ flex:1; min-width:0; }
.hero{ position:relative; height:67vh; min-height:340px; background:#0b0d10; }
.hero iframe{ width:100%; height:100%; border:0; display:block; }
.hero-chip{
  position:absolute; left:22px; bottom:18px; z-index:2; pointer-events:none;
  background:rgba(40,10,32,.72); color:#fff; backdrop-filter:blur(4px);
  font-size:13px; font-weight:600; padding:7px 13px; border-radius:999px;
}
.hero-chip b{ color:var(--gold); font-weight:700; }

/* Per-page hero image band — clean, full-bleed image (no overlay, no text) */
.page-hero{ position:relative; height:67vh; min-height:340px; background:#9c1574 50%/cover no-repeat; }
.page-hero-label{ position:absolute; right:clamp(18px,3vw,40px); bottom:clamp(18px,3vw,40px); z-index:2; background:var(--brand-deep); color:#fff;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; letter-spacing:-.01em; line-height:1.05;
  font-size:clamp(1.4rem,3vw,2.3rem); padding:16px clamp(20px,3vw,34px); max-width:85%; }

.wrap{ max-width:920px; padding:0 clamp(22px,5vw,56px); }
section{ padding:46px 0; border-bottom:1px solid var(--line); }
section:last-of-type{ border-bottom:0; }
.kicker{ color:var(--brand); font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:12px; margin:0 0 10px; }
h1.title{ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; font-size:clamp(2rem,4vw,2.9rem); line-height:1.05; letter-spacing:-.015em; margin:0 0 14px; }
h2{ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:700; font-size:clamp(1.5rem,3vw,2rem); line-height:1.12; margin:0 0 14px; letter-spacing:-.01em; }
h3{ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; }
p.lede{ font-size:clamp(16px,1.8vw,19px); line-height:1.65; color:#2b2330; margin:0 0 16px; max-width:65ch; }
p{ line-height:1.6; color:#352c41; max-width:65ch; }

.btn{
  display:inline-block; background:var(--brand); color:#fff; text-decoration:none;
  font-weight:600; font-size:15px; padding:12px 22px; border-radius:10px; transition:background .12s;
}
.btn:hover{ background:var(--brand-press); }
.btn.ghost{ background:transparent; color:var(--brand); border:1.5px solid var(--brand); }
.btn.ghost:hover{ background:var(--soft); }

.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-top:6px; }
.card{ border:1px solid var(--line); border-left:4px solid var(--brand); border-radius:10px; padding:18px 20px; background:#fff; text-decoration:none; color:inherit; display:block; transition:box-shadow .12s, transform .12s; }
.card:hover{ box-shadow:0 8px 24px rgba(156,21,116,.18); transform:translateY(-1px); }
.card h3{ margin:0 0 5px; font-size:17px; }
.card p{ margin:0; font-size:14px; color:var(--muted); }

.placeholder{ border:1px dashed var(--line); border-radius:10px; padding:22px 24px; background:var(--soft); color:var(--muted); font-size:15px; }

/* About-page history section */
.history .hist-credit{ font-size:14px; color:var(--muted); font-style:italic; margin:0 0 4px; }
.history h3{ font-weight:700; font-size:clamp(1.05rem,1.8vw,1.2rem); letter-spacing:-.005em; margin:30px 0 2px; color:var(--brand); }
.history h3:first-of-type{ margin-top:22px; }

.officers{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:8px; }
.officers li{ font-size:16px; }
.officers strong{ font-weight:600; }

/* Agenda mentions feed (live from fisher-hill-mentions.json) */
.mins{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:14px; }
.mins li{ border:1px solid var(--line); border-left:4px solid var(--brand); border-radius:10px; background:#fff; padding:16px 20px; }
.min-date{ display:block; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--brand); }
.mins p{ margin:6px 0 8px; font-size:15px; }
.mins a{ font-weight:600; font-size:13.5px; text-decoration:none; }
.mins a:hover{ text-decoration:underline; }

.foot{ padding:30px 0 50px; color:var(--muted); font-size:13px; }

/* ── Events / Posts feed (CNA-style cards) ───────────────── */
.feed-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0 0 18px; }
.feed-head h2{ margin:0; }
.feed-seeall{ font-weight:700; font-size:14px; color:var(--brand); text-decoration:none; white-space:nowrap; }
.feed-seeall:hover{ text-decoration:underline; }
.feed-note{ font-size:13.5px; color:var(--muted); margin:0 0 18px; }
.feed-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; }
.feed-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); transition:border-color .15s, transform .15s; }
.feed-card:hover{ border-color:var(--cna); transform:translateY(-2px); }
.feed-card-fh{ border-left:4px solid var(--brand); }
.feed-card-fh:hover{ border-color:var(--brand); }
.feed-body{ display:flex; flex-direction:column; flex:1; padding:20px 22px; }
.feed-top{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.feed-tag{ display:inline-block; padding:3px 9px; border:1px solid color-mix(in srgb, var(--cna) 20%, var(--line)); background:var(--cna-soft); color:var(--cna); font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.feed-card-fh .feed-tag{ border-color:color-mix(in srgb, var(--brand) 18%, var(--line)); background:var(--soft); color:var(--brand); }
.feed-tag-fh, .feed-card-fh .feed-tag-fh{ background:var(--brand); color:#fff; border-color:var(--brand); }
.feed-title{ margin:0 0 6px; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; line-height:1.22; font-size:clamp(1.15rem,1.8vw,1.4rem); letter-spacing:-.01em; }
.feed-date{ margin:0 0 6px; font-size:13.5px; font-weight:600; color:#4a4450; }
.feed-meta{ display:flex; flex-wrap:wrap; gap:2px 16px; font-size:13px; color:var(--muted); margin-bottom:10px; }
.feed-summary{ margin:0 0 16px; color:#3a333f; font-size:14.5px; line-height:1.5; flex:1; }
.feed-actions{ display:flex; align-items:center; gap:12px; margin-top:auto; }
.feed-btn{ display:inline-block; background:var(--cna); color:#fff; text-decoration:none; font-weight:800; font-size:12px; letter-spacing:.07em; text-transform:uppercase; padding:9px 15px; }
.feed-btn:hover{ background:var(--cna-press); }
.feed-card-fh .feed-btn{ background:var(--brand); }
.feed-card-fh .feed-btn:hover{ background:var(--brand-press); }
.feed-source{ font-size:12.5px; color:var(--muted); font-style:italic; }
.feed-empty{ color:var(--muted); }
.home-feed{ background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.home-feed .wrap{ padding-top:46px; padding-bottom:46px; }

/* About hero: full-width vintage postcard at natural height */
.about-hero-img{ display:block; width:100%; height:auto; }

/* Agenda archive: collapsible category sections (<details>) */
.agenda-cats{ display:grid; gap:14px; margin-top:6px; }
.agenda-cat{ border:1px solid var(--line); border-left:4px solid var(--brand); border-radius:10px; background:#fff; }
.agenda-cat summary{ list-style:none; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:16px 20px; cursor:pointer; border-radius:10px; }
.agenda-cat summary::-webkit-details-marker{ display:none; }
.agenda-cat summary::before{ content:"▸"; color:var(--brand); font-size:13px; }
.agenda-cat[open] > summary::before{ content:"▾"; }
.agenda-cat summary:hover{ background:var(--soft); }
.agenda-cat-title{ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; font-size:17px; }
.agenda-cat-sub{ font-size:13.5px; color:var(--muted); }
.doc-list{ list-style:none; margin:0; padding:4px 20px 18px 38px; display:grid; gap:9px; }
.doc-list li{ display:flex; align-items:baseline; gap:12px; font-size:15px; }
.doc-list li.placeholder{ display:block; }
.doc-year{ flex:0 0 auto; font-size:12px; font-weight:700; letter-spacing:.08em; color:var(--brand); }
.doc-list a{ font-weight:600; text-decoration:none; }
.doc-list a:hover{ text-decoration:underline; }
.doc-pending{ font-weight:600; color:var(--muted); }

/* Agenda document boxes (purple bottom bar) */
.agenda-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:16px; margin-top:6px; }
.agenda-box{ display:flex; flex-direction:column; justify-content:space-between; min-height:140px; background:#fff; border:1.5px solid #4a3f8f; text-decoration:none; color:var(--ink); transition:transform .12s, box-shadow .12s; }
.agenda-box:hover{ transform:translateY(-2px); box-shadow:0 7px 18px rgba(74,63,143,.22); }
.agenda-box-title{ padding:14px 14px 10px; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; font-size:15px; line-height:1.25; }
.agenda-box-bar{ height:14px; background:#564b9c; }

/* Language toggle (sidebar) */
.lang-toggle{ position:fixed; top:10px; right:12px; z-index:50; display:flex; gap:3px; padding:3px; background:var(--brand-deep); border-radius:7px; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.lang-btn{ padding:3px 9px; font:inherit; font-size:11px; font-weight:800; letter-spacing:.05em; color:#fff; background:transparent; border:0; border-radius:5px; cursor:pointer; }
.lang-btn:hover{ background:rgba(255,255,255,.16); }
.lang-btn.active{ background:#fff; color:var(--brand-deep); }

/* Contact form */
.cform{ max-width:560px; display:grid; gap:16px; margin-top:6px; }
.cform label{ display:block; font-size:13px; font-weight:700; color:var(--ink); margin-bottom:6px; }
.cform input, .cform textarea, .cform select{ width:100%; padding:11px 13px; border:1px solid var(--line); background:#fff; font:inherit; font-size:15px; color:var(--ink); border-radius:6px; }
.cform input:focus, .cform textarea:focus, .cform select:focus{ outline:2px solid var(--brand); outline-offset:1px; border-color:var(--brand); }
.hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.cform textarea{ min-height:130px; resize:vertical; }
.cform .btn{ justify-self:start; border:0; cursor:pointer; background:var(--brand); color:#fff; }
.cform .btn:hover{ background:var(--brand-press); }
.cform-note{ font-size:13px; color:var(--muted); margin:0; }
.cform-status{ font-size:14.5px; font-weight:700; color:var(--brand); margin:0; }
.cform-opt{ font-weight:400; color:var(--muted); }
.cform-group{ border:1px solid var(--line); border-radius:6px; padding:12px 14px; margin:0; display:grid; gap:9px; }
.cform-group legend{ font-size:13px; font-weight:700; color:var(--ink); padding:0 4px; }
.cform-radio{ display:flex; align-items:center; gap:9px; font-size:15px; font-weight:400; margin:0; cursor:pointer; }
.cform-radio input{ width:auto; margin:0; accent-color:var(--brand); }
.subhead{ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:800; font-size:clamp(1.15rem,2vw,1.4rem); letter-spacing:-.01em; margin:30px 0 8px; }
.rules{ margin:8px 0 0; padding-left:20px; display:grid; gap:6px; }
.rules li{ font-size:15.5px; line-height:1.5; color:#2b2330; }

/* Posting board: policy lists + submission form */
.policy-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:18px; margin:18px 0 30px; }
.policy-card{ border:1px solid var(--line); border-radius:10px; padding:20px 22px; background:#fff; }
.policy-card h3{ margin:0 0 12px; font-size:16px; }
.policy-yes{ border-top:4px solid #0a9d57; }
.policy-no{ border-top:4px solid #c0392b; }
.policy-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.policy-list li{ position:relative; padding-left:26px; font-size:14px; line-height:1.5; color:#352c41; }
.policy-yes .policy-list li::before{ content:"✓"; position:absolute; left:2px; color:#0a9d57; font-weight:800; }
.policy-no .policy-list li::before{ content:"✕"; position:absolute; left:2px; color:#c0392b; font-weight:800; }
.board-form .form-label{ display:block; font-size:13px; font-weight:700; color:var(--ink); margin-bottom:8px; }
.radio-row{ display:grid; gap:9px; }
.radio-row label, .cform label.check{ display:flex; gap:10px; align-items:flex-start; font-size:14px; font-weight:400; color:#352c41; line-height:1.45; cursor:pointer; margin:0; }
.cform input[type=checkbox], .cform input[type=radio]{ width:auto; margin:3px 0 0; flex:0 0 auto; }

/* ── Responsive: sidebar collapses to a top bar ──────────── */
@media (max-width:820px){
  body{ flex-direction:column; }
  .side{ flex-basis:auto; width:100%; height:auto; position:static; padding:22px 0 10px; }
  .side-brand{ font-size:27px; padding:0 22px 14px; }
  .side-rule{ margin:0 22px 6px; }
  .side-nav{ flex-direction:row; flex-wrap:wrap; padding:6px 12px; gap:2px; }
  .side-nav a{ font-size:16px; padding:9px 14px; border-left:0; border-radius:8px; }
  .side-nav a.active{ border-left:0; background:rgba(0,0,0,.22); }
  .side-foot{ display:none; }
  .hero{ height:58vh; min-height:260px; }
  .page-hero{ height:58vh; min-height:260px; }
  .lang-toggle{ top:8px; right:8px; }
}