:root{
  --bg: #f4efe6;
  --ink: #2b2a26;
  --muted: #6c675f;

  --teal: #1f6f73;
  --teal-dark: #145458;

  --rust: #a3572d;
  --rust-dark: #7d3e1f;

  --gold: #c79a2b;
  --rule: rgba(45,40,34,0.12);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--ink);
  background: var(--bg);
  font-family: ui-serif, Georgia, "Times New Roman", Times, serif;
  line-height:1.55;
}
body:before{
  content:"";
  position:fixed; inset:0;
  background:
    radial-gradient(circle at 20% 10%, rgba(0,0,0,0.03), transparent 40%),
    radial-gradient(circle at 80% 30%, rgba(0,0,0,0.025), transparent 45%),
    radial-gradient(circle at 40% 80%, rgba(0,0,0,0.02), transparent 50%);
  pointer-events:none;
}

.wrap{max-width:1280px; margin:0 auto; padding:0 22px;}

.site-header{padding:26px 0 0;}
.header-row{display:flex; align-items:center; justify-content:space-between; gap:20px;}
.brand{display:flex; align-items:center; gap:14px;}
.brand-logo{width:58px; height:58px; border-radius:50%;}
.brand-name{font-size:30px; color:var(--teal); letter-spacing:0.2px;}
.brand-tag{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  font-size:13px; color:var(--muted); margin-top:2px;
}

.top-nav{display:flex; gap:18px; align-items:center;}
.top-nav a{ text-decoration:none; color:var(--rust-dark); font-size:18px;}
.top-nav a.active{
  color:var(--teal-dark);
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:6px;
}
.rule{border-bottom:1px solid var(--rule); margin-top:16px;}

.hero{padding:8px 0 26px;}
.hero h1{margin:0; font-size:54px; line-height:1.08; color:var(--teal-dark);}
.lead{font-size:20px; color:var(--muted); max-width:88ch;}
.hero-link a, .cta a, .page-body a{
  color:var(--rust);
  text-decoration:underline;
  text-underline-offset:6px;
  text-decoration-thickness:2px;
}
.hero-link{margin-top:10px}

.divider{display:flex; align-items:center; gap:14px; padding:10px 0 10px;}
.divider .line{flex:1; height:1px; background:rgba(199,154,43,0.55);}
.divider .zia{
  width:18px; height:18px; border-radius:50%;
  background: radial-gradient(circle, var(--gold) 0 45%, transparent 46% 100%);
  position:relative;
}
.divider .zia:before, .divider .zia:after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(var(--gold),var(--gold)) center/2px 100% no-repeat,
    linear-gradient(var(--gold),var(--gold)) center/100% 2px no-repeat;
  opacity:0.85;
}

.section{padding:14px 0 8px;}
.section-title{text-align:center; font-size:38px; color:var(--teal); margin:18px 0 22px;}

.icon-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; align-items:start;}
.icon-item{text-align:center; padding:10px 10px 0;}
.icon-badge{
  width:44px; height:44px; margin:0 auto 10px; border-radius:50%;
  background:rgba(199,154,43,0.18);
  display:flex; align-items:center; justify-content:center;
  color:var(--rust);
  font-size:20px;
}
.icon-item h3{margin:8px 0 6px; color:var(--rust); font-size:22px;}
.icon-item p{margin:0; color:var(--muted); font-size:15px;}

.program-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.program h3{margin:14px 0 6px; color:var(--rust); font-size:24px;}
.program p{margin:0 0 10px; color:var(--muted);}
.program-photo{
  width:100%; aspect-ratio: 16/10; border-radius:8px;
  background: rgba(31,111,115,0.10);
  border:1px solid rgba(31,111,115,0.15);
}
.program-photo.placeholder{
  background: linear-gradient(135deg, rgba(31,111,115,0.12), rgba(199,154,43,0.10));
}

.join{padding:26px 0 40px; text-align:center;}
.join h2{margin:0; font-size:40px; color:var(--teal);}
.join p{margin:10px 0 0; color:var(--muted); font-size:16px;}
.join .cta{margin-top:12px}

