/*
Theme Name: Protect Grove City
Template: astra
Version: 1.0
Description: Child theme for Protect Grove City, built on Astra.
Author: Protect Grove City
Text Domain: protectgrovecity
*/

/* =========================================================
   Base & Custom Properties
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy:      #1b2a47;
  --red:       #c53b1e;
  --bg:        #eceae7;
  --white:     #ffffff;
  --border:    #d4d0cc;
  --gray-text: #6b6560;
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans:  'Inter', system-ui, -apple-system, sans-serif;
  --max-w:     1200px;
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--navy);
  font-size: 16px;
  line-height: 1.6;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

/* =========================================================
   Override Astra defaults — force full width layout
   ========================================================= */

/* Strip ALL Astra layout constraints */
#content,
#primary,
#main,
.site-content,
.ast-container,
.ast-article-single,
.ast-article-single-element,
.entry-content,
.page .entry-content,
.ast-primary-content-area,
.content-area {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

/* Remove sidebar completely */
#secondary { display: none !important; width: 0 !important; }

/* Hide Astra page title, breadcrumbs, post meta */
.ast-archive-description,
.page .entry-header,
.entry-header,
.ast-breadcrumbs-wrapper,
.post-navigation,
.ast-post-format-wrapper { display: none !important; }

/* Fix entry content element constraints */
.entry-content > *,
.entry-content p,
.entry-content ul,
.entry-content ol,
.entry-content h1,
.entry-content h2 { 
  max-width: none !important; 
}

/* Fix Astra "Protect Grove City" title showing above content */
.ast-article-single > .entry-header { display: none !important; }

/* Header */
#masthead,
.site-header,
.main-header-bar { 
  background: var(--bg) !important; 
  border-bottom: 1px solid var(--border) !important; 
  box-shadow: none !important;
  padding: 0 !important;
}
.main-header-bar-wrap { padding: 0.85rem 2rem !important; }
.ast-site-identity { padding: 0 !important; }

/* Logo size */
.ast-site-identity img,
.custom-logo,
.ast-site-identity .custom-logo-link img { 
  max-width: 180px !important; 
  width: 180px !important;
  height: auto !important;
}

/* Nav links */
.main-header-menu .menu-item > a,
.ast-primary-header-bar .main-header-menu > li > a {
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: var(--navy) !important;
  opacity: 0.65;
}
.main-header-menu .menu-item > a:hover,
.main-header-menu .current-menu-item > a { opacity: 1 !important; }

/* =========================================================
   Utilities
   ========================================================= */
.section-label {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: currentColor;
  margin-bottom: 1.5rem;
}
.section-label::before {
  content: '';
  display: block;
  width: 2rem;
  height: 2px;
  background: var(--red);
  flex-shrink: 0;
}

.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: var(--red);
  color: var(--white) !important;
  font-family: var(--font-sans);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.7rem 1.3rem;
  border: none;
  cursor: pointer;
  border-radius: 3px;
  transition: background 0.2s;
}
.btn-primary:hover { background: #a82f15; }

.btn-outline-white {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: transparent;
  color: var(--white) !important;
  border: 2px solid rgba(255,255,255,0.45);
  font-family: var(--font-sans);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.65rem 1.25rem;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.btn-outline-white:hover { border-color: var(--white); background: rgba(255,255,255,0.07); }

.link-arrow {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 3px;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
.link-arrow:hover { color: var(--red); }

/* =========================================================
   Navigation
   ========================================================= */
.ast-primary-header-bar .main-header-bar-navigation .main-header-menu > li > a {
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: var(--navy) !important;
  opacity: 0.6;
}
.ast-primary-header-bar .main-header-bar-navigation .main-header-menu > li > a:hover,
.ast-primary-header-bar .main-header-bar-navigation .main-header-menu > .current-menu-item > a {
  opacity: 1;
  color: var(--navy) !important;
}

/* =========================================================
   Hero Section (Home)
   ========================================================= */
.hero {
  position: relative;
  background: var(--bg);
  min-height: 82vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.hero-bg {
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(27,42,71,0.04) 39px, rgba(27,42,71,0.04) 40px),
    repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(27,42,71,0.04) 39px, rgba(27,42,71,0.04) 40px);
  pointer-events: none;
}
.hero-image-bg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  pointer-events: none;
  overflow: hidden;
}
.hero-image-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.35;
}
.hero-image-placeholder img { width: 100%; height: 100%; object-fit: cover; }
.hero-content {
  position: relative;
  z-index: 1;
  padding: 5rem 2rem;
  max-width: var(--max-w);
  margin: 0 auto;
  width: 100%;
}
.hero-content .section-label { color: var(--navy); }
.hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.6rem, 5.5vw, 5rem);
  font-weight: 700;
  line-height: 1.08;
  color: var(--navy);
  margin-bottom: 1.75rem;
  max-width: 800px;
}
.hero h1 .accent { color: var(--red); }
.hero-desc {
  font-size: 0.975rem;
  line-height: 1.75;
  color: var(--navy);
  opacity: 0.8;
  max-width: 720px;
  margin-bottom: 2.25rem;
}

