:root{
  --maroon:#5C1A22;
  --vermilion:#C1272D;
  --marigold:#E29A3C;
  --cream:#FBF1E3;
  --ivory:#FFFCF6;
  --teal:#1F4B43;
  --ink:#2B1712;
  --gold-line: rgba(226,154,60,0.55);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  font-size:17px;
  line-height:1.6;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  font-weight:600;
  color:var(--maroon);
  line-height:1.08;
}
a{color:inherit;}
img,svg{display:block; max-width:100%;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}

/* ---------- Alpana divider motif ---------- */
.alpana{
  height:26px;
  background-repeat: repeat-x;
  background-size: 52px 26px;
  background-image: radial-gradient(circle at 8px 13px, var(--vermilion) 0 3px, transparent 4px),
                     radial-gradient(circle at 26px 6px, var(--marigold) 0 2.5px, transparent 3.5px),
                     radial-gradient(circle at 26px 20px, var(--marigold) 0 2.5px, transparent 3.5px),
                     radial-gradient(circle at 44px 13px, var(--vermilion) 0 3px, transparent 4px);
  opacity:0.85;
}

/* ---------- Header ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:var(--ivory);
  border-bottom:1px solid var(--gold-line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 32px;
  max-width:1180px; margin:0 auto;
  gap:18px;
}
.menu-toggle{
  display:none;
  flex-direction:column; justify-content:center; align-items:flex-start; gap:5px;
  width:30px; height:30px; background:none; border:none; cursor:pointer; padding:0; flex-shrink:0;
}
.menu-toggle span{display:block; width:26px; height:2px; background:var(--maroon); border-radius:2px; transition:transform 0.2s ease, opacity 0.2s ease;}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:'Fraunces', serif; font-weight:600; font-size:17px; color:var(--maroon);
  text-decoration:none; flex-shrink:0;
}
.brand-mark{height:32px; width:auto; flex-shrink:0;}
.brand small{
  display:block; font-family:'Work Sans', sans-serif; font-weight:500; font-size:10.5px;
  color:var(--vermilion); letter-spacing:0.02em;
}
nav.links{display:flex; gap:16px; font-size:13.5px; font-weight:500; flex-wrap:nowrap; flex-shrink:1; overflow-x:auto;}
nav.links a{text-decoration:none; color:var(--ink); position:relative; padding:4px 0; white-space:nowrap;}
nav.links a:hover{color:var(--vermilion);}
nav.links a.current{color:var(--vermilion); border-bottom:2px solid var(--vermilion);}
.nav-cta{
  background:var(--vermilion); color:var(--ivory); text-decoration:none;
  padding:10px 16px; border-radius:3px; font-weight:600; font-size:13.5px;
  border:1px solid var(--vermilion); white-space:nowrap; flex-shrink:0;
}
.nav-cta:hover{background:var(--maroon); border-color:var(--maroon);}

/* ---------- Mobile menu panel ---------- */
.mobile-menu{
  display:none; flex-direction:column;
  background:var(--ivory); border-top:1px solid rgba(92,26,34,0.1);
  max-width:1180px; margin:0 auto; padding:6px 32px 14px;
}
.mobile-menu.open{display:flex;}
.mobile-menu a{
  text-decoration:none; color:var(--ink); font-size:16px; font-weight:500;
  padding:13px 0; border-bottom:1px solid rgba(92,26,34,0.1);
}
.mobile-menu a:last-child{border-bottom:none;}
.mobile-menu a.current{color:var(--vermilion);}
.mobile-menu a.mobile-cta{
  color:var(--vermilion); font-weight:600; margin-top:4px;
}