.page-hero{padding:40px 0 10px;}
.page-hero h1{margin:0; font-size:44px; color:var(--teal-dark);}

.page-body{padding:18px 0 50px;}
.page-body h2{color:var(--teal); margin-top:26x;}
.page-body h3{color:var(--rust); margin-top:18px;}
.page-body p,
.page-body ul,
.page-body blockquote,
.callout{
  max-width: 100%;
}

.site-footer{
  border-top:1px solid var(--rule);
  padding:18px 0;
  background: rgba(0,0,0,0.02);
}
.footer-row{display:flex; justify-content:space-between; align-items:center; gap:12px;}
.site-footer a{color:var(--muted); text-decoration:none;}
.site-footer a:hover{color:var(--teal-dark); text-decoration:underline; text-underline-offset:5px;}
.sep{margin:0 8px; color:rgba(0,0,0,0.25);}

@media (max-width: 900px){
  .icon-grid{grid-template-columns:repeat(2,1fr);}
  .program-grid{grid-template-columns:1fr;}
  .hero h1{font-size:42px;}
  .brand-name{font-size:24px;}
  .header-row{flex-direction:column; align-items:flex-start;}
  .top-nav{flex-wrap:wrap;}
}
.bb-section {
  margin: 2.2rem 0;
  padding-top: 1.4rem;
  border-top: 1px solid rgba(0,0,0,0.12);
}

.bb-section-title {
  margin: 0 0 1rem;
  font-size: 1.6rem;
  letter-spacing: 0.02em;
}

.bb-section-body > :first-child {
  margin-top: 0;
}
/* tighten vertical rhythm on page-style content */
.page-body{
  padding: 1px 0 1x; /* was roomy, this pulls it in */
}

/* headings: kill the huge top margins */
.page-body h1{ margin: 0 0 10px; }
.page-body h2{ margin: 18px 0 1px; }
.page-body h3{ margin: 14px 0 8px; }

/* paragraphs and lists: reduce the air */
.page-body p{ margin: 0 0 10px; }
.page-body ul{ margin: 0 0 10px; padding-left: 20px; }
.page-body li{ margin: 6px 0; }

/* callouts and quotes: less padding and less margin */
.page-body blockquote,
.bb-quote{
  margin: 12px 0;
  padding: 10px 14px;
}

.callout,
.bb-callout{
  margin: 12px 0;
  padding: 10px 14px;
}

/* divider: tighten */
.divider,
.bb-divider{
  margin: 14px 0;
}
/* Events feed layout */
.events-feed{
  margin-top: 1.25rem;
  border-top: 1px solid rgba(0,0,0,.12);
}

.event-row{
  padding: 1.1rem 0;
  border-bottom: 1px solid rgba(0,0,0,.12);
}

.event-row-title{
  margin: 0 0 .35rem 0;
  font-size: 1.15rem;
  line-height: 1.25;
}

.event-row-meta{
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .55rem;
  font-size: .95rem;
  opacity: .85;
  margin-bottom: .55rem;
}

.event-row-sep{
  opacity: .5;
}

.event-row-details summary{
  cursor: pointer;
  text-decoration: underline;
  font-size: .95rem;
  opacity: .85;
}

.event-row-desc{
  margin-top: .6rem;
  padding-left: .05rem;
}

.event-row-desc p{
  margin: .65rem 0;
}
/* Events page list layout */
.events-page .events-feed{
  margin-top: 18px;
  border-top: 2px solid rgba(0,0,0,.25);
}

.events-page .event-item{
  padding: 18px 0;
  border-bottom: 1px solid rgba(0,0,0,.25);
}

.events-page .event-name{
  font-weight: 700;
  font-size: 18px;
  margin: 0 0 6px 0;
}

.events-page .event-when{
  font-weight: 800;
  font-size: 22px;
  line-height: 1.2;
  margin: 0 0 10px 0;
}

.events-page .event-location{
  margin: 0 0 10px 0;
  opacity: .85;
}

.events-page .event-description{
  margin: 0 0 10px 0;
}

.events-page .event-more a{
  text-decoration: underline;
}