/* =========================================================
   What Happened Section
   ========================================================= */
.what-happened {
  background: var(--white);
  padding: 6rem 2rem;
}
.what-happened-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
}
.what-happened-text h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 3.2vw, 2.9rem);
  font-weight: 700;
  line-height: 1.18;
  color: var(--navy);
  margin-bottom: 1.5rem;
}
.what-happened-text p {
  font-size: 0.95rem;
  line-height: 1.82;
  color: var(--navy);
  opacity: 0.8;
  margin-bottom: 1rem;
}
.cta-group {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.what-happened-image {
  aspect-ratio: 4/3;
  border-radius: 4px;
  overflow: hidden;
}
.what-happened-image img { object-fit: cover; width: 100%; height: 100%; }

/* =========================================================
   Council Section
   ========================================================= */
.council-section {
  background: var(--navy);
  padding: 5rem 2rem;
}
.council-section-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
}
.council-intro { color: var(--white); }
.council-intro .section-label { color: rgba(255,255,255,0.75); }
.council-intro .section-label::before { background: var(--red); }
.council-intro h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 2.8vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--white);
  margin-bottom: 1rem;
}
.council-intro p { font-size: 0.9rem; line-height: 1.75; color: rgba(255,255,255,0.65); }
.council-card { border: 1px solid rgba(255,255,255,0.18); padding: 2rem; color: var(--white); }
.council-card .section-label { color: rgba(255,255,255,0.7); margin-bottom: 1.25rem; }
.council-card .section-label::before { background: var(--red); }
.date-display { display: flex; align-items: center; gap: 1.25rem; margin-bottom: 1.5rem; }
.date-badge { text-align: center; min-width: 72px; }
.date-badge .month {
  display: block;
  background: var(--red);
  color: var(--white);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.22rem 0.5rem;
}
.date-badge .day {
  display: block;
  background: var(--white);
  color: var(--navy);
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.35rem 0.5rem;
}
.date-info .day-name {
  font-family: var(--font-serif);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  color: var(--white);
}
.date-info .year { font-size: 0.9rem; color: rgba(255,255,255,0.5); margin-top: 2px; }
.meeting-details {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(255,255,255,0.12);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.meeting-details li { display: flex; align-items: flex-start; gap: 0.75rem; font-size: 0.88rem; color: rgba(255,255,255,0.82); }
.detail-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--red); flex-shrink: 0; margin-top: 5px; }
.council-calendar-link {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--white);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.council-calendar-link:hover { color: rgba(255,255,255,0.75); }

/* =========================================================
   Page Hero (inner pages)
   ========================================================= */
.page-hero {
  background: var(--bg);
  padding: 5rem 2rem 3.5rem;
  border-bottom: 1px solid var(--border);
}
.page-hero-inner { max-width: var(--max-w); margin: 0 auto; }
.page-hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4.5vw, 3.75rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.12;
  margin-bottom: 1rem;
}
.page-hero p { font-size: 1rem; color: var(--navy); opacity: 0.65; max-width: 600px; line-height: 1.75; }

/* =========================================================
   Questions Page
   ========================================================= */
