@charset "utf-8";
:root {
  --bg: #f5f7fb;
  --card: rgba(255,255,255,0.92);
  --text: #1f2937;
  --muted: #6b7280;
  --line: #e5e7eb;
  --shadow: 0 14px 40px rgba(26,39,68,0.12);
  --radius: 24px;
  --blue:   linear-gradient(135deg,#dbeafe,#bfdbfe);
  --green:  linear-gradient(135deg,#dcfce7,#bbf7d0);
  --gold:   linear-gradient(135deg,#fef3c7,#fde68a);
  --pink:   linear-gradient(135deg,#fce7f3,#fbcfe8);
  --purple: linear-gradient(135deg,#ede9fe,#ddd6fe);
  --teal:   linear-gradient(135deg,#ccfbf1,#99f6e4);
  --orange: linear-gradient(135deg,#ffedd5,#fed7aa);
  --red:    linear-gradient(135deg,#fee2e2,#fecaca);
  --nav: rgba(17,24,39,0.88);
  --nav-text: #f9fafb;
  --white-pill: rgba(255,255,255,0.82);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:Inter,Arial,Helvetica,sans-serif;
  background:
    radial-gradient(circle at top left,rgba(191,219,254,0.75),transparent 32%),
    radial-gradient(circle at top right,rgba(251,207,232,0.65),transparent 28%),
    radial-gradient(circle at bottom left,rgba(187,247,208,0.55),transparent 28%),
    var(--bg);
  color:var(--text);line-height:1.55;
}
.top-image-wrap{width:100%;}
.top-image{width:100%;max-height:420px;object-fit:cover;display:block;box-shadow:0 10px 30px rgba(26,39,68,0.12);}
.banner{width:min(1100px,100% - 24px);margin:16px auto 0;padding:14px 18px;border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,0.96),rgba(255,255,255,0.82));border:1px solid rgba(255,255,255,0.9);box-shadow:var(--shadow);font-weight:700;display:none;}
.banner.show{display:block;text-align:center;}

/* Popup */
.popup-overlay{position:fixed;inset:0;background:rgba(214,223,235,0.58);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:18px;z-index:3000;}
.popup-overlay.active{display:flex;}
.popup-card{width:min(680px,100%);background:linear-gradient(135deg,rgba(255,255,255,0.98),rgba(253,244,255,0.94));border:1px solid rgba(255,255,255,0.95);box-shadow:0 20px 50px rgba(31,41,55,0.16);border-radius:32px;padding:26px 22px;text-align:left;}
.popup-card h2{margin:0 0 10px;font-size:clamp(1.5rem,3vw,2rem);}
.popup-card p{margin:10px 0;color:#374151;font-size:1rem;}
.popup-badge{display:inline-block;margin-bottom:12px;padding:7px 12px;border-radius:999px;background:linear-gradient(135deg,#fce7f3,#ddd6fe);color:#6b21a8;font-weight:700;font-size:0.85rem;}
.popup-btn{margin-top:16px;border:0;background:linear-gradient(135deg,#c4b5fd,#f9a8d4);color:#1f2937;font-weight:800;font-size:1.02rem;border-radius:999px;padding:16px 22px;min-width:240px;cursor:pointer;box-shadow:0 14px 28px rgba(168,85,247,0.18);}

.wrap{width:min(1100px,100% - 24px);margin:0 auto;padding:18px 0 220px;}

/* Hero */
.hero{background:linear-gradient(135deg,rgba(255,255,255,0.92),rgba(255,255,255,0.78));border:1px solid rgba(255,255,255,0.8);border-radius:30px;box-shadow:var(--shadow);padding:28px 20px 22px;position:relative;overflow:hidden;margin-top:10px;}
.hero::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;background:linear-gradient(135deg,rgba(191,219,254,0.55),rgba(249,168,212,0.35));border-radius:50%;filter:blur(6px);}
.top-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;position:relative;z-index:1;flex-wrap:wrap;}
.lang-wrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.lang-btn{border:1px solid rgba(229,231,235,0.9);background:var(--white-pill);color:#111827;padding:9px 12px;border-radius:999px;font-weight:700;cursor:pointer;box-shadow:0 8px 18px rgba(17,24,39,0.08);min-width:70px;display:inline-flex;align-items:center;justify-content:center;gap:6px;}
.lang-btn.active{outline:rgba(191,219,254,0.9) solid 2px;}
h1{margin:0;font-size:clamp(1.8rem,4vw,3rem);line-height:1.1;letter-spacing:-0.02em;position:relative;z-index:1;}
.subtitle{margin:10px 0 0;color:var(--muted);font-size:1rem;max-width:760px;position:relative;z-index:1;}
.meeting-date{margin-top:10px;display:inline-block;padding:8px 12px;background:rgba(255,255,255,0.8);border:1px solid rgba(229,231,235,0.9);border-radius:999px;color:#374151;font-size:0.92rem;position:relative;z-index:1;}
.top-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px;position:relative;z-index:1;}
.mini{background:rgba(255,255,255,0.7);border:1px solid rgba(229,231,235,0.9);border-radius:20px;padding:14px;backdrop-filter:blur(6px);}
.mini strong{display:block;margin-bottom:5px;font-size:0.96rem;}
.mini span{color:var(--muted);font-size:0.92rem;}
.download-row{margin-top:16px;position:relative;z-index:1;}
.download-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;background:rgba(17,24,39,0.92);color:#fff;padding:12px 16px;border-radius:999px;font-weight:700;box-shadow:0 12px 26px rgba(17,24,39,0.16);}

/* Search bar */
.search-wrap{margin-top:14px;position:relative;z-index:1;}
.search-input{width:100%;padding:13px 18px 13px 46px;border-radius:999px;border:1px solid rgba(229,231,235,0.9);background:rgba(255,255,255,0.9);font-size:1rem;font-family:inherit;color:var(--text);box-shadow:0 8px 20px rgba(17,24,39,0.08);outline:none;}
.search-input:focus{outline:2px solid rgba(191,219,254,0.9);}
.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:1.1rem;pointer-events:none;}
.search-clear{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:rgba(107,114,128,0.15);border:none;border-radius:999px;width:26px;height:26px;cursor:pointer;font-size:0.9rem;display:none;align-items:center;justify-content:center;color:var(--muted);}
.search-clear.visible{display:flex;}
.search-results-info{margin-top:8px;font-size:0.88rem;color:var(--muted);padding-left:4px;min-height:20px;}
.highlight{background:rgba(253,224,71,0.55);border-radius:3px;padding:0 1px;}

/* Meeting tabs */
.meeting-tabs{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap;position:relative;z-index:1;}
.tab-btn{padding:10px 18px;border-radius:999px;border:1px solid rgba(229,231,235,0.9);background:var(--white-pill);font-weight:700;font-size:0.92rem;cursor:pointer;color:var(--text);box-shadow:0 6px 14px rgba(17,24,39,0.07);transition:all .2s;}
.tab-btn.active{background:rgba(17,24,39,0.9);color:#fff;box-shadow:0 10px 22px rgba(17,24,39,0.2);}

/* Meeting blocks */
.meeting-block{display:none;}
.meeting-block.active{display:block;}

/* Group toggle */
.group-toggle-wrap{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1;}
.group-toggle-btn{padding:8px 16px;border-radius:999px;border:1px solid rgba(229,231,235,0.9);background:var(--white-pill);font-size:0.85rem;font-weight:600;cursor:pointer;color:var(--muted);box-shadow:0 4px 10px rgba(17,24,39,0.06);transition:all .2s;}
.group-toggle-btn.active{background:rgba(191,219,254,0.7);color:#1d4ed8;border-color:rgba(191,219,254,0.9);}

/* Sections */
.section{scroll-margin-top:88px;margin-top:18px;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid rgba(255,255,255,0.85);background:var(--card);transition:opacity .2s;}
.section.hidden-section{display:none;}
.section-head{padding:18px 18px 10px;}
.section h2{margin:0;font-size:clamp(1.2rem,2.5vw,1.6rem);}
.section-body{padding:0 18px 18px;}
.box{border-radius:18px;padding:14px;margin-top:12px;border:1px solid rgba(255,255,255,0.8);box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;}
.box h3{margin:0 0 8px;font-size:1rem;}
.box p,.box li{margin:0;color:#243042;font-size:0.97rem;}
.box+.box{margin-top:10px;}
ul.clean{margin:8px 0 0;padding-left:18px;}
.badge-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.badge{background:rgba(255,255,255,0.7);border:1px solid rgba(255,255,255,0.95);padding:7px 10px;border-radius:999px;font-size:0.85rem;color:#334155;}

/* Color classes */
.blue{background:var(--blue);}
.green{background:var(--green);}
.gold{background:var(--gold);}
.pink{background:var(--pink);}
.purple{background:var(--purple);}
.teal{background:var(--teal);}
.orange{background:var(--orange);}
.red{background:var(--red);}

/* Notice links */
.notice-links{margin-top:26px;border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,0.96),rgba(255,255,255,0.84));box-shadow:var(--shadow);border:1px solid rgba(255,255,255,0.9);padding:22px 18px 28px;}
.notice-links h2{margin:0 0 8px;font-size:clamp(1.2rem,2.5vw,1.6rem);}
.notice-links p{margin:0 0 10px;color:#374151;}
.link-card{margin-top:12px;padding:14px;border-radius:18px;background:rgba(255,255,255,0.82);border:1px solid rgba(229,231,235,0.9);overflow-wrap:anywhere;}
.link-card a{color:#1d4ed8;text-decoration:none;font-weight:600;}

/* Section label chip (shows which meeting) */
.meeting-chip{display:inline-block;font-size:0.74rem;font-weight:700;padding:3px 9px;border-radius:999px;margin-left:10px;vertical-align:middle;background:rgba(255,255,255,0.6);color:#6b7280;border:1px solid rgba(229,231,235,0.8);}

/* Float nav */
.float-nav{position:fixed;right:12px;bottom:12px;display:flex;flex-direction:column;gap:10px;z-index:1000;max-width:calc(100vw - 24px);}
.float-nav a{text-decoration:none;color:var(--nav-text);background:var(--nav);padding:11px 14px;border-radius:999px;box-shadow:0 12px 25px rgba(17,24,39,0.22);font-size:0.88rem;font-weight:600;backdrop-filter:blur(8px);text-align:center;}
.top-link{position:fixed;left:12px;bottom:12px;z-index:1000;text-decoration:none;background:rgba(255,255,255,0.9);color:#111827;border:1px solid rgba(229,231,235,0.9);box-shadow:0 12px 25px rgba(17,24,39,0.12);padding:11px 14px;border-radius:999px;font-weight:700;font-size:0.9rem;backdrop-filter:blur(8px);}

/* Compact mobile nav (Subjects button + current-section pill) */
.compact-nav-row{display:none;position:fixed;left:12px;bottom:12px;z-index:1001;gap:8px;align-items:center;max-width:calc(100vw - 24px);}
.subjects-btn{flex-shrink:0;text-decoration:none;color:var(--nav-text);background:var(--nav);padding:11px 16px;border-radius:999px;box-shadow:0 12px 25px rgba(17,24,39,0.22);font-size:0.88rem;font-weight:700;backdrop-filter:blur(8px);border:none;cursor:pointer;white-space:nowrap;}
.current-section-btn{text-decoration:none;color:#1f2937;background:rgba(255,255,255,0.92);padding:11px 14px;border-radius:999px;box-shadow:0 12px 25px rgba(17,24,39,0.16);font-size:0.85rem;font-weight:700;backdrop-filter:blur(8px);border:1px solid rgba(229,231,235,0.9);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw;display:none;}
.current-section-btn.show{display:block;}
.footer{margin-top:20px;padding:20px;text-align:center;color:var(--muted);font-size:0.9rem;}

/* No results */
.no-results{text-align:center;padding:40px 20px;color:var(--muted);font-size:1rem;display:none;}
.no-results.show{display:block;}

@media(max-width:760px){
  .wrap{width:min(100% - 14px,1000px);padding-bottom:250px;}
  .hero{padding:22px 14px 18px;border-radius:24px;}
  .top-grid{grid-template-columns:1fr;}
  .section-head,.section-body{padding-left:14px;padding-right:14px;}
  .top-link{left:auto;right:10px;bottom:10px;}
  .popup-card{padding:22px 16px;border-radius:24px;}
  .popup-btn{width:100%;min-width:0;}

  /* Many-links mode: hide the big grid, show compact pills instead */
  .float-nav.many-links{display:none;}
  .float-nav.many-links.expanded{display:grid;grid-template-columns:repeat(2,1fr);right:10px;left:10px;bottom:70px;max-height:60vh;overflow-y:auto;padding:10px;background:rgba(17,24,39,0.92);border-radius:20px;box-shadow:0 16px 36px rgba(17,24,39,0.3);}
  .float-nav.many-links.expanded a{padding:11px 10px;font-size:0.84rem;}
  .compact-nav-row.many-links{display:flex;}

  /* Few-links mode (<=4): keep old behavior, full grid always visible */
  .float-nav:not(.many-links){right:10px;left:10px;bottom:10px;display:grid;grid-template-columns:repeat(2,1fr);}
  .float-nav:not(.many-links) a{padding:11px 10px;font-size:0.84rem;}
}

/* ── Sprint 2B additions: floating nav grouped by meeting date ─────────────
   Everything above this line is the original Version 2 stylesheet. */
.float-nav .float-nav-heading {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 7px 6px 2px;
  margin-top: 2px;
  border-top: 1px solid var(--line);
}
.float-nav .float-nav-heading:first-child {
  border-top: none;
  margin-top: 0;
}
/* inside the expanded mobile Subjects popup grid, headings take a full row */
.float-nav.many-links.expanded .float-nav-heading {
  grid-column: 1 / -1;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}
.float-nav.many-links.expanded .float-nav-heading:first-child {
  border-top: none;
  padding-top: 2px;
}
@media (max-width: 760px) {
  /* dark popup: lighter heading text */
  .float-nav.many-links.expanded .float-nav-heading {
    color: #cbd5e1;
    border-top-color: rgba(255,255,255,0.16);
  }
  /* few-links mobile grid: headings also span the full row */
  .float-nav:not(.many-links) .float-nav-heading {
    grid-column: 1 / -1;
  }
}

/* ── Sprint 2G additions ────────────────────────────────────── */
/* Long HOA names wrap instead of cutting off, on any screen */
.hero h1 {
  font-size: clamp(1.35rem, 4.5vw, 2.3rem);
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
  max-width: 100%;
}
.hero .subtitle { overflow-wrap: break-word; max-width: 100%; }

/* Optional HOA hero/banner image: wide, not too tall, crops nicely */
.hero-banner {
  margin-top: 10px;
  border-radius: 30px 30px 18px 18px;
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,0.8);
  line-height: 0;
}
.hero-banner img {
  width: 100%;
  height: 210px;
  object-fit: cover;
  display: block;
}
.hero-with-banner { margin-top: 8px; }
@media (max-width: 760px) {
  .hero-banner { border-radius: 22px 22px 14px 14px; }
  .hero-banner img { height: 130px; }
}

/* Language buttons: flag + code, clean on desktop and phone */
.lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 34px;
  padding: 5px 11px;
}
.lang-btn .lang-flag { font-size: 1rem; line-height: 1; }
.lang-btn .lang-flag:empty { display: none; }
.lang-btn .lang-code { font-weight: 700; letter-spacing: 0.03em; }
@media (max-width: 760px) {
  .lang-btn { min-height: 38px; padding: 6px 12px; } /* easy to tap */
}

/* Print / PDF opener */
.top-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.print-open-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  background: rgba(255,255,255,0.85);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 13px;
  min-height: 34px;
  box-shadow: 0 2px 8px rgba(17,24,39,0.06);
}
.print-open-btn:hover { background: #fff; }

/* Official minutes PDF link under the meeting tabs */
.official-pdf-row { margin: 6px 2px 0; }
.official-pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #166534;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  padding: 6px 13px;
  text-decoration: none;
}
.official-pdf-link:hover { background: #dcfce7; }

/* ── Sprint 2H ────────────────────────────────────────────── */
/* One clear Print button: small green 3D pill */
.print-open-btn {
  background: linear-gradient(180deg, #34d399 0%, #22c55e 45%, #16a34a 100%);
  color: #ffffff;
  border: 1px solid #15803d;
  box-shadow: 0 4px 10px rgba(34,197,94,0.4), inset 0 1px 0 rgba(255,255,255,0.45);
  text-shadow: 0 1px 1px rgba(0,0,0,0.15);
  font-size: 0.86rem;
  padding: 7px 16px;
}
.print-open-btn:hover { background: linear-gradient(180deg, #4ade80 0%, #22c55e 55%, #16a34a 100%); filter: none; }
.print-open-btn:active { transform: translateY(1px); box-shadow: 0 2px 5px rgba(34,197,94,0.4), inset 0 1px 2px rgba(0,0,0,0.15); }
.print-open-btn svg { display: block; }

/* SVG flags: identical on Windows, Mac, and phones */
.lang-btn .lang-flag { display: inline-flex; align-items: center; }
.lang-btn .flag-svg { display: block; border-radius: 2.5px; }

/* Selected language clearly stands out */
.lang-btn.active {
  border: 2px solid #16a34a;
  background: #f0fdf4;
  box-shadow: 0 0 0 3px rgba(34,197,94,0.22);
  font-weight: 800;
}

/* Sprint 2H: long topic lists scroll inside the floating nav instead of
   overflowing the screen; date headings stay visible while scrolling */
@media (min-width: 761px) {
  .float-nav { max-height: 82vh; overflow-y: auto; padding-right: 2px; scrollbar-width: thin; }
  .float-nav::-webkit-scrollbar { width: 5px; }
  .float-nav::-webkit-scrollbar-thumb { background: rgba(17,24,39,0.25); border-radius: 99px; }
}

/* ── Sprint 2I ────────────────────────────────────────────── */
/* The floating nav is a fixed transparent container on the right; its empty
   areas were swallowing desktop clicks on anything underneath (the language
   buttons live in that same corridor). The container now lets clicks pass
   through; only the actual pills and headings stay clickable. */
.float-nav { pointer-events: none; }
.float-nav a, .float-nav .float-nav-heading, .float-nav button { pointer-events: auto; }

/* Hero banner: fully elastic on phones, never wider than the screen,
   never forcing sideways scrolling */
.hero-banner { max-width: 100%; }
.hero-banner img { max-width: 100%; }
@media (max-width: 760px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .hero-banner img { height: clamp(110px, 30vw, 170px); }
  .top-image { max-height: 200px; }
}

/* ── Sprint 2K ────────────────────────────────────────────── */
/* Welcome popup: always above every page element, comfortable on phones */
.popup-overlay { z-index: 99999 !important; }
.popup-card { max-height: 88vh; overflow-y: auto; }
@media (max-width: 760px) {
  .popup-card { padding: 20px 16px; border-radius: 24px; }
}

/* Hero slideshow: gentle cross-fade, no layout shift */
.hero-banner { position: relative; }
.hero-banner .hero-slide { position: absolute; inset: 0; width: 100%; opacity: 0; transition: opacity 0.9s ease; }
.hero-banner .hero-slide.on { opacity: 1; position: relative; }
@media (prefers-reduced-motion: reduce) {
  .hero-banner .hero-slide { transition: none; }
}