/* ---------- Hero (home) ---------- */
.hero{
  display:grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items:center;
  gap:40px;
  max-width:1120px; margin:0 auto;
  padding:64px 32px 56px;
}
.reg-address{
  font-size:13px; color:var(--ink-soft, #5A4038); font-weight:500;
  margin-bottom:14px; letter-spacing:0.01em;
}
.hero-copy .kicker{
  color:var(--vermilion); font-weight:600; font-size:14.5px;
  margin-bottom:18px; display:block;
}
.hero-copy h1{
  font-size:clamp(40px, 5.4vw, 62px);
  margin-bottom:22px;
}
.hero-copy p{
  font-size:18px; max-width:46ch; color:#4A342E; margin-bottom:30px;
}
.hero-btns{display:flex; gap:16px; flex-wrap:wrap;}
.btn-primary, .btn-secondary{
  text-decoration:none; padding:14px 26px; border-radius:3px; font-weight:600; font-size:15.5px;
  display:inline-block; border:1px solid transparent;
}
.btn-primary{background:var(--vermilion); color:var(--ivory); border-color:var(--vermilion);}
.btn-primary:hover{background:var(--maroon); border-color:var(--maroon);}
.btn-secondary{background:transparent; color:var(--maroon); border-color:var(--maroon);}
.btn-secondary:hover{background:var(--maroon); color:var(--ivory);}
.btn-disabled{
  text-decoration:none; padding:14px 26px; border-radius:3px; font-weight:600; font-size:15.5px;
  display:inline-block; background:#E4D8C4; color:#8A7A66; border:1px solid #E4D8C4; cursor:not-allowed;
}
.hero-art{
  position:relative;
  background: linear-gradient(180deg, #3A0F14 0%, #5C1A22 100%);
  border-radius:6px;
  padding:14px;
}
.hero-art img{border-radius:3px; width:100%; height:auto; object-fit:cover; max-height:640px;}
.hero-art figcaption{
  text-align:center; font-size:13px; color:var(--marigold); margin-top:12px; font-style:italic;
}

/* ---------- Simple page hero (subpages) ---------- */
.page-hero{
  padding:56px 0 40px; border-bottom:1px solid rgba(92,26,34,0.12);
}
.page-hero .kicker{color:var(--vermilion); font-weight:600; font-size:14px; display:block; margin-bottom:12px;}
.page-hero h1{font-size:clamp(32px, 4.4vw, 48px);}
.page-hero p{margin-top:16px; color:#4A342E; font-size:17px; max-width:60ch;}

/* ---------- Section shells ---------- */
section{padding:78px 0;}
.section-head{max-width:640px; margin-bottom:44px;}
.section-head .kicker{color:var(--vermilion); font-weight:600; font-size:14px; display:block; margin-bottom:12px;}
.section-head h2{font-size:clamp(28px, 3.4vw, 38px);}
.section-head p{margin-top:14px; color:#4A342E; font-size:16.5px;}

.band-teal{background:var(--teal); color:var(--ivory);}
.band-teal h2{color:var(--ivory);}
.band-teal p{color:#D9E5E1;}
.band-teal .kicker{color:var(--marigold);}

/* ---------- About ---------- */
.about-grid{
  display:grid; grid-template-columns: 1fr 1fr; gap:56px; align-items:start;
}
.about-grid p{margin-bottom:18px; color:#3E2A24;}
.stat-list{display:flex; flex-direction:column; gap:22px; border-left:2px solid var(--gold-line); padding-left:26px;}
.stat-list .stat b{
  font-family:'Fraunces', serif; font-size:26px; color:var(--vermilion); display:block;
}
.stat-list .stat span{font-size:14.5px; color:#5A4038;}

/* ---------- Pillars / rows ---------- */
.pillars{display:flex; flex-direction:column;}
.pillar-row{
  display:grid; grid-template-columns: 90px 1fr 1fr; gap:28px;
  padding:34px 0; border-top:1px solid rgba(92,26,34,0.15);
  align-items:start;
}
.pillar-row:last-child{border-bottom:1px solid rgba(92,26,34,0.15);}
.pillar-mark{
  font-family:'Fraunces', serif; font-size:15px; color:var(--marigold); font-weight:600;
  padding-top:4px;
}
.pillar-row h3{font-size:22px; margin-bottom:6px;}
.pillar-row p{color:#4A342E; font-size:15.5px;}

/* ---------- Get involved / linked cards ---------- */
.involve-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:0;}
.involve-card{padding:32px 30px; border-right:1px solid rgba(255,255,255,0.18);}
.involve-card:last-child{border-right:none;}
.involve-card h3{color:var(--marigold); font-size:19px; margin-bottom:10px; font-family:'Fraunces', serif; font-weight:600;}
.involve-card p{color:#D9E5E1; font-size:15px; margin-bottom:16px;}
.involve-card a{
  color:var(--ivory); font-size:14.5px; font-weight:600; text-decoration:none; border-bottom:1px solid var(--marigold);
  padding-bottom:2px;
}

/* ---------- Committee link cards (cream bg) ---------- */
.committee-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:24px;}
.committee-card{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-top:4px solid var(--vermilion);
  border-radius:4px; padding:28px 26px; text-decoration:none; display:block;
}
.committee-card:nth-child(2){border-top-color:var(--marigold);}
.committee-card:nth-child(3){border-top-color:var(--teal);}
.committee-card h3{font-size:19px; margin-bottom:8px;}
.committee-card p{font-size:14.5px; color:#5A4038; margin-bottom:14px;}
.committee-card span.link{font-size:14px; font-weight:600; color:var(--vermilion);}

/* ---------- Donor tiers ---------- */
.tiers{display:grid; grid-template-columns: repeat(4,1fr); gap:20px;}
.tier{background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:4px; padding:26px 22px;}
.tier .tier-name{font-family:'Fraunces', serif; font-size:19px; color:var(--maroon); margin-bottom:8px;}
.tier .tier-desc{font-size:14px; color:#5A4038;}
.tier:nth-child(1){border-top:4px solid #B08D57;}
.tier:nth-child(2){border-top:4px solid #C7C7C7;}
.tier:nth-child(3){border-top:4px solid var(--marigold);}
.tier:nth-child(4){border-top:4px solid var(--vermilion);}

/* ---------- Donor levels ---------- */
.donor-note{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-left:4px solid var(--marigold);
  border-radius:4px; padding:18px 22px; margin-bottom:22px; font-size:15px; color:#4A342E;
}
.donor-note strong{color:var(--maroon);}
.donor-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-top:8px;}
.donor-card{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:6px; overflow:hidden;
  display:flex; flex-direction:column;
}
.donor-head{
  padding:22px 18px 18px; text-align:center; color:var(--ivory);
  background:linear-gradient(180deg, var(--maroon), #3A0F14);
}
.donor-level{font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--marigold); margin-bottom:6px;}
.donor-amt{font-family:'Fraunces', serif; font-size:26px; color:var(--ivory);}
.donor-name{font-size:13.5px; color:#E7D9C4; font-style:italic; margin-top:4px;}
.donor-body{padding:18px 18px 22px; flex:1;}
.donor-carry{font-size:12.5px; color:#8A7A66; font-style:italic; margin-bottom:10px;}
.donor-section{margin-bottom:14px;}
.donor-section:last-child{margin-bottom:0;}
.donor-section-label{
  font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--marigold);
  border-bottom:1px solid rgba(92,26,34,0.12); padding-bottom:5px; margin-bottom:8px; font-weight:600;
}
.donor-section ul{padding-left:16px; font-size:13px; color:#4A342E; line-height:1.5;}
.donor-section li{margin-bottom:6px;}
.donor-section li:last-child{margin-bottom:0;}
.donor-footnotes{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:36px;}
.donor-fn{background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:6px; padding:22px 24px;}
.donor-fn h3{font-size:16px; margin-bottom:8px;}
.donor-fn p{font-size:14px; color:#5A4038;}
.tier-mini-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:8px;}
.tier-mini{
  flex:1; min-width:150px; background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:4px;
  padding:16px 18px; text-align:center;
}
.tier-mini .amt{font-family:'Fraunces', serif; color:var(--vermilion); font-size:19px;}
.tier-mini .name{font-size:12.5px; color:#5A4038; margin-top:4px;}
@media(max-width:980px){
  .donor-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:620px){
  .donor-grid{grid-template-columns:1fr;}
  .donor-footnotes{grid-template-columns:1fr;}
}

/* ---------- Events ---------- */
.events-list{display:flex; flex-direction:column;}
.event-row{display:grid; grid-template-columns: 130px 1fr; gap:26px; padding:26px 0; border-top:1px solid rgba(92,26,34,0.15);}
.event-row:last-child{border-bottom:1px solid rgba(92,26,34,0.15);}
.event-date{font-family:'Fraunces', serif; color:var(--vermilion); font-size:16px;}
.event-row h3{font-size:19px; margin-bottom:6px;}
.event-row p{color:#4A342E; font-size:15px;}

/* ---------- FAQ ---------- */
.faq-item{border-top:1px solid rgba(92,26,34,0.15);}
.faq-item:last-child{border-bottom:1px solid rgba(92,26,34,0.15);}
.faq-item summary{
  cursor:pointer; padding:22px 0; font-family:'Fraunces', serif; font-size:18px; color:var(--maroon);
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-size:22px; color:var(--vermilion); flex-shrink:0; transition:transform 0.2s ease;}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item .faq-body{padding-bottom:24px; color:#4A342E; max-width:70ch; font-size:15.5px;}

/* ---------- Survey snapshot ---------- */
.survey-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:8px;}
.survey-card{border-radius:6px; padding:26px 22px 22px; color:var(--ivory); min-height:190px; display:flex; flex-direction:column;}
.survey-card .pct{font-family:'Fraunces', serif; font-size:34px; font-weight:600; line-height:1;}
.survey-card .rule{width:38px; height:2px; background:rgba(255,255,255,0.55); margin:14px 0;}
.survey-card .desc{font-size:13.5px; line-height:1.4; flex:1;}
.survey-card .n{font-size:11.5px; font-style:italic; opacity:0.8; margin-top:14px;}
.tenure-wrap{margin-top:40px;}
.tenure-title{font-family:'Fraunces', serif; font-size:16px; color:var(--maroon); margin-bottom:14px;}
.tenure-bar{display:flex; height:36px; border-radius:4px; overflow:hidden;}
.tenure-seg{display:flex; align-items:center; justify-content:center; color:#fff; font-size:12.5px; font-weight:600;}
.tenure-labels{display:flex; margin-top:8px;}
.tenure-labels span{font-size:12.5px; color:#5A4038; text-align:center;}
@media(max-width:900px){
  .survey-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .survey-grid{grid-template-columns:1fr;}
  .tenure-labels{display:none;}
}

/* ---------- Cumulative hours ---------- */
.hours-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.hours-card{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-top:4px solid var(--vermilion);
  border-radius:6px; padding:32px 24px; text-align:center; text-decoration:none; display:block;
}
.hours-card:nth-child(2){border-top-color:var(--marigold);}
.hours-card:nth-child(3){border-top-color:var(--teal);}
.hours-card .num{font-family:'Fraunces', serif; font-size:36px; color:var(--maroon);}
.hours-card .label{font-size:15.5px; color:var(--maroon); margin-top:10px; font-weight:600;}
.hours-card .sub{font-size:13px; color:#5A4038; margin-top:6px;}
@media(max-width:900px){
  .hours-grid{grid-template-columns:1fr;}
}

/* ---------- Timeline diagram ---------- */
.timeline{position:relative; max-width:800px; margin-top:10px;}
.timeline::before{
  content:""; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:var(--gold-line);
}
.tl-item{position:relative; padding:0 0 44px 44px;}
.tl-item:last-child{padding-bottom:4px;}
.tl-dot{
  position:absolute; left:0; top:2px; width:20px; height:20px; border-radius:50%;
  background:var(--ivory); border:3px solid var(--vermilion);
}
.tl-item.milestone .tl-dot{background:var(--vermilion); border-color:var(--marigold); width:22px; height:22px; left:-1px;}
.tl-item.tentative .tl-dot{background:var(--ivory); border:3px dashed var(--maroon);}
.tl-date{font-family:'Fraunces', serif; color:var(--vermilion); font-size:15px; margin-bottom:4px;}
.tl-item h3{font-size:19px; margin-bottom:6px;}
.tl-item p{color:#4A342E; font-size:15px; max-width:56ch;}
.tl-tag{
  display:inline-block; margin-left:10px; font-size:11.5px; font-weight:600; color:var(--maroon);
  background:rgba(226,154,60,0.28); padding:2px 8px; border-radius:20px; vertical-align:middle;
}

/* ---------- Fundraising dashboard ---------- */
.fund-panel{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:6px; padding:34px;
}
.fund-top{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:16px; margin-bottom:18px;}
.fund-amount{font-family:'Fraunces', serif; font-size:40px; color:var(--vermilion);}
.fund-goal{font-size:14.5px; color:#5A4038;}
.fund-bar-track{width:100%; height:14px; background:#EADFC8; border-radius:20px; overflow:hidden; margin-bottom:10px;}
.fund-bar-fill{height:100%; background:linear-gradient(90deg, var(--marigold), var(--vermilion)); border-radius:20px; transition:width 0.4s ease;}
.fund-meta{display:flex; justify-content:space-between; font-size:13.5px; color:#5A4038;}
.pledge-form{display:flex; gap:12px; margin-top:26px; flex-wrap:wrap;}
.pledge-form input{
  flex:1; min-width:160px; padding:12px 14px; border:1px solid rgba(92,26,34,0.25); border-radius:3px; font-size:15px;
  font-family:'Work Sans', sans-serif; background:var(--ivory);
}
.pledge-form button{
  padding:12px 22px; background:var(--maroon); color:var(--ivory); border:none; border-radius:3px;
  font-weight:600; font-size:15px; cursor:pointer;
}
.pledge-form button:hover{background:var(--vermilion);}
.pledge-list{margin-top:24px; border-top:1px solid rgba(92,26,34,0.12);}
.pledge-row{display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid rgba(92,26,34,0.12); font-size:14.5px;}
.pledge-row span:first-child{color:var(--ink);}
.pledge-row span:last-child{color:var(--vermilion); font-weight:600;}
.demo-note{
  margin-top:18px; font-size:13px; color:#8A5A3E; background:rgba(226,154,60,0.18);
  padding:12px 16px; border-radius:4px;
}

/* ---------- Committee page roster ---------- */
.roster-grid{display:grid; grid-template-columns: repeat(3,1fr); gap:22px;}
.roster-card{
  background:var(--ivory); border:1px solid rgba(92,26,34,0.15); border-radius:4px; padding:24px;
  text-align:center;
}
.roster-avatar{
  width:56px; height:56px; border-radius:50%; background:var(--cream); border:1.5px dashed var(--gold-line);
  margin:0 auto 14px; display:flex; align-items:center; justify-content:center; color:var(--marigold); font-size:20px;
  font-family:'Fraunces', serif;
}
.roster-card .role{font-family:'Fraunces', serif; color:var(--maroon); font-size:16.5px; margin-bottom:4px;}
.roster-card .name{font-size:13.5px; color:#8A7A66; font-style:italic;}
.subgroup-note{
  margin-top:14px; font-size:13.5px; color:#5A4038; background:rgba(31,75,67,0.08); padding:12px 16px; border-radius:4px;
}

/* ---------- Footer ---------- */
footer{background:var(--maroon); color:#EADFC8; padding:60px 0 30px;}
.footer-grid{display:grid; grid-template-columns: 1.4fr 1fr 1fr; gap:40px; padding-bottom:40px;}
footer h4{font-family:'Fraunces', serif; color:var(--ivory); font-size:16px; margin-bottom:16px; font-weight:600;}
footer .brand{color:var(--ivory);}
footer .brand small{color:var(--marigold);}
footer p{font-size:14.5px; color:#D9C7B3; max-width:38ch;}
footer ul{list-style:none;}
footer li{margin-bottom:10px; font-size:14.5px;}
footer a{text-decoration:none; color:#D9C7B3;}
footer a:hover{color:var(--marigold);}
.footer-base{
  border-top:1px solid rgba(255,255,255,0.15); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:13px; color:#B99C81;
}

/* ---------- Responsive ---------- */
@media(max-width:1080px){
  .menu-toggle{display:flex;}
  nav.links{display:none;}
}
@media(min-width:1081px){
  .mobile-menu{display:none !important;}
}
@media(max-width:900px){
  .hero{grid-template-columns:1fr; padding-top:40px;}
  .hero-art{order:-1;}
  .about-grid{grid-template-columns:1fr; gap:36px;}
  .pillar-row{grid-template-columns: 1fr;}
  .involve-grid{grid-template-columns:1fr;}
  .involve-card{border-right:none; border-bottom:1px solid rgba(255,255,255,0.18);}
  .tiers{grid-template-columns:1fr 1fr;}
  .committee-grid{grid-template-columns:1fr;}
  .roster-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
}