.questions-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  min-height: 60vh;
}
.questions-sidebar {
  background: var(--bg);
  padding: 4rem 2rem;
  border-right: 1px solid var(--border);
  position: sticky;
  top: 73px;
  align-self: start;
  max-height: calc(100vh - 73px);
  overflow-y: auto;
}
.questions-sidebar h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 2.5vw, 2.1rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 1rem;
}
.questions-sidebar p { font-size: 0.88rem; line-height: 1.75; color: var(--navy); opacity: 0.72; margin-bottom: 1.5rem; }
.questions-main { background: var(--white); padding: 4rem 3rem; }
.question-group { margin-bottom: 4rem; }
.question-group-header {
  display: flex;
  align-items: baseline;
  gap: 1.5rem;
  padding-bottom: 1.5rem;
  margin-bottom: 0;
  border-bottom: 1px solid var(--border);
}
.q-num { font-size: 1rem; font-weight: 300; color: var(--navy); opacity: 0.35; min-width: 2rem; flex-shrink: 0; }
.question-group-header h2 { font-family: var(--font-serif); font-size: 1.65rem; font-weight: 700; color: var(--navy); }
.question-item {
  display: grid;
  grid-template-columns: 3.5rem 1fr;
  gap: 1rem;
  padding: 2rem 0;
  border-bottom: 1px solid var(--border);
}
.question-item:last-child { border-bottom: none; }
.q-sub-num { font-size: 0.72rem; color: var(--navy); opacity: 0.32; font-weight: 300; padding-top: 0.25rem; }
.question-item h3 { font-family: var(--font-serif); font-size: 1.15rem; font-weight: 700; color: var(--navy); margin-bottom: 0.75rem; line-height: 1.3; }
.question-item p { font-size: 0.9rem; line-height: 1.82; color: var(--navy); opacity: 0.78; }

/* =========================================================
   Timeline Page
   ========================================================= */
.timeline-list { max-width: var(--max-w); margin: 0 auto; background: var(--white); padding: 3.5rem 2rem; }
.timeline-entry {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 3rem;
  padding: 2.75rem 0;
  border-bottom: 1px solid var(--border);
  align-items: start;
}
.timeline-entry:first-child { border-top: 1px solid var(--border); }
.timeline-date-col .tl-date { display: block; font-size: 1rem; font-weight: 600; color: var(--navy); margin-bottom: 0.3rem; }
.timeline-date-col .tl-type { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--navy); opacity: 0.42; }
.timeline-entry-content .tl-tag { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--red); margin-bottom: 0.5rem; }
.timeline-entry-content h3 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: 700; color: var(--navy); line-height: 1.3; margin-bottom: 0.75rem; }
.timeline-entry-content p { font-size: 0.9rem; line-height: 1.82; color: var(--navy); opacity: 0.75; }
.timeline-doc-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--navy);
  border: 1px solid var(--border);
  padding: 0.4rem 0.85rem;
  transition: background 0.18s;
}
.timeline-doc-link:hover { background: var(--bg); }

/* =========================================================
   Updates / Blog
   ========================================================= */
.updates-list { max-width: var(--max-w); margin: 0 auto; padding: 3.5rem 2rem; }
.update-item {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 3rem;
  padding: 2.75rem 0;
  border-bottom: 1px solid var(--border);
  align-items: start;
}
.update-item:first-child { border-top: 1px solid var(--border); }
.update-thumb { aspect-ratio: 16/9; background: var(--navy); overflow: hidden; flex-shrink: 0; }
.update-thumb img { width: 100%; height: 100%; object-fit: cover; }
.update-meta { font-size: 0.68rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy); opacity: 0.5; margin-bottom: 0.6rem; }
.update-meta .update-cat { color: var(--red); opacity: 1; font-weight: 600; }
.update-body h3 { font-family: var(--font-serif); font-size: 1.3rem; font-weight: 700; color: var(--red); line-height: 1.3; margin-bottom: 0.75rem; }
.update-body p { font-size: 0.9rem; line-height: 1.82; color: var(--navy); opacity: 0.75; margin-bottom: 1rem; }
.read-more { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.85rem; font-weight: 600; color: var(--red); text-decoration: underline; text-underline-offset: 3px; }

/* =========================================================
   Take Action Page
   ========================================================= */
.ta-hero { background: var(--navy); padding: 6rem 2rem 5rem; }
.ta-hero-inner { max-width: var(--max-w); margin: 0 auto; }
.ta-hero .section-label { color: rgba(255,255,255,0.62); }
.ta-hero .section-label::before { background: var(--red); }
.ta-hero h1 { font-family: var(--font-serif); font-size: clamp(2.4rem, 5vw, 4.5rem); font-weight: 700; color: var(--white); line-height: 1.08; margin-bottom: 1rem; max-width: 680px; }
.ta-hero h1 .accent { color: var(--red); }
.ta-hero .hero-desc { color: rgba(255,255,255,0.65); max-width: 520px; margin-bottom: 2.5rem; }
.ta-hero-btns { display: flex; gap: 1rem; flex-wrap: wrap; }
.ta-section { padding: 5rem 2rem; }
.ta-section-inner { max-width: var(--max-w); margin: 0 auto; }
.ta-section h2 { font-family: var(--font-serif); font-size: clamp(1.6rem, 3vw, 2.5rem); font-weight: 700; color: var(--navy); line-height: 1.15; margin-bottom: 0.75rem; }
.ta-section-desc { font-size: 0.95rem; color: var(--navy); opacity: 0.7; max-width: 600px; line-height: 1.75; margin-bottom: 2.5rem; }
.email-layout { display: grid; grid-template-columns: 1fr 360px; gap: 4rem; align-items: start; }
.email-template-label { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy); opacity: 0.45; margin-bottom: 0.65rem; }
.email-template-box { background: var(--bg); border: 1px solid var(--border); border-left: 3px solid var(--red); padding: 1.5rem 1.75rem; font-size: 0.88rem; line-height: 1.82; color: var(--navy); white-space: pre-wrap; font-family: var(--font-sans); margin-bottom: 1rem; max-height: 720px; overflow-y: auto; }
.copy-btn { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy); border: 1px solid var(--border); background: var(--white); padding: 0.55rem 1.1rem; cursor: pointer; transition: background 0.18s; font-family: var(--font-sans); }
.copy-btn:hover { background: var(--bg); }
.copy-btn.copied { color: #2a7a4f; border-color: #2a7a4f; background: #f0faf5; }
.council-emails-header { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy); opacity: 0.45; margin-bottom: 0.65rem; }
.council-email-list { list-style: none; border: 1px solid var(--border); margin-bottom: 0.75rem; }
.council-email-list li { padding: 0.9rem 1rem; border-bottom: 1px solid var(--border); }
.council-email-list li:last-child { border-bottom: none; }
.council-email-list .member-name { font-size: 0.88rem; font-weight: 600; color: var(--navy); }
.council-email-list .member-role { font-size: 0.7rem; color: var(--navy); opacity: 0.48; margin-bottom: 0.3rem; }
.council-email-list .member-email { font-size: 0.8rem; color: var(--red); text-decoration: underline; text-underline-offset: 2px; }
.copy-all-btn { display: flex; align-items: center; justify-content: center; gap: 0.4rem; width: 100%; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white); background: var(--navy); border: 1px solid var(--navy); padding: 0.65rem 1rem; cursor: pointer; transition: background 0.18s; font-family: var(--font-sans); }
.copy-all-btn:hover { background: #122038; }
.copy-all-btn.copied { background: #2a7a4f; border-color: #2a7a4f; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(256px, 1fr)); gap: 1rem; }
.media-card { border: 1px solid var(--border); padding: 1.25rem 1.5rem; background: var(--white); }
.media-card .outlet-name { font-size: 0.95rem; font-weight: 700; color: var(--navy); margin-bottom: 0.2rem; }
.media-card .outlet-type { font-size: 0.6rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy); opacity: 0.4; margin-bottom: 0.75rem; }
.media-card a { font-size: 0.82rem; color: var(--red); text-decoration: underline; text-underline-offset: 2px; }
.share-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: start; }
.share-tips-list { list-style: none; display: flex; flex-direction: column; gap: 1.25rem; }
.share-tip { display: flex; gap: 1rem; align-items: flex-start; }
.share-tip-num { font-size: 1.5rem; font-weight: 800; color: var(--red); opacity: 0.3; line-height: 1; flex-shrink: 0; min-width: 1.75rem; }
.share-tip-text { font-size: 0.92rem; color: var(--navy); opacity: 0.82; line-height: 1.65; padding-top: 0.1rem; }
.share-petition-box { background: var(--navy); padding: 2.5rem; }
.share-petition-box .section-label { color: rgba(255,255,255,0.58); margin-bottom: 1rem; }
.share-petition-box .section-label::before { background: var(--red); }
.share-petition-box h3 { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 700; color: var(--white); line-height: 1.2; margin-bottom: 0.75rem; }
.share-petition-box p { font-size: 0.9rem; color: rgba(255,255,255,0.62); line-height: 1.75; margin-bottom: 1.5rem; }
.petition-url-row { background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.18); padding: 0.75rem 1rem; font-size: 0.8rem; color: rgba(255,255,255,0.68); margin-bottom: 1.25rem; word-break: break-all; }

/* =========================================================
   Footer
   ========================================================= */
.site-footer, #colophon {
  background: var(--navy) !important;
  color: rgba(255,255,255,0.5) !important;
  padding: 2.25rem 2rem !important;
  text-align: center !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.06em !important;
}
.site-footer a, #colophon a { color: rgba(255,255,255,0.75) !important; text-decoration: underline; text-underline-offset: 2px; }
.ast-footer-copyright { color: rgba(255,255,255,0.5) !important; }

/* =========================================================
   Mobile nav toggle
   ========================================================= */
.mobile-menu-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
}
.mobile-menu-btn span { display: block; width: 22px; height: 2px; background: var(--navy); }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 960px) {
  .what-happened-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .council-section-inner { grid-template-columns: 1fr; gap: 3rem; }
  .questions-layout { grid-template-columns: 1fr; }
  .questions-sidebar { position: static; max-height: none; border-right: none; border-bottom: 1px solid var(--border); }
  .questions-main { padding: 2.5rem 1.5rem; }
  .update-item { grid-template-columns: 1fr; gap: 1.5rem; }
  .timeline-entry { grid-template-columns: 130px 1fr; gap: 1.5rem; }
  .email-layout { grid-template-columns: 1fr; }
  .share-layout { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .hero h1 { font-size: 2.2rem; }
  .timeline-entry { grid-template-columns: 1fr; gap: 0.5rem; }
  .timeline-date-col { display: flex; gap: 0.75rem; align-items: center; }
  .what-happened { padding: 4rem 2rem; }
}

/* =========================================================
   Custom Header (front-page.php)
   ========================================================= */

/* Hide Astra's built-in header bar on front page */
body.home .main-header-bar { display: none !important; }

/* Our custom header layout */
.header-inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0.85rem 2rem;
  max-width: 1400px;
  margin: 0 auto;
}
.logo { display: flex; align-items: center; flex-shrink: 0; text-decoration: none; }
.logo-icon { width: 160px; height: auto; }
nav { display: flex; align-items: center; gap: 1.75rem; margin-left: auto; }
nav a {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--navy);
  opacity: 0.6;
  padding-bottom: 2px;
  border-bottom: 2px solid transparent;
  transition: opacity 0.18s, border-color 0.18s;
  text-decoration: none;
}
nav a:hover, nav a.active { opacity: 1; border-bottom-color: var(--navy); }
.header-actions { display: flex; align-items: center; gap: 0.75rem; margin-left: 1rem; }
.btn-follow {
  display: flex; align-items: center; gap: 0.35rem;
  font-size: 0.68rem; font-weight: 600; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--navy); opacity: 0.65;
  transition: opacity 0.18s; text-decoration: none;
}
.btn-follow:hover { opacity: 1; }
.btn-follow svg { width: 18px; height: 18px; }

/* Mobile nav */
.mobile-menu-btn {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px; margin-left: auto;
}
.mobile-menu-btn span { display: block; width: 22px; height: 2px; background: var(--navy); }
@media (max-width: 960px) {
  nav { display: none; }
  nav.open {
    display: flex; flex-direction: column; width: 100%; gap: 0;
    order: 99; border-top: 1px solid var(--border); padding: 0.75rem 0;
  }
  nav.open a { padding: 0.6rem 0; border-bottom: none; }
  .header-inner { flex-wrap: wrap; }
  .header-actions { margin-left: auto; }
  .mobile-menu-btn { display: flex; }
}

/* Fix what-happened image to fill full height */
.what-happened-image {
  aspect-ratio: unset !important;
  border-radius: 0 !important;
  align-self: stretch;
  min-height: 400px;
}
.what-happened-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* =========================================================
   Fix community image - full bleed right column
   ========================================================= */
.what-happened {
  padding: 0 !important;
}
.what-happened-inner {
  padding: 0 !important;
  gap: 0 !important;
  align-items: stretch !important;
}
.what-happened-text {
  padding: 6rem 4rem 6rem 4rem;
}
@media (min-width: 961px) {
  .what-happened-text {
    padding: 6rem 4rem;
  }
}
.what-happened-image {
  aspect-ratio: unset !important;
  border-radius: 0 !important;
  min-height: 500px;
  overflow: hidden;
  display: block;
}
.what-happened-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

/* Fix logo black background - mix-blend-mode makes black transparent */
.logo-icon {
  mix-blend-mode: multiply;
  background: transparent;
}

/* Force community image to true full bleed right edge */
.what-happened-inner {
  grid-template-columns: 1fr 1fr !important;
  overflow: hidden !important;
}
.what-happened-image {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 500px !important;
  display: block !important;
}
.what-happened-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* =========================================================
   Community image - TRUE full page width
   ========================================================= */
.what-happened {
  display: block !important;
  padding: 0 !important;
}
.what-happened-inner {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.what-happened-text {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 6rem 2rem;
}
.what-happened-image {
  display: block !important;
  width: 100vw !important;
  height: 500px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.what-happened-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 30% !important;
  display: block !important;
}

/* Fix community image right edge gap */
.what-happened {
  overflow: hidden !important;
}
.what-happened-inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}
.what-happened-text {
  padding: 6rem 4rem 6rem calc((100vw - 1200px) / 2 + 2rem) !important;
}
@media (max-width: 1200px) {
  .what-happened-text { padding: 6rem 3rem !important; }
}
.what-happened-image {
  width: 100% !important;
  height: 100% !important;
  min-height: 500px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: block !important;
}
.what-happened-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* =========================================================
   Fix footer - remove empty widget area
   ========================================================= */
.ast-above-footer-bar,
.ast-footer-widgets-area,
.footer-widget-area,
#footer-widgets,
.ast-footer-widget-area { display: none !important; }

.site-footer, #colophon {
  background: var(--navy) !important;
  color: rgba(255,255,255,0.5) !important;
  padding: 2.25rem 2rem !important;
  text-align: center !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.06em !important;
}
.site-footer a, #colophon a {
  color: rgba(255,255,255,0.75) !important;
  text-decoration: underline;
}
.ast-footer-copyright { color: rgba(255,255,255,0.5) !important; }

/* =========================================================
   Fix Timeline page layout - full width hero + entries
   ========================================================= */
.page-hero {
  background: var(--bg) !important;
  padding: 5rem 2rem 3.5rem !important;
  border-bottom: 1px solid var(--border) !important;
  width: 100% !important;
  display: block !important;
}
.page-hero-inner {
  max-width: var(--max-w) !important;
  margin: 0 auto !important;
}
.timeline-list {
  max-width: var(--max-w) !important;
  margin: 0 auto !important;
  background: var(--white) !important;
  padding: 3.5rem 2rem !important;
  width: 100% !important;
}

/* Fix inner pages - force full width like front page */
.page-template-page-timeline #content,
.page-template-page-questions #content,
.page-template-page-updates #content,
.page-template-page-take-action #content {
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Footer email link */
.footer-email-link {
  color: rgba(255,255,255,0.75) !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  transition: color 0.18s;
}
.footer-email-link:hover { color: var(--white) !important; }
.footer-divider { margin: 0 0.5rem; }

/* =========================================================
   Updates Legend Bar
   ========================================================= */
.updates-legend-bar {
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  padding: 0;
}
.updates-legend-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 2rem;
}
.legend-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--navy);
  opacity: 0.7;
  padding: 0.85rem 0;
  transition: opacity 0.18s;
}
.legend-toggle:hover { opacity: 1; }
.legend-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  padding: 1.25rem 0 1.75rem;
}
.legend-item {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.legend-cat {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--red);
}
.legend-desc {
  font-size: 0.82rem;
  line-height: 1.65;
  color: var(--navy);
  opacity: 0.72;
}

/* =========================================================
   Submit Section
   ========================================================= */
.submit-section {
  background: var(--bg);
  padding: 5rem 2rem;
  border-top: 1px solid var(--border);
}
.submit-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: start;
}
.submit-text h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 2.8vw, 2.4rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 1rem;
}
.submit-text p {
  font-size: 0.92rem;
  line-height: 1.75;
  color: var(--navy);
  opacity: 0.75;
  margin-bottom: 1.5rem;
}
.submit-category-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  font-size: 0.88rem;
  color: var(--navy);
  opacity: 0.75;
  line-height: 1.5;
}
.submit-category-list .update-cat { margin-right: 0.25rem; }

/* Form styles */
.submit-form-wrap {
  background: var(--white);
  border: 1px solid var(--border);
  padding: 2rem;
}
.pgc-submit-form {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.form-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.form-field label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy);
  opacity: 0.7;
}
.form-field input,
.form-field select,
.form-field textarea {
  font-family: var(--font-sans);
  font-size: 0.9rem;
  color: var(--navy);
  background: var(--bg);
  border: 1px solid var(--border);
  padding: 0.65rem 0.85rem;
  outline: none;
  transition: border-color 0.18s;
  width: 100%;
  border-radius: 2px;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus { border-color: var(--navy); }
.form-field textarea { resize: vertical; }
.form-note {
  font-size: 0.75rem;
  color: var(--navy);
  opacity: 0.5;
  margin-top: 0.25rem;
  line-height: 1.5;
}

@media (max-width: 960px) {
  .submit-inner { grid-template-columns: 1fr; gap: 2.5rem; }
}

/* Simple submit CTA */
.submit-inner-simple {
  max-width: var(--max-w);
  margin: 0 auto;
}
.submit-inner-simple h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 2.8vw, 2.4rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 1rem;
}
.submit-inner-simple p {
  font-size: 0.92rem;
  line-height: 1.75;
  color: var(--navy);
  opacity: 0.75;
  max-width: 600px;
  margin-bottom: 1.5rem;
}

/* =========================================================
   Updates Filter Bar
   ========================================================= */
.updates-filter-bar {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 0;
}
.updates-filter-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 1rem 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.filter-cats {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.filter-btn {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy);
  opacity: 0.55;
  padding: 0.35rem 0.75rem;
  border: 1px solid var(--border);
  background: transparent;
  border-radius: 2px;
  text-decoration: none;
  transition: all 0.18s;
  white-space: nowrap;
}
.filter-btn:hover { opacity: 1; border-color: var(--navy); }
.filter-btn.active {
  background: var(--navy);
  color: var(--white);
  opacity: 1;
  border-color: var(--navy);
}

/* Search box */
.updates-search {
  display: flex;
  align-items: center;
  border: 1px solid var(--border);
  background: var(--bg);
  overflow: hidden;
  flex-shrink: 0;
}
.updates-search input {
  font-family: var(--font-sans);
  font-size: 0.82rem;
  color: var(--navy);
  background: transparent;
  border: none;
  outline: none;
  padding: 0.45rem 0.75rem;
  width: 200px;
}
.updates-search button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.45rem 0.65rem;
  color: var(--navy);
  opacity: 0.6;
  display: flex;
  align-items: center;
  transition: opacity 0.18s;
}
.updates-search button:hover { opacity: 1; }

@media (max-width: 960px) {
  .updates-filter-inner { flex-direction: column; align-items: flex-start; }
  .updates-search input { width: 160px; }
}

/* =========================================================
   Post Modal
   ========================================================= */
.pgc-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}
.pgc-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(27, 42, 71, 0.7);
  backdrop-filter: blur(3px);
}
.pgc-modal-content {
  position: relative;
  background: var(--white);
  max-width: 780px;
  width: 100%;
  max-height: 85vh;
  overflow-y: auto;
  border-radius: 4px;
  z-index: 1;
}
.pgc-modal-close {
  position: sticky;
  top: 0;
  float: right;
  background: var(--white);
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--navy);
  opacity: 0.5;
  padding: 0.75rem 1rem;
  line-height: 1;
  transition: opacity 0.18s;
  z-index: 2;
}
.pgc-modal-close:hover { opacity: 1; }
.pgc-modal-body {
  padding: 0 2.5rem 2.5rem;
  clear: both;
}
.pgc-modal-loading {
  padding: 3rem;
  text-align: center;
  color: var(--navy);
  opacity: 0.5;
  font-size: 0.9rem;
}
.pgc-modal-meta {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy);
  opacity: 0.5;
  margin-bottom: 0.75rem;
}
.pgc-modal-title {
  font-family: var(--font-serif);
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 1.5rem;
}
.pgc-modal-text {
  font-size: 0.95rem;
  line-height: 1.85;
  color: var(--navy);
}
.pgc-modal-text p { margin-bottom: 1rem; }
.pgc-modal-text p:last-child { margin-bottom: 0; }

@media (max-width: 600px) {
  .pgc-modal { padding: 0; }
  .pgc-modal-content { max-height: 100vh; border-radius: 0; }
}

/* Fix header vertical alignment */
.header-inner {
  align-items: center !important;
}
.header-actions {
  align-items: center !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  transform: translateY(-7px);
}

/* Fix header vertical alignment - proper flex centering */
.header-inner {
  align-items: center !important;
}
.header-actions {
  align-items: center !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  transform: none !important;
}
.btn-follow {
  align-items: center !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  line-height: 1 !important;
}
.btn-primary {
  align-items: center !important;
  line-height: 1 !important;
}

/* Fix FOLLOW vertical alignment with nav links */
.btn-follow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
  top: -1px !important;
}
.btn-follow svg {
  display: block !important;
  flex-shrink: 0 !important;
  position: relative !important;
  top: 0 !important;
}

/* Precise header-actions alignment */
.header-actions {
  transform: translateY(-3px) !important;
}

/* =========================================================
   Impact Map Page
   ========================================================= */
.map-stats-bar {
  background: var(--navy);
  padding: 2rem;
}
.map-stats-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  text-align: center;
}
.map-stat-number {
  font-family: var(--font-serif);
  font-size: 3rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin-bottom: 0.5rem;
}
.map-stat-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  line-height: 1.4;
}
.map-legend-bar {
  background: var(--bg);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1rem 2rem;
}
.map-legend-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.map-legend-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--navy);
  opacity: 0.8;
}
.legend-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
}
.legend-ring {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid;
  flex-shrink: 0;
  background: transparent;
}
.school-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
}
.school-card {
  border: 1px solid var(--border);
  padding: 1.25rem 1.5rem;
  background: var(--bg);
}
.school-card.inside { border-left: 3px solid #2563eb; }
.school-card.edge { border-left: 3px solid #f59e0b; }
.school-status {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 0.4rem;
}
.school-card.inside .school-status { color: #2563eb; }
.school-card.edge .school-status { color: #f59e0b; }
.school-name {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 0.2rem;
}
.school-dist {
  font-size: 0.78rem;
  color: var(--navy);
  opacity: 0.55;
}
@media (max-width: 960px) {
  .map-stats-inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .map-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  #pgc-map { height: 400px !important; }
}

/* Private school cards */
.school-card.inside.private { border-left-color: #16a34a; }
.school-card.inside.private .school-status { color: #16a34a; }

/* Private school edge cards */
.school-card.edge.private-edge { border-left-color: #f59e0b; }
.school-card.edge.private-edge .school-status { color: #f59e0b; }

/* =========================================================
   GoFundMe Section
   ========================================================= */
.gofundme-section {
  background: var(--white);
  padding: 4rem 2rem;
  border-top: 1px solid var(--border);
}
.gofundme-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3rem;
  align-items: center;
}
.gofundme-text .section-label { color: var(--navy); }
.gofundme-text h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 0.75rem;
}
.gofundme-text p {
  font-size: 0.92rem;
  line-height: 1.75;
  color: var(--navy);
  opacity: 0.75;
  max-width: 520px;
}
.btn-gofundme {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #02a95c;
  color: var(--white) !important;
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.85rem 1.75rem;
  border-radius: 3px;
  text-decoration: none !important;
  transition: background 0.2s;
  white-space: nowrap;
}
.btn-gofundme:hover { background: #018a4a; }

@media (max-width: 960px) {
  .gofundme-inner { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* =========================================================
   GoFundMe Header Button & Tooltip
   ========================================================= */
.btn-gofundme-header {
  padding: 0.5rem 1rem !important;
  font-size: 0.65rem !important;
}
.header-gofundme-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.header-gofundme-tooltip {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  background: var(--navy);
  color: var(--white);
  font-size: 0.78rem;
  line-height: 1.6;
  padding: 0.85rem 1rem;
  border-radius: 3px;
  width: 240px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
  z-index: 200;
  pointer-events: none;
}
.header-gofundme-tooltip::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 16px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid var(--navy);
}
.header-gofundme-tooltip strong { color: #fff; display: block; margin-bottom: 0.25rem; }
.header-gofundme-wrap:hover .header-gofundme-tooltip { display: block; }

/* Fix tooltip z-index - header must stay above all content */
#masthead,
.site-header { z-index: 9999 !important; }
.header-gofundme-tooltip { z-index: 10000 !important; }

/* Ensure header is positioned so tooltip renders above page content */
.header-inner { position: relative; z-index: 9999; }
.header-gofundme-wrap { z-index: 9999; }

/* Fix tooltip - use fixed positioning to escape stacking contexts */
.header-gofundme-tooltip {
  position: fixed !important;
  top: 70px !important;
  right: 120px !important;
}

/* Tooltip fixed at top level - escapes all stacking contexts */
#gfm-tooltip {
  position: fixed !important;
  display: none;
  background: var(--navy);
  color: var(--white);
  font-size: 0.78rem;
  line-height: 1.6;
  padding: 0.85rem 1rem;
  border-radius: 3px;
  width: 240px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
  z-index: 99999 !important;
  pointer-events: none;
}
#gfm-tooltip::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 16px;
  width: 0; height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid var(--navy);
}
#gfm-tooltip strong { color: #fff; display: block; margin-bottom: 0.25rem; }