/* ============================================================
   EASTON MOUNTAIN — Design System Stylesheet
   easton.css  |  v1.0

   TABLE OF CONTENTS
   -----------------
    1.  Custom Properties (Design Tokens)
    2.  Reset & Base
    3.  Typography Utilities
    4.  Button System
    5.  Link Utilities
    6.  Header & Navigation
    7.  Hero
    8.  Section: Founder Quote
    9.  Section: Community Grid
   10.  Section: Upcoming Events & Event Card
   11.  Section: Testimonial
   12.  Section: Blog Cards (Homepage)
   13.  Footer
   14.  Article / Blog Post Pages
   15.  Staff & Facilitator Profile Pages
   ============================================================ */


/* ============================================================
   1. CUSTOM PROPERTIES
   ============================================================ */
:root {
  /* Brand Colors */
  --cream:          #FAF6F1;
  --sand:           #F2E8D9;
  --brown-dark:     #2C2825;
  --brown-mid:      #3D3530;
  --brown-light:    #7A6E65;
  --tan:            #8C6E4A;
  --muted:          #A89B90;
  --border:         #E8D5B7;
  --olive:          #6B7A3D;
  --green:          #5eb938;
  --green-dark:     #4a9c2c;
  --terracotta:     #B5623E;
  --purple:         #a145c2;

  /* Footer Palette */
  --footer-bg:      #2C2825;
  --footer-text:    #D8CFC5;
  --footer-label:   #8FA8B5;
  --footer-muted:   #A89B90;
  --footer-legal:   #7A6E65;
  --footer-divider: #3D3530;

  /* Typography */
  --font-serif:     'Cormorant Garamond', Georgia, serif;
  --font-sans:      'Lato', system-ui, sans-serif;

  /* Layout */
  --container-wide:    1240px;
  --container-blog:     760px;
  --container-profile:   760px;
  --container-mid:   1100px;

  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
}


/* ============================================================
   2. RESET & BASE
   ============================================================ */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-sans)!important;
  background: var(--cream) !important;
  color: var(--brown-dark)!important;
  width: 100%;
}

a {
  text-decoration: none;
  color: var(--green);
}
a:hover { 
  color: var(--green-dark); 
}

img { 
  display: block; max-width: 100%; 
}


/* ============================================================
   3. TYPOGRAPHY UTILITIES
   ============================================================ */
.section-label {
  display: block;
  font-family: var(--font-sans)!important;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--olive);
  margin-bottom: 10px;
}

.section-title {
  font-family: var(--font-serif)!important;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 400;
  color: var(--brown-mid);
  line-height: 1.1;
  margin: 0;
}

.section-title--lg {
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 600;
  color: var(--brown-mid);
  line-height: 1.1;
  margin: 0;
}

/* Flex row with title on left, link on right */
.section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 40px;
}
.section-header--baseline {
  align-items: baseline;
  margin-bottom: 44px;
}

.linked-continue {
  display: block;
  margin: 56px 0;
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3.8vw, 3rem);
  font-weight: 600;
  color: var(--brown-mid);
  text-decoration: none;
  text-align: center;
}

.linked-continue:hover {
  color: var(--green);
}

.mono {
    font-family: ui-monospace, 'Courier New', Courier, monospace;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--terracotta);
}


/* ============================================================
   4. BUTTON SYSTEM
   ============================================================ */

/* Base — medium size by default (nav CTA) */
.btn {
  display: inline-block;
  font-family:  var(--font-sans)!important;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 12px 26px;
  border-radius: var(--radius-sm);
  line-height: 1;
  border: none;
  cursor: pointer;
  transition: opacity 0.15s ease;
}
.btn:hover { opacity: 0.88; }

/* Size modifiers */
.btn--lg { font-size: 14px; padding: 14px 30px; }
.btn--sm { font-size: 13px; padding: 10px 20px; }

/* Color modifiers */
.btn--green   { 
  color: var(--cream); 
  background: var(--green); 
}
.btn--outline { 
  color: var(--cream);  
  background: transparent; 
  border: 1.5px solid var(--cream);  
}
.btn--purple  { 
  color: var(--cream);  
  background: var(--purple); 
}


/* ============================================================
   5. LINK UTILITIES
   ============================================================ */
.link-arrow {
  font-family: var(--font-sans);
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--olive);
}
.link-arrow:hover { 
  color: var(--green); 
}

/* Underlined gallery/gallery-style links */
.link-underline {
  font-family: var(--font-sans) !important;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--olive);
  border-bottom: 1px solid var(--olive);
  padding-bottom: 2px;
  white-space: nowrap;
}

/* Breadcrumb back link */
.link-back {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--olive);
}
.link-back:hover { color: var(--green); }


/* ============================================================
   6. HEADER & NAVIGATION
   ============================================================ */
.site-header {
  position: relative;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 48px;
  background: var(--cream);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;
}

.site-header__logo {
  height: 64px;
  width: auto;
  object-fit: contain;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 34px;
}

.nav-item {
  position: relative;
  padding: 6px 0 14px; /* extended bottom padding bridges the gap */
}

.nav-label {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--brown-dark);
  cursor: default;
}

.nav-link {
  font-family: var(--font-sans) !important;
  font-size: 14px;
  font-weight: 500 !important;
  color: var(--brown-dark) !important;
}
.nav-link:hover { color: var(--olive); }

.nav-dropdown {
  position: absolute;
  top: 100%;
  left: -16px;
  z-index: 200;        /* ← add this */
  margin-top: 0;
  background: var(--cream);
  border-radius: var(--radius-md);
  box-shadow: 0 8px 24px rgba(44,40,37,0.16);
  padding: 8px 0;
  min-width: 220px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0.25s;
}
.nav-item:hover .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0s;
}
.nav-dropdown a {
  display: block;
  padding: 9px 20px;
  font-family: var(--font-sans) !important;
  font-size: 13.5px;
  font-weight: 400 !important;
  color: var(--brown-mid) !important;
  white-space: nowrap;
}
.nav-dropdown a:hover {
  background: var(--sand);
  color: var(--brown-mid);
}


/* ============================================================
   7. HERO
   ============================================================ */
.hero {
  position: relative;
  height: 640px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(44,40,37,0.05) 0%, rgba(44,40,37,0.75) 100%);
}

.hero__content {
  position: relative;
  z-index: 2;
  padding: 0 48px 64px;
  max-width: 900px;
}

.hero__title {
  font-family: var(--font-serif);
  font-size: clamp(2.6rem, 5.5vw, 4.4rem);
  font-weight: 700;
  color: var(--cream); 
  line-height: 1.08;
  letter-spacing: -0.01em;
  margin: 0 0 16px;
}

.hero__subtitle {
  font-family: var(--font-sans) !important;
  font-size: clamp(1.15rem, 1.9vw, 1.4rem);
  font-weight: 400;
  color: var(--sand);
  margin: 0 0 28px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}


/* ============================================================
   8. SECTION: FOUNDER QUOTE
   ============================================================ */
.section-founder-quote {
  background: var(--brown-dark);
  padding: 80px 48px;
  display: flex;
  justify-content: center;
}

.founder-quote {
  max-width: var(--container-blog);
  text-align: center;
}

.founder-quote__text {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.6rem, 3.4vw, 2.4rem);
  color: var(--sand);
  line-height: 1.5;
  margin: 0 0 24px;
}

.founder-quote__attribution {
  font-family: var(--font-sans) !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--terracotta);
}


/* ============================================================
   9. SECTION: COMMUNITY GRID
   ============================================================ */
.section-community {
  background: var(--sand);
  padding: 80px 48px 72px;
}

.section-community__inner {
  max-width: var(--container-mid);
  margin: 0 auto;
}

.photo-grid-main {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  grid-template-rows: repeat(3, 180px);
  gap: 12px;
}

.photo-grid-main__tall {
  grid-row: 1 / 4;
  grid-column: 1 / 2;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.photo-grid-main__tall img { 
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
}

.photo-grid-main__cell {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.photo-grid-main__cell img { 
  width: 100%; height: 100%; 
  object-fit: cover; 
}

.photo-grid-bottom {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 12px;
}

.photo-grid-bottom__cell {
  height: 140px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.photo-grid-bottom__cell img { 
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
}

.community-caption {
  margin-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.community-caption__text {
  font-family: var(--font-serif);
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-style: italic;
  color: var(--brown-light);
  line-height: 1.5;
  max-width: 560px;
  margin: 0;
}


/* ============================================================
   10. SECTION: UPCOMING EVENTS & EVENT CARD
   ============================================================ */
.section-events {
  padding: 88px 48px;
}

.section-events__inner {
  max-width: var(--container-wide);
  margin: 0 auto;
}

.events-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.event-card {
  display: block;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--sand);
  border: 1px solid var(--brown-light);
  box-shadow: 0 2px 10px rgba(44,40,37,0.08);
  text-decoration: none;
}

.event-card__image-wrapper {
  position: relative;
  aspect-ratio: 1 / 1;
}

.event-card__image-frame {
  position: absolute;
  inset: 0;
  padding: 7.5%;   /* was: 12.5% 12.5% 0 12.5% */
  box-sizing: border-box;
}
.event-card__image-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius-sm);
}

.event-card__date-badge {
  position: absolute;
  top: 7px;
  left: 7px;
  background: var(--cream);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  text-align: center;
  line-height: 1.1;
  border: 1px solid var(--muted);
}

.event-card__month {
  font-family: var(--font-sans) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--terracotta);
}

.event-card__day {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--brown-mid);
}

.event-card__body { padding: 0 22px 18px; }

.event-card__title {
  font-family: var(--font-serif) !important;
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--brown-mid);
  line-height: 1.3;
  margin-bottom: 10px;
}

.event-card__desc {
  font-family: var(--font-sans) !important;
  font-size: 14px;
  color: var(--brown-mid);
  line-height: 1.6;
  margin: 0 0 10px;
}

.event-card__dates {
  font-family: var(--font-sans) !important;
  font-size: 12.5px;
  color: var(--tan);
  margin-bottom: 16px;
}





    .event-additional-notes p {
      font-family: var(--font-sans);
      font-size: 16px;
      line-height: 1.8;
      color: var(--brown-mid);
      margin: 0 0 24px;
    }



.event-additional-notes__inner {
  max-width: var(--container-mid);
  margin: 0 auto;
}

/* ============================================================
   11. SECTION: TESTIMONIAL
   ============================================================ */
.section-testimonial {
  background: var(--sand);
  padding: 56px 48px;
  text-align: center;
}

.section-testimonial__quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  color: var(--terracotta);
  max-width: var(--container-blog);
  margin: 0 auto 16px;
  line-height: 1.5;
}

.section-testimonial__attribution {
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--olive);
}


/* ============================================================
   12. SECTION: BLOG CARDS (HOMEPAGE)
   ============================================================ */
.section-blog {
  background: var(--cream);
  padding: 88px 48px;
}

.section-blog__inner {
  max-width: var(--container-wide);
  margin: 0 auto;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.blog-card { 
  display: block; 
  text-decoration: none; 
}

.blog-card__image {
  height: 190px;
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 18px;
}
.blog-card__image img { width: 100%; height: 100%; object-fit: cover; }

.blog-g-review__image {
  height: 600px;
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 18px;
}
.blog-g-review__image img { 
  width: 100%; height: 100%; 
  object-fit: cover; 
}

.blog-card__date {
  font-family: var(--font-sans);
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 8px;
}

.blog-card__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 1.4rem;
  color: var(--brown-mid);
  line-height: 1.3;
  margin-bottom: 10px;
}

.blog-card__excerpt {
  font-family: var(--font-sans);
  font-size: 14.5px;
  color: var(--brown-dark);
  line-height: 1.6;
  margin: 0 0 12px;
}


/* ============================================================
   13. FOOTER
   ============================================================ */
.site-footer {
  background: var(--footer-bg);
  padding: 72px 48px 32px;
}

.footer-grid {
  max-width: var(--container-wide);
  margin: 0 auto 56px;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr;
  gap: 32px;
}

.footer-brand__name {
  font-family: var(--font-serif);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--cream);
  margin-bottom: 14px;
}

.footer-brand__tagline {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--footer-muted);
  line-height: 1.7;
  max-width: 280px;
}

.footer-col__label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--footer-label);
  margin-bottom: 16px;
}

.footer-col__links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.footer-col__links + .footer-col__links { margin-top: 20px; }

.footer-col__links a {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--footer-text);
}
.footer-col__links a:hover { 
  color: var(--cream); 
}

.footer-col__address {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--footer-text);
  line-height: 1.6;
}

.footer-bottom {
  max-width: var(--container-wide);
  margin: 0 auto;
  padding-top: 24px;
  border-top: 1px solid var(--footer-divider);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-bottom span {
  font-family: var(--font-sans);
  font-size: 11.5px;
  color: var(--footer-legal);
  letter-spacing: 0.04em;
}


/* ============================================================
   14. ARTICLE / BLOG POST PAGES
   ============================================================ */
.article__breadcrumb {
  max-width: var(--container-blog);
  margin: 0 auto;
  padding: 32px 48px 0;
}

.article__header {
  max-width: var(--container-blog);
  margin: 0 auto;
  padding: 24px 48px 32px;
}

.article__categories {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

.category-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--olive);
}

.category-sep {
  font-size: 11px;
  color: var(--tan);
}

.article__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  color: var(--brown-mid);
  margin: 0 0 18px;
  line-height: 1.1;
}

.article__byline {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--tan);
}
.article__byline strong { 
  font-weight: 600; color: var(--brown-mid); 
}
.article__byline-sep { color: var(--tan); }

.article__hero {
  max-width: var(--container-blog);
  margin: 0 auto;
  padding: 0 48px 36px;
}
.article__hero img {
  width: 100%;
  border-radius: var(--radius-lg);
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.article__body {
  max-width: var(--container-mid);
  margin: 0 auto;
  padding: 0 48px;
}
.article__body p {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.8;
  color: var(--brown-mid);
  margin: 0 0 24px;
}
.article__body p.intro {
  font-family: var(--font-serif);
  font-size: 17px;
  font-style: italic;
  line-height: 1.7;
  margin-bottom: 28px;
  font-weight: 400 !important;
}

/* Pull quote */
.pull-quote{
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.4rem, 2.4vw, 1.85rem);
  font-weight: 400;
  color: var(--brown-mid);
  line-height: 1.45;
  text-align: center;
  padding: 40px 0;
  margin: 8px 0 32px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

/* WordPress pull quote block */
.wp-block-pullquote {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 40px 0;
  margin: 8px 0 32px;
  text-align: center;
  border-left: none;
  border-right: none;
}

.wp-block-pullquote blockquote p {
  font-family: var(--font-serif) !important;
  font-style: italic;
  font-size: clamp(1.4rem, 2.4vw, 1.85rem) !important;
  font-weight: 400 !important;
  color: var(--brown-mid) !important;
  line-height: 1.45;
  margin: 0;
}

/* Inline photo layouts */
.photo-wide {
  margin: 32px 0 36px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.photo-wide img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.photo-3up {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 32px 0 36px;
}
.photo-3up__item {
  border-radius: var(--radius-md);
  overflow: hidden;
  aspect-ratio: 1 / 1;
}
.photo-3up__item img { width: 100%; height: 100%; object-fit: cover; }

.photo-closing {
  margin: 40px 0 48px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.photo-closing img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
  max-height: 560px;
}

/* Article attribution block */
.article__attribution {
  max-width: var(--container-mid);
  margin: 48px auto 0;
  padding: 32px 48px 0;
  border-top: 1px solid var(--border);
}
.article__attribution p {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--brown-light);
  line-height: 1.7;
  margin: 0 0 10px;
}

/* Author bio card */
.author-bio {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  background: var(--sand);
  border-radius: var(--radius-lg);
  padding: 28px;
  margin-top: 48px;
}
.author-bio__photo {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.author-bio__text p {
  font-family: var(--font-sans);
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--brown-mid);
  margin: 0 0 6px;
}
.author-bio__text p:last-child { margin: 0; }

/* Related posts */
.related-posts {
  max-width: var(--container-blog);
  margin: 56px auto 88px;
  padding: 0 48px;
}
.related-posts__label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--tan);
  margin-bottom: 24px;
}
.related-posts__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

.related-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--cream);
}
.related-card__image {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.related-card img {
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
}
.related-card__body { padding: 18px 0 0; }
.related-card__date {
  font-family: var(--font-sans);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tan);
  margin-bottom: 8px;
}
.related-card__title {
  font-family: var(--font-serif);
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--brown-mid);
  margin: 0 0 8px;
  line-height: 1.25;
}
.related-card__excerpt {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--brown-light);
  line-height: 1.65;
  margin: 0 0 12px;
}
.related-card__read-more {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  color: var(--green);
  letter-spacing: 0.02em;
}
.related-card__read-more:hover { color: var(--green-dark); }


/* ============================================================
   15. STAFF & FACILITATOR PROFILE PAGES
   ============================================================ */
.profile {
  max-width: var(--container-profile);
  margin: 0 auto;
  padding: 36px 48px 96px;
}

.profile__breadcrumb { margin-bottom: 22px; }

.profile__section-label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--olive);
  margin-bottom: 14px;
}

.profile__name {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  color: var(--brown-mid);
  margin: 0 0 10px;
  line-height: 1.05;
}

.profile__title {
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 700;
  color: var(--olive);
  margin-bottom: 36px;
}

.profile__photo {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  margin-bottom: 40px;
}

.profile__body p {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.8;
  color: var(--brown-mid);
  margin: 0 0 24px;
}






/* ============================================================
   16. MISSION / ABOUT PAGES
   ============================================================ */
    /* ── PAGE HERO ── */
    .page-hero {
      padding: 72px 48px 60px;
      background: var(--cream);
      border-bottom: 1px solid var(--border);
    }
    .page-hero__inner {
      max-width: var(--container-blog);
      margin: 0 auto;
    }
    .page-hero__title {
      font-family: var(--font-serif);
      font-size: clamp(2.8rem, 5.5vw, 4.2rem);
      font-weight: 600;
      color: var(--brown-mid);
      line-height: 1.05;
      margin: 8px 0 0;
    }

    /* ── CONTENT SECTIONS ── */
    .content-section {
      padding: 72px 48px;
    }
    .content-section--cream { background: var(--cream); }
    .content-section--sand  { background: var(--sand); }
    .content-section--dark  { background: var(--brown-dark); }

    .content-section__inner {
      max-width: var(--container-blog);
      margin: 0 auto;
    }

    /* ── CONTENT BODY TEXT ── */
    .content-body p {
      font-family: var(--font-sans);
      font-size: 16px;
      line-height: 1.8;
      color: var(--brown-mid);
      margin: 0 0 24px;
    }
    .content-body p:last-child { margin-bottom: 0; }
    .content-body a {
      color: var(--olive);
      border-bottom: 1px solid currentColor;
      padding-bottom: 1px;
    }
    .content-body a:hover { color: var(--green); }

    /* ── MISSION: FOUNDER QUOTE ── */
    .mission-quote {
      padding: 36px 0 36px 28px;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      border-left: 3px solid var(--terracotta);
      margin: 40px 0 16px;
    }
    .mission-quote__text {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: clamp(1.1rem, 1.8vw, 1.35rem);
      line-height: 1.75;
      color: var(--brown-mid);
      margin: 0 0 16px;
    }
    .mission-quote__attribution {
      font-family: var(--font-sans);
      font-size: 11.5px;
      font-weight: 700;
      letter-spacing: 0.13em;
      text-transform: uppercase;
      color: var(--terracotta);
    }

    /* ── MISSION: VALUES LIST ── */
    .values-list {
      list-style: none;
      padding: 0;
      margin: 32px 0 48px;
      border-top: 1px solid var(--border);
    }
    .values-list li {
      font-family: var(--font-sans);
      font-size: 15px;
      line-height: 1.65;
      color: var(--brown-mid);
      padding: 13px 0 13px 22px;
      border-bottom: 1px solid var(--border);
      position: relative;
    }
    .values-list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--olive);
    }

    /* ── MISSION: CLOSING STATEMENTS ── */
    .mission-statements {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1px;
      background: var(--border);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      overflow: hidden;
      margin-top: 0;
    }
    .mission-statement {
      background: var(--cream);
      font-family: var(--font-serif);
      font-size: clamp(1rem, 1.5vw, 1.2rem);
      font-weight: 400;
      font-style: italic;
      color: var(--brown-mid);
      line-height: 1.5;
      padding: 28px 28px;
    }

    /* ── PILLAR SECTIONS: COMMUNITY / RETREAT / SANCTUARY ── */
    .pillar-label {
      display: block;
      font-family: var(--font-sans);
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 10px;
    }
    .pillar-heading {
      font-family: var(--font-serif);
      font-size: clamp(2rem, 3.5vw, 2.8rem);
      font-weight: 400;
      color: var(--brown-mid);
      line-height: 1.15;
      margin: 0 0 12px;
    }
    .pillar-intro {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: clamp(1.05rem, 1.7vw, 1.25rem);
      color: var(--terracotta);
      line-height: 1.55;
      margin: 0 0 32px;
    }

    /* Community contributors list */
    .community-list {
      list-style: none;
      padding: 0;
      margin: 32px 0 0;
      border-top: 1px solid var(--border);
    }
    .community-list li {
      font-family: var(--font-sans);
      font-size: 15.5px;
      line-height: 1.75;
      color: var(--brown-mid);
      padding: 16px 0 16px 22px;
      border-bottom: 1px solid var(--border);
      position: relative;
    }
    .community-list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 24px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--olive);
    }
    .community-list a {
      color: var(--olive);
      border-bottom: 1px solid currentColor;
      padding-bottom: 1px;
    }
    .community-list a:hover { color: var(--green); }

    /* Retreat CTA line */
    .content-cta-line {
      font-family: var(--font-sans);
      font-size: 15px;
      color: var(--brown-mid);
      margin-top: 28px;
    }
    .content-cta-line a {
      font-weight: 700;
      color: var(--olive);
      border-bottom: 1px solid currentColor;
    }
    .content-cta-line a:hover { color: var(--green); }




/* ============================================================
   17. SCHOLARSHIP PAGE
   ============================================================ */


    /* ── CTA BLOCK (separated action area within a content section) ── */
    .cta-block {
      margin-top: 40px;
      padding-top: 40px;
      border-top: 1px solid var(--border);
    }
    .cta-block__lead {
      font-family: var(--font-sans);
      font-size: 16px;
      color: var(--brown-mid);
      line-height: 1.7;
      margin-bottom: 24px;
    }
    .cta-block__note {
      font-family: var(--font-sans);
      font-size: 13.5px;
      color: var(--muted);
      margin-top: 16px;
      line-height: 1.6;
    }


    
/* ============================================================
   18. BLOG
   ============================================================ */

.blog-index {
    padding: 64px 48px 96px;
    background: var(--cream);
}

.blog-index__inner {
    max-width: 1000px;
    margin: 0 auto;
}

.blog-row {
    display: flex;
    gap: 48px;
    align-items: flex-start;
    padding: 56px 0;
    border-bottom: 1px solid var(--border);
}

.blog-row:first-child {
    border-top: 1px solid var(--border);
}

.blog-row__image-link {
    flex-shrink: 0;
}

.blog-row__image {
    width: 280px;
    height: 210px;
    object-fit: cover;
    border-radius: var(--radius-lg);
    display: block;
}

.blog-row__content {
    flex: 1;
    min-width: 0;
    padding-top: 4px;
}

.blog-row__content .btn {
  align-self: flex-start;
}

.blog-row__date {
    font-family: var(--font-sans);
    font-size: 12px;
    color: var(--muted);
    letter-spacing: 0.04em;
    margin-bottom: 10px;
}

.blog-row__title {
    font-family: var(--font-serif);
    font-size: clamp(1.6rem, 2.8vw, 2.2rem);
    font-weight: 600;
    color: var(--brown-mid);
    line-height: 1.15;
    margin: 0 0 16px;
}

.blog-row__title a {
    color: var(--brown-mid);
}

.blog-row__title a:hover {
    color: var(--olive);
}

.blog-row__excerpt {
    font-family: var(--font-sans);
    font-size: 15.5px;
    color: var(--brown-light);
    line-height: 1.7;
    margin: 0 0 24px;
    max-width: 560px;
}




    /* ── BLOG ROW ── */
    .blog-row {
      display: flex;
      gap: 48px;
      align-items: flex-start;
      padding: 56px 0;
      border-bottom: 1px solid var(--border);
    }
    .blog-row:first-child { border-top: 1px solid var(--border); }

    /* Fixed-size image: fills the box, clips if wrong ratio */
    .blog-row__image-link { flex-shrink: 0; }
    .blog-row__image {
      width: 280px;
      height: 210px;
      object-fit: cover;
      border-radius: var(--radius-lg);
      display: block;
    }

    /* Content column */
    .blog-row__content {
      flex: 1;
      min-width: 0;
      padding-top: 4px;
    }
    .blog-row__date {
      font-family: var(--font-sans);
      font-size: 12px;
      color: var(--muted);
      letter-spacing: 0.04em;
      margin-bottom: 10px;
    }
    .blog-row__title {
      font-family: var(--font-serif);
      font-size: clamp(1.6rem, 2.8vw, 2.2rem);
      font-weight: 600;
      color: var(--brown-mid);
      line-height: 1.15;
      margin: 0 0 16px;
    }
    .blog-row__title a { color: var(--brown-mid); }
    .blog-row__title a:hover { color: var(--olive); }
    .blog-row__excerpt {
      font-family: var(--font-sans);
      font-size: 15.5px;
      color: var(--brown-light);
      line-height: 1.7;
      margin: 0 0 24px;
      max-width: 560px;
    }





   /* ============================================================
   19. BEST FRIENDS PACKAGES
   ============================================================ */ 
    /* ── WIDE INNER CONTAINER (for split layouts) ── */
    .content-section__inner--wide {
      max-width: 1000px;
      margin: 0 auto;
    }

    /* ── SPLIT LAYOUT (image/media left, content right) ── */
    .split-layout {
      display: flex;
      gap: 56px;
      align-items: flex-start;
    }
    .split-layout__media {
      flex: 0 0 400px;
    }
    .split-layout__content {
      flex: 1;
      min-width: 0;
      padding-top: 4px;
    }

    /* ── 2×2 PHOTO COLLAGE ── */
    .photo-2x2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
    .photo-2x2 img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: var(--radius-md);
      display: block;
    }

    /* ── LEAD STATEMENT (bold opening claim) ── */
    .lead-statement {
      font-family: var(--font-serif);
      font-size: clamp(1.2rem, 2vw, 1.5rem);
      font-weight: 600;
      color: var(--brown-mid);
      line-height: 1.45;
      margin: 0 0 24px;
    }

    /* ── PRICING CARD ── */
    .pricing-card {
      background: var(--sand);
      border: 2px solid var(--purple);
      border-radius: 16px;
      padding: 40px 48px;
      max-width: 640px;
      margin: 0 auto;
    }
    .pricing-card__title {
      font-family: var(--font-sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 24px;
    }
    .pricing-list {
      list-style: none;
      padding: 0;
      margin: 0;
      border-top: 1px solid var(--border);
    }
    .pricing-list li {
      padding: 16px 0 16px 22px;
      border-bottom: 1px solid var(--border);
      position: relative;
    }
    .pricing-list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 24px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--olive);
    }
    .pricing-list__amount {
      font-family: var(--font-sans);
      font-size: 16px;
      font-weight: 700;
      color: var(--brown-mid);
    }
    .pricing-list__type {
      font-weight: 700;
      color: var(--olive);
    }
    .pricing-list__note {
      display: block;
      font-family: var(--font-sans);
      font-size: 13px;
      font-style: italic;
      color: var(--brown-light);
      margin-top: 5px;
      line-height: 1.5;
    }

    /* ── FINE PRINT ── */
    .fine-print {
      font-family: var(--font-sans);
      font-size: 13px;
      line-height: 1.8;
      color: var(--brown-light);
      margin-top: 32px;
      padding-top: 32px;
      border-top: 1px solid var(--border);
    }
    .fine-print strong {
      color: var(--brown-mid);
      font-style: normal;
    }



    
   /* ============================================================
   20. SUPPORT US WHY PAGE
   ============================================================ */ 
    /* ── FULL-WIDTH IMAGE BREAK ── */
    .image-break {
      height: 420px;
      overflow: hidden;
    }
    .image-break img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      display: block;
    }

    /* ── SINGLE IMAGE IN SPLIT LAYOUT ── */
    .split-img {
      width: 100%;
      display: block;
      border-radius: var(--radius-lg);
      object-fit: cover;
    }
    .split-img--square { aspect-ratio: 1 / 1; }
    .split-img--rect   { aspect-ratio: 3 / 4; }

    /* ── WAYS LIST (action-oriented, link-forward list) ── */
    .ways-list {
      list-style: none;
      padding: 0;
      margin: 0;
      border-top: 1px solid var(--border);
    }
    .ways-list li {
      font-family: var(--font-sans);
      font-size: 15.5px;
      line-height: 1.7;
      color: var(--brown-mid);
      padding: 18px 0 18px 22px;
      border-bottom: 1px solid var(--border);
      position: relative;
    }
    .ways-list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 26px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--olive);
    }
    .ways-list__label {
      font-weight: 700;
      color: var(--brown-mid);
    }
    .ways-list a {
      font-weight: 700;
      color: var(--olive);
      border-bottom: 1px solid currentColor;
      padding-bottom: 1px;
    }
    .ways-list a:hover { color: var(--green); border-bottom-color: var(--green); }




       /* ============================================================
   21. VOLUNTEER PAGE
   ============================================================ */ 
    /* ── OUTLINE BUTTON (works on light backgrounds) ── */
    .btn--outline-olive {
      color: var(--olive);
      background: transparent;
      border: 1.5px solid var(--olive);
    }
    .btn--outline-olive:hover {
      background: var(--olive);
      color: var(--cream);
      opacity: 1;
    }

    /* ── TWO-PATH COMPARISON CARDS ── */
    .paths-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      margin-top: 28px;
    }
    .path-card {
      background: var(--cream);
      border-radius: var(--radius-lg);
      padding: 32px;
      border: 1px solid var(--border);
    }
    .path-card--primary { border-top: 3px solid var(--green); }
    .path-card--secondary { border-top: 3px solid var(--olive); }

    .path-card__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 10px;
    }
    .path-card__title {
      font-family: var(--font-serif);
      font-size: 1.5rem;
      font-weight: 600;
      color: var(--brown-mid);
      margin: 0 0 14px;
      line-height: 1.2;
    }
    .path-card p {
      font-family: var(--font-sans);
      font-size: 14.5px;
      line-height: 1.7;
      color: var(--brown-mid);
      margin: 0 0 20px;
    }

    /* ── VOLUNTEER EVENTS SECTION ── */
    .events-note {
      font-family: var(--font-sans);
      font-size: 13px;
      color: var(--muted);
      line-height: 1.7;
      margin-top: 24px;
      padding-top: 24px;
      border-top: 1px solid var(--border);
    }
    .events-note a {
      color: var(--olive);
      border-bottom: 1px solid currentColor;
    }



           /* ============================================================
   22. HOST YOUR EVENT PAGE
   ============================================================ */ 
    /* ── EVENT TYPE TICKER (CSS marquee, no JS) ── */
    .ticker-wrap {
      width: 100%;
      overflow: hidden;
      background: var(--brown-dark);
      padding: 22px 0;
    }
    .ticker {
      display: flex;
      width: max-content;
      animation: ticker-scroll 40s linear infinite;
    }
    .ticker:hover { animation-play-state: paused; }
    .ticker__item {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: 1.15rem;
      color: var(--sand);
      white-space: nowrap;
      padding: 0 12px;
    }
    .ticker__dot {
      color: var(--terracotta);
      padding: 0 12px;
      font-style: normal;
    }
    @keyframes ticker-scroll {
      0%   { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* ── FACILITIES GRID ── */
    .facilities-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-top: 36px;
    }
    .facility-card {
      padding: 28px;
      background: var(--cream);
      border-radius: var(--radius-lg);
      border: 1px solid var(--border);
    }
    .facility-card__name {
      font-family: var(--font-sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 8px;
    }
    .facility-card__title {
      font-family: var(--font-serif);
      font-size: 1.2rem;
      font-weight: 600;
      color: var(--brown-mid);
      margin: 0 0 10px;
      line-height: 1.2;
    }
    .facility-card__desc {
      font-family: var(--font-sans);
      font-size: 13.5px;
      line-height: 1.7;
      color: var(--brown-light);
      margin: 0;
    }
    .facility-card__desc a {
      color: var(--olive);
      border-bottom: 1px solid currentColor;
    }
    
    .facility-section .feature-row__text {
    flex: 1 1 0;
    min-width: 0;
}

.facility-section .feature-row__image {
    flex: 0 0 42%;
}

.facility-section .feature-row__image img {
    width: 100%;
    height: 340px;
    object-fit: cover;
    border-radius: 4px;
}





    /* ── INQUIRY CTA (dark section) ── */
    .inquiry-section {
      background: var(--brown-dark);
      padding: 88px 48px;
      text-align: center;
    }
    .inquiry-section__inner {
      max-width: 640px;
      margin: 0 auto;
    }
    .inquiry-section__label {
      font-family: var(--font-sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--terracotta);
      margin-bottom: 16px;
      display: block;
    }
    .inquiry-section__title {
      font-family: var(--font-serif);
      font-size: clamp(1.8rem, 3.5vw, 2.8rem);
      font-weight: 400;
      color: var(--sand);
      line-height: 1.2;
      margin: 0 0 16px;
    }
    .inquiry-section__sub {
      font-family: var(--font-sans);
      font-size: 15px;
      color: var(--muted);
      line-height: 1.7;
      margin: 0 0 36px;
    }
    .inquiry-section__sub a {
      color: var(--sand);
      border-bottom: 1px solid currentColor;
    }

    /* ── EVENT TYPE TAG STRIP (static, accessible fallback) ── */
    .event-type-strip {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 28px;
    }
    .event-type-tag {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: 1rem;
      color: var(--brown-mid);
      background: var(--cream);
      border: 1px solid var(--border);
      border-radius: 100px;
      padding: 6px 18px;
      white-space: nowrap;
    }







    
  /* ============================================================
   23. LODGING
   ============================================================ */ 
    /* ── LODGING JUMP NAV ── */
    .lodging-jump-nav {
      position: sticky;
      top: 0;
      z-index: 40;
      background: var(--brown-dark);
      padding: 0 48px;
      display: flex;
      align-items: center;
      gap: 4px;
    }
    .lodging-jump-nav__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--brown-light);
      padding: 14px 0;
      margin-right: 12px;
      white-space: nowrap;
    }
    .lodging-jump-nav a {
      font-family: var(--font-sans);
      font-size: 13px;
      font-weight: 700;
      color: var(--muted);
      text-decoration: none;
      padding: 14px 16px;
      border-bottom: 2px solid transparent;
      white-space: nowrap;
      transition: color 0.15s, border-color 0.15s;
    }
    .lodging-jump-nav a:hover {
      color: var(--cream);
      border-bottom-color: var(--green);
    }

    /* ── BUILDING SECTION HEADING & DESCRIPTION ── */
    .building__photo-placeholder {
      width: 100%;
      height: 300px;
      background: var(--border);
      border-radius: var(--radius-lg);
      margin-bottom: 36px;
    }
    .building__heading {
      font-family: var(--font-serif);
      font-size: clamp(1.8rem, 3.5vw, 2.6rem);
      font-weight: 600;
      color: var(--brown-mid);
      margin-bottom: 12px;
      line-height: 1.1;
    }
    .building__desc {
      font-family: var(--font-sans);
      font-size: 15px;
      color: var(--brown-light);
      line-height: 1.75;
      max-width: 680px;
      margin-bottom: 40px;
    }

    /* ── ROOM ROWS ── */
    .rooms { display: flex; flex-direction: column; }

    .room-row {
      display: flex;
      gap: 36px;
      align-items: flex-start;
      padding: 32px 0;
      border-top: 1px solid var(--border);
    }

    /* ── IMAGE BLOCK: main photo + thumbnail strip ── */
    .room-img-block {
      flex-shrink: 0;
      width: 240px;
    }
    .room-img-main {
      width: 240px;
      height: 180px;
      background: var(--border);
      border-radius: var(--radius-lg);
      margin-bottom: 8px;
      overflow: hidden;
      transition: background 0.2s ease;
    }
    /* When real images are added:
       .room-img-main img { width:100%; height:100%; object-fit:cover; display:block; } */

    .room-img-thumbs {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 6px;
    }
    .room-img-thumb {
      height: 40px;
      background: var(--border);
      border-radius: var(--radius-sm);
      cursor: pointer;
      border: 2px solid transparent;
      overflow: hidden;
      transition: border-color 0.15s;
      /* When real images are added:
         background-size: cover; background-position: center; */
    }
    .room-img-thumb:hover { border-color: var(--tan); }
    .room-img-thumb.active { border-color: var(--olive); }

    /* ── ROOM TEXT CONTENT ── */
    .room-row__content {
      flex: 1;
      min-width: 0;
      padding-top: 4px;
    }
    .room-row__name {
      font-family: var(--font-serif);
      font-size: 1.5rem;
      font-weight: 600;
      color: var(--brown-mid);
      margin-bottom: 6px;
      line-height: 1.15;
    }
    .room-row__meta {
      font-family: var(--font-sans);
      font-size: 11.5px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--tan);
      margin-bottom: 14px;
    }
    .room-row__meta span { margin: 0 6px; color: var(--border); }
    .room-row__desc {
      font-family: var(--font-sans);
      font-size: 14.5px;
      color: var(--brown-mid);
      line-height: 1.75;
      margin-bottom: 12px;
      max-width: 480px;
    }
    .room-row__amenities {
      font-family: var(--font-sans);
      font-size: 12.5px;
      color: var(--muted);
      line-height: 1.7;
      margin-bottom: 18px;
    }





    
           /* ============================================================
   23. FOOD AND DINING
   ============================================================ */ 

    /* ── DINING SPOTS STRIP ── */
    .dining-spots {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: clamp(1rem, 1.6vw, 1.15rem);
      color: var(--tan);
      line-height: 1.6;
      margin: 28px 0 0;
      padding: 20px 0 0;
      border-top: 1px solid var(--border);
    }

    /* ── CHEF GRID ── */
    .chef-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 36px;
      margin-top: 40px;
    }
    .chef-card {
      display: flex;
      gap: 20px;
      align-items: flex-start;
    }
    .chef-photo {
      width: 88px;
      height: 88px;
      border-radius: 50%;
      object-fit: cover;
      flex-shrink: 0;
      background: var(--border);
      display: block;
    }
    .chef-info { flex: 1; min-width: 0; }
    .chef-name {
      font-family: var(--font-serif);
      font-size: 1.2rem;
      font-weight: 600;
      color: var(--brown-mid);
      margin-bottom: 6px;
      line-height: 1.2;
    }
    .chef-bio {
      font-family: var(--font-sans);
      font-size: 13.5px;
      color: var(--brown-light);
      line-height: 1.7;
    }

    /* ── SAMPLE MENU CARDS ── */
    .menu-intro {
      font-family: var(--font-sans);
      font-size: 14.5px;
      color: var(--brown-light);
      line-height: 1.7;
      margin-bottom: 32px;
      font-weight: 400 !important;
    }
    .menu-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
    }
    .menu-card {
      background: var(--cream);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 32px;
    }
    .menu-card__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 4px;
    }
    .menu-card__title {
      font-family: var(--font-serif);
      font-size: 1.2rem;
      font-weight: 600;
      color: var(--brown-mid);
      margin-bottom: 24px;
      line-height: 1.2;
    }
    .menu-meal { margin-bottom: 20px; }
    .menu-meal:last-child { margin-bottom: 0; }
    .menu-meal__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--terracotta);
      margin-bottom: 8px;
      padding-bottom: 6px;
      border-bottom: 1px solid var(--border);
    }
    .menu-meal ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    .menu-meal li {
      font-family: var(--font-sans);
      font-size: 13px;
      color: var(--brown-mid);
      line-height: 1.65;
      padding: 2px 0 2px 16px;
      position: relative;
    }
    .menu-meal li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 9px;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--olive);
    }

    /* ── DINING NOTE (dietary info) ── */
    .dining-note {
      font-family: var(--font-sans);
      font-size: 14px;
      color: var(--brown-light);
      line-height: 1.75;
      background: var(--sand);
      border-radius: var(--radius-lg);
      border-left: 3px solid var(--terracotta);
      padding: 20px 24px;
      margin-top: 28px;
    }




   
           /* ============================================================
   2. LAND AND CAMPUS
   ============================================================ */ 

    /* ── CAMPUS FEATURE ROWS ── */
    .feature-row {
      display: flex;
      gap: 56px;
      align-items: flex-start;
      padding: 56px 0;
      border-top: 1px solid var(--border);
    }
    .feature-row:first-child { border-top: none; padding-top: 0; }
    .feature-row--reverse { flex-direction: row-reverse; }

    .feature-row__media {
      flex: 0 0 360px;
    }
    .feature-row__media img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: var(--radius-lg);
      display: block;
    }
    .feature-row__content { flex: 1; min-width: 0; padding-top: 4px; }

    .feature-title {
      font-family: var(--font-serif);
      font-size: clamp(1.5rem, 2.5vw, 2rem);
      font-weight: 600;
      color: var(--brown-mid);
      margin-bottom: 16px;
      line-height: 1.1;
    }
    .feature-body p {
      font-family: var(--font-sans);
      font-size: 15px;
      color: var(--brown-mid);
      line-height: 1.8;
      margin-bottom: 16px;
    }
    .feature-body p:last-child { margin-bottom: 0; }
    .feature-body a {
      color: var(--olive);
      font-weight: 700;
      border-bottom: 1px solid currentColor;
    }

    /* ── TRAIL MAP LIGHTBOX ── */
    .trail-map-wrap {
      margin-top: 20px;
      cursor: zoom-in;
      display: inline-block;
    }
    .trail-map-wrap img {
      width: 100%;
      max-width: 360px;
      border-radius: var(--radius-lg);
      border: 1px solid var(--border);
      display: block;
      transition: opacity 0.15s;
    }
    .trail-map-wrap:hover img { opacity: 0.85; }
    .trail-map-hint {
      font-family: var(--font-sans);
      font-size: 11.5px;
      color: var(--muted);
      margin-top: 8px;
      letter-spacing: 0.04em;
    }

    .lightbox-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(44,40,37,0.93);
      z-index: 1000;
      align-items: center;
      justify-content: center;
      padding: 40px;
    }
    .lightbox-overlay.open { display: flex; }
    .lightbox-overlay img {
      max-width: 90vw;
      max-height: 90vh;
      object-fit: contain;
      border-radius: var(--radius-lg);
    }
    .lightbox-close {
      position: absolute;
      top: 20px;
      right: 28px;
      background: none;
      border: none;
      color: var(--cream);
      font-size: 2.4rem;
      line-height: 1;
      cursor: pointer;
      opacity: 0.7;
      padding: 8px;
      transition: opacity 0.15s;
    }
    .lightbox-close:hover { opacity: 1; }

    /* ── LAND ACKNOWLEDGEMENT ── */
    .land-ack {
      margin-top: 56px;
      padding: 28px 28px 28px 32px;
      border-left: 3px solid var(--olive);
      background: var(--sand);
      border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
    }
    .land-ack__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 12px;
    }
    .land-ack__text {
      font-family: var(--font-sans);
      font-size: 14.5px;
      color: var(--brown-mid);
      line-height: 1.8;
    }
    .land-ack__text a {
      color: var(--olive);
      border-bottom: 1px solid currentColor;
    }

    /* ── WILDLIFE & PLANTS ── */
    .wildlife-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 48px;
      margin-top: 36px;
    }
    .wildlife-col__label {
      font-family: var(--font-sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 16px;
    }

    /* ── GEOLOGY SECTION ── */
    .geology-section {
      background: var(--brown-dark);
      padding: 88px 48px;
    }
    .geology-section__inner {
      max-width: var(--container-blog);
      margin: 0 auto;
    }
    .geology-section__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--terracotta);
      margin-bottom: 14px;
      display: block;
    }
    .geology-section__title {
      font-family: var(--font-serif);
      font-size: clamp(1.8rem, 3.5vw, 2.6rem);
      font-weight: 400;
      color: var(--sand);
      line-height: 1.15;
      margin-bottom: 32px;
    }
    .geology-section p {
      font-family: var(--font-sans);
      font-size: 15.5px;
      color: var(--muted);
      line-height: 1.85;
      margin-bottom: 24px;
    }
    .geology-section p:last-child { margin-bottom: 0; }
    .geology-section strong { color: var(--sand); font-weight: 700; }






   
           /* ============================================================
   25. LEGACY
   ============================================================ */ 

    /* ── LEGACY INTRO (split: text left, tree right) ── */

    /* ── LEGACY QUOTE SECTION (dark, centered, tree above quote) ── */
    .legacy-quote-section {
      background: var(--brown-dark);
      padding: 80px 48px;
      text-align: center;
    }
    .legacy-quote-section__tree {
      width: 120px;
      height: auto;
      display: block;
      margin: 0 auto 32px;
      opacity: 0.92;
    }
    .legacy-quote-section__quote {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: clamp(1.5rem, 3vw, 2.2rem);
      color: var(--sand);
      line-height: 1.5;
      max-width: 720px;
      margin: 0 auto 20px;
    }
    .legacy-quote-section__attribution {
      font-family: var(--font-sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--terracotta);
    }

    /* ── SUB-HEADINGS INSIDE FEATURE ROWS ── */
    .legacy-subhead {
      font-family: var(--font-sans);
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.13em;
      text-transform: uppercase;
      color: var(--olive);
      margin: 24px 0 8px;
    }
    .legacy-subhead:first-child { margin-top: 0; }

    /* ── BULLET LIST (legal details) ── */
    .legacy-list {
      list-style: none;
      padding: 0;
      margin: 0 0 8px;
    }
    .legacy-list li {
      font-family: var(--font-sans);
      font-size: 14.5px;
      color: var(--brown-mid);
      line-height: 1.75;
      padding: 3px 0 3px 18px;
      position: relative;
    }
    .legacy-list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 12px;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--olive);
    }
    .legacy-list strong { color: var(--brown-mid); }

    /* ── LEGAL WORDING BLOCKS ── */
    .legal-block { margin: 6px 0 14px; }
    .legal-block__label {
      font-family: var(--font-sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 6px;
    }
    .legal-block__text {
      font-family: var(--font-sans);
      font-size: 13.5px;
      font-style: italic;
      color: var(--brown-mid);
      line-height: 1.75;
      background: var(--cream);
      border-left: 3px solid var(--border);
      padding: 14px 18px;
      border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
      margin: 0;
    }










/* ============================================================
   26. MEMBERSHIP TIERS
   ============================================================ */
/* ============================================================
   26. MEMBERSHIP TIERS
   ============================================================ */
/* ============================================================
   26. MEMBERSHIP TIERS
   ============================================================ */

.membership-row__price {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  color: var(--tan);
  margin-bottom: 4px;
}

.membership-row__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  margin: 20px 0 28px;
}

.membership-row__or {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}






/* ============================================================
   27. LEGAL DOCUMENT PAGES
   ============================================================ */

.content-body h3 {
  font-family: var(--font-serif);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--brown-mid);
  margin: 40px 0 10px;
}

.content-body h3:first-child { margin-top: 0; }


   
           /* ============================================================
   27. EVENT DETAIL PAGE
   ============================================================ */ 

    /* ── ACCORDION (schedule + rates) ── */
    .accordion-toggle {
      display: flex;
      align-items: center;
      gap: 18px;
      padding: 22px 24px;
      cursor: pointer;
      background: var(--sand);
      border-radius: 6px;
      margin-bottom: 2px;
    }
    .rate-toggle { background: transparent; padding: 0; border-radius: 0; }
    .accordion-content { display: none; }
    .accordion-content.open { display: block; }

    /* FAQ (uses <details>) */
    details > summary { list-style: none; }
    details > summary::-webkit-details-marker { display: none; }
    .summary-icon {
      display: inline-block;
      width: 20px;
      font-size: 18px;
      font-weight: 300;
      color: var(--brown-mid);
      flex-shrink: 0;
    }
    details:not([open]) .summary-icon::before { content: '+'; }
    details[open] .summary-icon::before { content: '−'; }

    /* Accordion toggle icon pill */
    .acc-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: var(--olive);
      color: var(--cream);
      font-size: 17px;
      font-weight: 700;
      flex-shrink: 0;
    }

    /* ── BREADCRUMB ── */
    .event-breadcrumb {
      max-width: var(--container-mid);
      margin: 0 auto;
      padding: 28px 48px 0;
    }
    .event-breadcrumb__link {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: var(--olive);
    }

    /* ── HERO ── */
    .event-hero {
      max-width: var(--container-mid);
      margin: 0 auto;
      padding: 24px 48px 0;
    }
    .event-hero__meta {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 14px;
    }
    .event-category-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--olive);
    }
    .event-badge {
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--brown-mid);
      border: 1px solid var(--brown-mid);
      border-radius: 20px;
      padding: 2px 10px;
    }
    .event-title {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: clamp(2.4rem, 4.6vw, 3.6rem);
      color: var(--brown-mid);
      margin: 0 0 14px;
      line-height: 1.1;
    }
    .event-date {
      font-size: 16px;
      font-weight: 700;
      color: var(--brown-mid);
      margin-bottom: 28px;
    }
    .event-hero__image-wrap {
      width: 100%;
      height: 440px;
      border-radius: 8px;
      overflow: hidden;
      margin-bottom: 14px;
      background: var(--border);
    }
    .event-hero__img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 30% 30%;
      display: block;
    }
    .event-gallery {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 10px;
      margin-bottom: 32px;
    }
    .event-gallery__item {
      aspect-ratio: 1 / 1;
      border-radius: 6px;
      background: transparent; /* was var(--border) */
      overflow: hidden;
    }
    .event-gallery__item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .event-register-wrap {
      text-align: center;
      margin-bottom: 56px;
    }
    .btn-register {
      display: inline-block;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: 0.05em;
      color: var(--cream);
      background: #a145c2;
      padding: 13px 30px;
      border-radius: 4px;
    }
    .btn-register:hover { background: #8c38a8; color: var(--cream); }
    .btn-register--lg { font-size: 14.5px; padding: 15px 36px; }

    /* ── INTRO ── */
    .event-intro {
      max-width: var(--container-blog);
      margin: 0 auto;
      padding: 0 48px 56px;
    }
    .event-section-heading {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: clamp(1.7rem, 2.8vw, 2.2rem);
      color: var(--brown-mid);
      margin: 0 0 28px;
    }
    .event-intro__heading {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: clamp(1.6rem, 2.6vw, 2.1rem);
      color: var(--brown-mid);
      margin: 0 0 22px;
    }
    /* Special pricing notice, shown in the intro and again above the rates
       when an event has a promotion running. See templates/retreat.php. */
    .event-discount {
      font-family: var(--font-sans);
      font-size: 16px;
      font-weight: 700;
      color: var(--purple);
      margin-bottom: 28px;
    }
    .event-intro__body {
      display: flex;
      flex-direction: column;
      gap: 18px !important;
      margin-bottom: 36px !important;
      font-weight: 400 !important;
    }
    .event-intro__body p {
      font-size: 16px !important;
      color: var(--brown-mid) !important;
      line-height: 1.75 !important;
      margin: 0;
    }
    .event-highlights-label {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: 1.4rem;
      color: var(--brown-mid);
      margin: 0 0 6px;
    }
    .event-highlights-note {
      font-size: 14px;
      font-style: italic;
      color: var(--tan);
      margin: 0 0 18px;
    }
    .event-highlights {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .event-highlight {
      display: flex;
      gap: 12px;
      align-items: baseline;
    }
    .event-highlight__check {
      color: var(--green);
      font-weight: 700;
      flex-shrink: 0;
    }
    .event-highlight__text {
      font-size: 15px;
      color: var(--brown-mid);
      font-weight: 400 !important;
      line-height: 1.65;
      margin: 0;
    }

    /* ── SCHEDULE ── */
    .event-schedule {
      max-width: 900px;
      margin: 0 auto;
      padding: 0 48px 24px;
    }
    .event-schedule__header {
      border-top: 1px solid var(--border);
      padding-top: 44px;
      margin-bottom: 6px;
    }
    .event-schedule__note {
      font-size: 13.5px;
      font-style: italic;
      color: var(--tan);
      margin: 0 0 28px;
    }
    .event-day { border-bottom: 1px solid var(--border); }
    .event-day__label {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: 1.4rem;
      color: var(--brown-mid);
    }
    .event-sessions {
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 0 0 32px 48px;
    }
    .event-session {
      display: flex;
      gap: 24px;
      flex-wrap: wrap;
      padding: 20px 0;
    }
    .event-session__time {
      flex: 0 0 170px;
      font-size: 13.5px;
      font-weight: 700;
      color: #B5623E;
    }
    .event-session__content {
    flex: none;
    width: 100%;
    }
    .event-session__name {
      font-size: 15px;
      font-weight: 700;
      color: var(--brown-mid);
      margin-bottom: 2px;
    }
    .event-session__location {
      font-size: 12.5px;
      font-style: italic;
      color: var(--tan);
      margin-bottom: 6px;
    }
    .event-session__desc {
      font-size: 14.5px;
      color: var(--brown-mid);
      line-height: 1.65;
      margin: 0;
    }
    .event-session-divider {
      height: 1px;
      background: var(--border);
      margin-right: 48px;
    }
    .event-schedule__cta {
      text-align: center;
      padding: 44px 0 0;
    }

    /* ── QUOTE ── */
    .event-quote {
      background: var(--brown-dark);
      padding: 64px 48px;
    }
    .event-quote__inner {
      max-width: var(--container-blog);
      margin: 0 auto;
      text-align: center;
    }
    .event-quote__text {
      font-family: var(--font-serif);
      font-style: italic;
      font-weight: 500;
      font-size: clamp(1.4rem, 2.6vw, 1.8rem);
      color: var(--sand);
      line-height: 1.5;
      margin: 0 0 18px;
    }
    .event-quote__attribution {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #B5623E;
    }

    /* ── RATES ── */
    .event-rates {
      background: var(--sand);
      padding: 64px 48px;
    }
    .event-rates__inner {
      max-width: 900px;
      margin: 0 auto;
    }
    .event-rates__lead {
      font-size: 15.5px;
      font-weight: 700;
      color: var(--brown-mid);
      line-height: 1.6;
      margin: 0 0 8px;
    }
    .event-rates__intro {
      font-size: 15.5px;
      color: var(--brown-mid);
      line-height: 1.75;
      margin: 0 0 12px;
      font-weight: 400 !important;
    }
    .event-includes {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 16px;
    }
    .event-include {
      display: flex;
      gap: 10px;
      font-size: 14.5px;
      font-weight: 400 !important;
      color: var(--brown-mid);
      line-height: 1.6;
    }
    .event-include__check {
      color: var(--green);
      flex-shrink: 0;
    }
    .event-rates__note {
      font-size: 15px;
      color: var(--brown-mid);
      line-height: 1.7;
      margin: 0 0 36px;
    }
    .event-rate-rows { 
      display: flex; 
      flex-direction: column; 
    }
    .event-rate-row {
      border-top: 1px solid #E0CFAE;
      padding: 18px 0;
    }
    .event-rate-row__name {
      font-size: 15.5px;
      font-weight: 700;
      color: var(--brown-mid);
      flex: 1;
    }
    .event-rate-row__price {
      font-size: 15px;
      font-weight: 700;
      color: #B5623E;
      flex-shrink: 0;
    }
    .event-rate-row__desc {
      font-size: 14px;
      font-weight: 400 !important;
      color: var(--brown-mid);
      line-height: 1.7;
      margin: 14px 0 0 48px;
      max-width: 650px;
    }
    .event-rates__cta {
      text-align: center;
      margin-top: 36px;
    }

    /* ── SCHOLARSHIP ── */
    .event-scholarship {
      background: var(--sand);
      padding: 64px 48px;
    }
    .event-scholarship__inner { max-width: var(--container-mid); margin: 0 auto; }
    .event-divider {
      border-top: 1px solid #E0CFAE;
      margin-bottom: 48px;
    }
    .event-divider--bottom { margin-top: 48px; margin-bottom: 0; }
    .event-scholarship__row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 32px;
      flex-wrap: wrap;
    }
    .event-scholarship__text { max-width: 640px; }
    .event-scholarship__heading {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: clamp(1.5rem, 2.6vw, 2rem);
      color: var(--brown-mid);
      margin: 0 0 10px;
    }
    .event-scholarship__body {
      font-size: 15px;
      color: var(--brown-mid);
      line-height: 1.7;
      margin: 0;
    }
    .btn-scholarship {
      display: inline-block;
      font-size: 13.5px;
      font-weight: 700;
      letter-spacing: 0.05em;
      color: var(--cream);
      background: var(--green);
      padding: 13px 28px;
      border-radius: 4px;
      white-space: nowrap;
    }
    .btn-scholarship:hover { background: var(--green-dark); color: var(--cream); }

    /* ── PRESENTERS AND HOSTS SECTIOONS  ── */
    .event-presenters {
      background: var(--sand);
      padding: 64px 48px 56px;
    }
        /* ── HOSTS ── */
    .event-hosts {
      max-width: var(--container-mid);
      margin: 0 auto;
      padding: 64px 48px;
    }


    .event-hosts__heading {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: 1.5rem;
      color: var(--brown-mid);
      margin: 0 0 24px;
    }




    .event-presenters__inner {
       max-width: var(--container-mid); 
       margin: 0 auto; 
    }
    .event-presenters__sub {
      font-size: 14px;
      color: var(--tan);
      margin: 0 0 32px;
    }


    .event-presenter-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 36px 32px;
    }

    .event-host-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 36px 32px;
    }



    .event-presenter__avatar {
      width: 84px;
      height: 84px;
      border-radius: 50%;
      background: var(--border);
      margin-bottom: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }
     .event-host__avatar {
      width: 84px;
      height: 84px;
      border-radius: 50%;
      background: var(--border);
      margin-bottom: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }




    .event-presenter__name {
      font-family: var(--font-serif);
      font-weight: 700;
      font-size: 1.2rem;
      color: var(--brown-mid);
      margin-bottom: 6px;
    }
    .event-host__name {
      font-family: var(--font-serif);
      font-weight: 700;
      font-size: 1.15rem;
      color: var(--brown-mid);
      margin-bottom: 6px;
    }


    .event-presenter__bio {
      font-size: 14px;
      font-weight: 400 !important;
      color: var(--brown-mid);
      line-height: 1.65;
      margin: 0 0 6px;
    }
    .event-host__bio {
      font-size: 13.5px;
      font-weight: 400 !important;
      color: var(--brown-mid);
      line-height: 1.6;
      margin: 0 0 6px;
    }


    .event-presenter__link {
      font-size: 13px;
      font-weight: 700;
      color: var(--olive);
    }
        .event-host__link {
      font-size: 13px;
      font-weight: 700;
      color: var(--olive);
    }



    .event-presenter__photo{
      width: 180px;
      height: 180px;
      border-radius: 50%;
      object-fit: cover;
      display: block;
      margin-bottom: 40px;
    }
    .event-host__photo{
      width: 180px;
      height: 180px;
      border-radius: 50%;
      object-fit: cover;
      display: block;
      margin-bottom: 40px;
    }








    /* ── FAQs ── */
    .event-faqs {
      max-width: 900px;
      margin: 0 auto;
      padding: 0 48px 88px;
    }
    .event-faqs__header {
      border-top: 1px solid var(--border);
      padding-top: 56px;
    }
    .event-faqs__heading { margin: 0 0 28px; }

    /* ── REGISTER CTA ── */
    .event-register-cta {
      max-width: var(--container-mid);
      margin: 0 auto;
      padding: 0 48px 88px;
      text-align: center;
    }
    .event-register-cta__text {
      font-size: 15.5px;
      color: var(--brown-mid);
      margin: 0 0 24px;
      font-weight: 400 !important;
    }





   
  /* ============================================================
   28. MEDIA PAGE
   ============================================================ */ 
   
    /* ── YEAR GROUP ── */
    .media-year-group {
      margin-bottom: 72px;
    }
    .media-year-group:last-child {
      margin-bottom: 0;
    }
    .media-year-label {
      font-family: var(--font-serif);
      font-size: clamp(2rem, 3.2vw, 2.8rem);
      font-weight: 600;
      color: var(--brown-mid);
      margin: 0 0 24px;
      padding-bottom: 20px;
      border-bottom: 2px solid var(--border);
    }

    /* ── MEDIA ITEM ── */
    .media-list {
      display: flex;
      flex-direction: column;
    }
    .media-item {
      padding: 28px 0;
      border-bottom: 1px solid var(--border);
    }
    .media-item__meta {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 8px;
    }
    .media-item__source {
      font-family: var(--font-sans) !important;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--olive);
    }
    .media-item__type {
      font-family: var(--font-sans) !important;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--cream);
      background: var(--tan);
      border-radius: 20px;
      padding: 2px 9px;
    }
    .media-item__title {
      font-family: var(--font-serif);
      font-size: clamp(1.2rem, 1.8vw, 1.45rem);
      font-weight: 600;
      line-height: 1.3;
      margin: 0 0 10px;
    }
    .media-item__title a {
      color: var(--brown-mid);
      text-decoration: none;
    }
    .media-item__title a:hover {
      color: var(--green);
    }
    .media-item__desc {
      font-family: var(--font-sans);
      font-size: 14.5px;
      color: var(--brown-light);
      line-height: 1.75;
      margin: 0;
      max-width: 680px;
    }



  /* ============================================================
   29. CONCLUDED EVENTS PAGE DETAILS
   ============================================================ */ 
        /* ── Alert email signup ── */
    .alert-signup {
      background: var(--brown-dark);
      padding: 64px 48px;
    }
    .alert-signup__inner {
      max-width: 680px;
      margin: 0 auto;
      text-align: center;
    }
    .alert-signup__label {
      display: block;
      font-family: var(--font-sans) !important;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 14px;
    }
    .alert-signup__heading {
      font-family: var(--font-serif);
      font-size: clamp(1.6rem, 3vw, 2.2rem);
      font-weight: 600;
      color: var(--sand);
      line-height: 1.2;
      margin: 0 0 14px;
    }
    .alert-signup__sub {
      font-family: var(--font-sans) !important;
      font-size: 15px;
      color: var(--muted);
      line-height: 1.7;
      margin: 0 0 32px;
    }
    .alert-signup__form {
      display: flex;
      gap: 12px;
      max-width: 480px;
      margin: 0 auto;
    }
    .alert-signup__input {
      flex: 1;
      font-family: var(--font-sans) !important;
      font-size: 14px;
      color: var(--brown-dark);
      background: var(--cream);
      border: none;
      border-radius: var(--radius-sm);
      padding: 13px 18px;
      outline: none;
    }
    .alert-signup__input::placeholder { 
      color: var(--muted); 
    }
    .alert-signup__btn {
      font-family: var(--font-sans) !important;
      font-size: 13.5px;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: var(--cream);
      background: var(--green);
      border: none;
      border-radius: var(--radius-sm);
      padding: 13px 22px;
      cursor: pointer;
      white-space: nowrap;
      transition: opacity 0.15s;
    }
    .alert-signup__btn:hover {
       opacity: 0.88; 
      }
    .alert-signup__note {
      font-size: 12px;
      color: var(--brown-light);
      margin-top: 14px;
    }

    /* ── Staff preview notice bar ── */
    /* Shown only to someone who can preview an event that is not live, so it
       is deliberately louder than the past event banner below it. The dark
       ground separates it from the page content, which is the point, since
       what is underneath it is not what the public sees. */
    .em-preview-bar {
      background: var(--brown-dark);
      border-bottom: 1px solid var(--border);
      padding: 14px 48px;
      text-align: center;
    }
    .em-preview-bar__text {
      font-family: var(--font-sans) !important;
      font-size: 13.5px;
      font-weight: 400 !important;
      color: var(--footer-text);
    }
    .em-preview-bar__label {
      color: var(--terracotta);
      text-transform: uppercase;
      letter-spacing: 0.08em;
      font-weight: 700;
      margin-right: 8px;
    }
    .em-preview-bar__link {
      color: var(--footer-text);
      text-decoration: underline;
      margin-left: 10px;
      white-space: nowrap;
    }
    .em-preview-bar__link:hover {
      color: var(--cream);
    }

    /* ── Past event notice banner ── */
    .past-event-banner {
      background: var(--sand);
      border-bottom: 1px solid var(--border);
      padding: 14px 48px;
      text-align: center;
    }
    .past-event-banner__text {
      font-family: var(--font-sans) !important;
      font-size: 13.5px;
      font-weight: 400 !important;
      color: var(--brown-mid);
    }
    .past-event-banner__text strong {
       color: var(--terracotta); 
      }

    /* ── Schedule past toggle ── */
    .schedule-past-toggle {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 20px 0;
      cursor: pointer;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      font-family: var(--font-sans) !important;
      font-size: 14px;
      font-weight: 700;
      color: var(--olive);
      letter-spacing: 0.02em;
      list-style: none;
      user-select: none;
    }
    .schedule-past-toggle:hover { color: var(--green); }
    .schedule-past-toggle .toggle-icon {
      font-size: 18px;
      font-weight: 400;
      color: var(--olive);
      transition: transform 0.2s ease;
    }
    details[open] .schedule-past-toggle .toggle-icon {
      transform: rotate(45deg);
    }






/* ── Page Header ── */
.page-header-section {
    max-width: var(--container-mid);
    margin: 0 auto;
    padding: 72px 48px 0;
}

.page-header-intro {
    margin-bottom: 28px;
}

.page-header-title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: clamp(2.2rem, 4.2vw, 3.2rem);
    color: #3D3530;
    margin: 0;
}

.page-intro-text {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 52px;
}

.page-intro-text p {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    color: #3D3530;
    line-height: 1.75;
    margin: 0;
    font-weight: 400 !important;
}


/* ── Divider ── */
.events-divider-wrap {
    max-width: var(--container-mid);
    margin: 0 auto;
    padding: 0 48px;
}

.events-divider {
    border-top: 1px solid var(--border);
}


/* ── Event List Section ── */
.events-list-section {
    max-width: var(--container-mid);
    margin: 0 auto;
    padding: 0 48px;
}


/* ── Event Row ── */
.event-row {
    display: flex;
    gap: 44px;
    padding: 52px 0;
    border-bottom: 1px solid var(--border);
    align-items: flex-start;
    flex-wrap: wrap;
}

.event-row__image-wrap {
    position: relative;
    flex: 1 1 260px;
    max-width: 260px;
    aspect-ratio: 1/1;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}

.event-row__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.event-row__content {
    flex: 2 1 420px;
    display: flex;
    flex-direction: column;
}

.event-row__tags {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.event-tag {
    font-family: 'Lato', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--olive);
}

.event-tag--partner {
    font-family: 'Lato', sans-serif;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #B5623E;
    border: 1px solid #B5623E;
    border-radius: 20px;
    padding: 2px 10px;
}

.event-row__title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: clamp(1.5rem, 2.4vw, 1.9rem);
    color: #3D3530;
    line-height: 1.25;
    margin: 0 0 8px;
}

.event-row__date {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #3D3530;
    letter-spacing: 0.01em;
    margin-bottom: 8px;
}

.event-row__producer {
    font-family: 'Lato', sans-serif;
    font-size: 13.5px;
    font-style: italic;
    color: var(--tan);
    margin-bottom: 16px;
}

.event-row__description {
    font-family: 'Lato', sans-serif;
    font-size: 15px;
    color: #3D3530;
    font-weight: 400 !important;
    line-height: 1.75;
    margin: 0 0 18px;
}

.event-row__cta {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: auto;
}

.event-row__cta--between {
    justify-content: space-between;
}

.event-row__cta--start {
    justify-content: flex-start;
}

.btn--learn-more {
    display: inline-block;
    font-family: 'Lato', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--cream);
    background: #a145c2;
    padding: 11px 24px;
    border-radius: 4px;
}

.event-row__limited {
    font-family: 'Lato', sans-serif;
    font-size: 12.5px;
    font-style: italic;
    color: #B5623E;
}


/* ── Scholarship Callout ── */
.scholarship-callout {
    background: var(--sand);
    padding: 64px 48px;
}

.scholarship-callout__inner {
    max-width: var(--container-mid);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
}

.scholarship-callout__text {
    max-width: 640px;
}

.scholarship-callout__heading {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: clamp(1.5rem, 2.6vw, 2rem);
    color: #3D3530;
    margin: 0 0 10px;
}

.scholarship-callout__body {
    font-family: 'Lato', sans-serif;
    font-size: 15px;
    font-weight: 400 !important;
    color: #3D3530;
    line-height: 1.7;
    margin: 0;
}

.scholarship-callout__cta {
    display: inline-block;
    font-family: 'Lato', sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--cream);
    background: var(--green);
    padding: 13px 28px;
    border-radius: 4px;
    white-space: nowrap;
}


/* ── Archive ── */
.events-archive {
    padding: 44px 48px 88px;
    text-align: center;
}

.events-archive__link {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--olive);
}



    

    /* ── Footer ── */

.site-footer__inner {
    max-width: var(--container-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr;
    gap: 32px;
    margin-bottom: 56px;
}

.site-footer__brand-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--cream);
    margin-bottom: 14px;
}

.site-footer__tagline {
    font-family: 'Lato', sans-serif;
    font-size: 13.5px;
    color: #A89B90;
    line-height: 1.7;
    max-width: 280px;
}

.site-footer__col-heading {
    font-family: 'Lato', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #8FA8B5;
    margin-bottom: 16px;
}

.site-footer__nav {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__nav--spaced {
    margin-top: 20px;
}

.site-footer__link {
    font-family: 'Lato', sans-serif;
    font-size: 13.5px;
    color: #D8CFC5;
}

.site-footer__address {
    font-family: 'Lato', sans-serif;
    font-size: 13.5px;
    color: #D8CFC5;
    line-height: 1.6;
}

.site-footer__bottom {
    max-width: 1240px;
    margin: 0 auto;
    padding-top: 24px;
    border-top: 1px solid #3D3530;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.site-footer__copy {
    font-family: 'Lato', sans-serif;
    font-size: 11.5px;
    color: #7A6E65;
    letter-spacing: 0.04em;
}






      /* ============================================================
   30. GETTING HERE DETAIL PSGE
   ============================================================ */ 
    /* ── MAP SECTION ── */
    .map-embed {
      margin-top: 36px;
      height: 380px;
      overflow: hidden;
      border-radius: var(--radius-lg);
      border: 1px solid var(--border);
    }
    .map-embed iframe {
      width: 100%;
      height: 100%;
      border: 0;
      display: block;
    }

    /* ── TRANSPORT GRID ── */
    .transport-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1px;
      background: var(--border);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      overflow: hidden;
    }
    .transport-card {
      background: var(--cream);
      padding: 44px 40px;
    }
    .transport-card__label {
      display: block;
      font-family: var(--font-sans) !important;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--olive);
      margin-bottom: 10px;
    }
    .transport-card__heading {
      font-family: var(--font-serif) !important;
      font-size: clamp(1.6rem, 2.4vw, 2rem);
      font-weight: 600;
      color: var(--brown-mid);
      line-height: 1.1;
      margin: 0 0 20px;
    }

    /* ── ADDRESS BOX ── */
    .address-box {
      font-family: var(--font-sans) !important;
      font-size: 15px;
      font-weight: 600;
      color: var(--brown-mid);
      background: var(--sand);
      border-left: 3px solid var(--olive);
      border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
      padding: 16px 20px;
      margin-top: 4px;
      line-height: 1.6;
    }

    /* ── RIDE REQUEST CALLOUT ── */
    .ride-callout {
      background: var(--brown-dark);
      border-radius: var(--radius-md);
      padding: 28px 32px;
      margin: 28px 0 32px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      flex-wrap: wrap;
    }
    .ride-callout__text {
      font-family: var(--font-sans) !important;
      font-size: 14.5px;
      color: var(--muted);
      line-height: 1.65;
      flex: 1;
      min-width: 240px;
    }
    .ride-callout__text strong {
      display: block;
      font-size: 15.5px;
      color: var(--sand);
      margin-bottom: 6px;
    }

    /* ── LOCAL CAR SERVICES ── */
    .car-services {
      list-style: none;
      padding: 0;
      margin: 20px 0 0;
    }
    .car-services li {
      padding: 14px 0;
      border-bottom: 1px solid var(--border);
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
    }
    .car-services li:first-child {
      border-top: 1px solid var(--border);
    }
    .car-services__name {
      font-family: var(--font-sans) !important;
      font-size: 14.5px;
      font-weight: 600;
      color: var(--brown-mid);
    }
    .car-services__note {
      font-family: var(--font-sans) !important;
      font-size: 12px;
      color: var(--muted);
      font-style: italic;
      margin-top: 3px;
      display: block;
    }
    .car-services a {
      font-family: var(--font-sans) !important;
      font-size: 13.5px;
      font-weight: 700;
      color: var(--olive);
      white-space: nowrap;
    }
    .car-services a:hover { color: var(--green); }




      /* ============================================================
   31. BLOG PAGE
   ============================================================ */ 






    /* Blog body text */
    .blog-body p {
      font-size: 16px;
      line-height: 1.8;
      color: #3D3530;
      margin: 0 0 24px;
    }








.read-more {
    font-size: 13px;
    font-weight: 700;
    color: var(--green);
    letter-spacing: 0.02em;
}

.read-more:hover {
    color: var(--green-dark);
}





/* ============================================================
HISTORY PAGE
   ============================================================ */


/* ── Back link wrapper ── */
/* Centres the ← link above the article header with top breathing room. */
/* Uses .link-back from section 5 for the anchor itself. */
.article-back {
  max-width: var(--container-blog);
  margin: 0 auto;
  padding: 36px 48px 0;
}


/* ── Article page header ── */
/* Wraps section-label + article__title + article__source. */
/* Uses existing .section-label and .article__title for those elements. */
.article-page-header {
  max-width: var(--container-blog);
  margin: 0 auto;
  padding: 22px 48px 0;
}


/* ── Article source / publication line ── */
/* The "Written by X for Y · Date" line below the title. */
.article__source {
  font-family: var(--font-sans);
  font-size: 13.5px;
  color: var(--muted);
  margin-top: 12px;
  margin-bottom: 40px;
}


/* ── Large author portrait (top of article) ── */
/* The 140px circular photo with italic caption beside it. */
/* Different from .author-bio at the bottom, which is 64px. */
.article__portrait {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.article__portrait-img {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.article__portrait-caption {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: 1.15rem;
  color: var(--tan);
  line-height: 1.5;
  margin: 0;
  max-width: 440px;
}


/* ── Pull quote — terracotta colour modifier ── */
/* Add alongside .pull-quote on the same element. */
/* Existing .pull-quote uses var(--brown-mid); this overrides to terracotta. */
.pull-quote--terracotta {
  color: var(--terracotta);
}


/* ── Vision / mission statement block ── */
/* Full-width sand background section with centred italic text. */
/* Used for quoted statements, founding mission, etc. */
.vision-statement {
  background: var(--sand);
  padding: 56px 48px;
  margin: 8px 0;
}

.vision-statement p {
  max-width: 620px;
  margin: 0 auto;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.2rem, 2.2vw, 1.4rem);
  color: var(--brown-mid);
  line-height: 1.7;
  text-align: center;
}


/* ── Article section divider ── */
/* Thin horizontal rule between sections. */
.article-divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 0;
}


/* ── Article body bottom padding modifier ── */
/* Adds generous bottom space on the last section before the footer. */
.article__body--padded-bottom {
  padding-bottom: 88px;
}
/* ============================================================
   ADD TO easton.css — Section 14 (Article / Blog Post Pages)
   Paste after the .related-card__read-more rules.

   ONE new class and four modifier variants.
   Everything else in single.php reuses existing Section 14 classes.
   ============================================================ */


/* ── Wide article container ── */
/*
   Blog post pages use a two-width layout:
     1100px  — breadcrumb, article header, hero image, related posts
      760px  — body text (.article__body, already in Section 14)

   .article__wide provides the 1100px container.
   Modifier classes add vertical padding where needed.
   These are combined on the same element, e.g.:
     <div class="article__wide article__wide--top">
*/

.article__wide {
  max-width: var(--container-mid);   /* 1100px */
  margin: 0 auto;
  padding: 0 48px;
}

/* Top breathing room — breadcrumb */
.article__wide--top {
  padding-top: 32px;
}

/* Article header padding — categories + title + byline */
.article__wide--header {
  padding-top: 24px;
  padding-bottom: 32px;
}

/* Hero image bottom gap before body text */
.article__wide--hero {
  padding-bottom: 36px;
}

/* Related posts section — overrides .related-posts max-width */
/* Apply both classes: class="related-posts article__wide article__wide--related" */
.article__wide--related {
  max-width: var(--container-mid);   /* 1100px, overrides .related-posts 760px */
}


.wp-element-caption {
  font-family: var(--font-serif);
  font-size: 17px;
  font-style:italic;
  color: var(--muted);
  text-align: center;
  margin-top: 8px;
  line-height: 1.7;
  margin-bottom:28px;
}



/* ============================================================
   ADD TO easton.css — new section after existing content sections
   Section 24: FAQ Page
   ============================================================ */


/* ── FAQ ACCORDION ───────────────────────────────────────────────────────
   Uses native HTML <details> and <summary> elements — no JavaScript needed.
   The + / − toggle is handled entirely in CSS via ::before pseudo-elements.
   All of these were previously inline styles or in a page-level <style> block.
──────────────────────────────────────────────────────────────────────── */

/* Remove browser default disclosure triangle */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }

/* Each FAQ item — top border separates rows */
.faq-row {
  border-top: 1px solid var(--border);
}

/* Group wrapper — bottom border closes the last row */
.faq-group {
  border-bottom: 1px solid var(--border);
}

/* Summary row — question text + toggle icon in a flex row */
.faq-row > summary {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 0;
  cursor: pointer;
  list-style: none;
}

/* The + / − toggle icon */
.summary-icon {
  display: inline-block;
  width: 20px;
  font-size: 18px;
  font-weight: 300;
  color: var(--brown-mid);
  flex-shrink: 0;
}
details:not([open]) .summary-icon::before { content: '+'; }
details[open]       .summary-icon::before { content: '−'; }

/* Question text */
.faq-row__question {
  font-family: var(--font-sans);
  font-size: 15.5px;
  font-weight: 700;
  color: var(--brown-mid);
}

/* Answer paragraph(s) inside an open FAQ row */
.faq-row__answer {
  font-family: var(--font-sans);
  font-size: 14.5px;
  color: var(--brown-mid);
  line-height: 1.75;
  margin: 0 0 12px 48px;
}

/* Last answer paragraph gets more breathing room before the next FAQ row */
.faq-row__answer:last-of-type {
  margin-bottom: 22px;
}

/* Links inside answer text — matches .content-body a style */
.faq-row__answer a {
  color: var(--olive);
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}
.faq-row__answer a:hover { color: var(--green); }


/* ── PILLAR HEADING VARIANT ──────────────────────────────────────────────
   The default .pillar-heading margin is 12px.
   Use .pillar-heading--spaced when the heading needs more separation
   from the FAQ group below it.
──────────────────────────────────────────────────────────────────────── */
.pillar-heading--spaced {
  margin-bottom: 32px;
}


/* ── DARK SECTION OVERRIDES ──────────────────────────────────────────────
   Typography color corrections for elements inside .content-section--dark.
   The dark background is var(--brown-dark) so default text colors need
   to flip to light variants.
──────────────────────────────────────────────────────────────────────── */
.content-section--dark .section-label {
  color: var(--footer-label);   /* #8FA8B5 — muted blue-grey */
}

.content-section--dark .section-title {
  color: var(--sand);
  margin-bottom: 16px;
}


/* ── CENTERED SECTION INNER ──────────────────────────────────────────────
   Modifier for .content-section__inner when the content should be
   centred — used on the dark CTA section at the bottom of the FAQ page.
──────────────────────────────────────────────────────────────────────── */
.content-section__inner--centered {
  text-align: center;
}


/* ── SECTION INTRO ───────────────────────────────────────────────────────
   Centred body text used in CTA sections — typically inside a dark section
   beneath the section title, above the button row.
──────────────────────────────────────────────────────────────────────── */
.section-intro {
  font-family: var(--font-sans);
  font-size: 15.5px;
  color: var(--muted);
  line-height: 1.75;
  max-width: 480px;
  margin: 0 auto 32px;
}


/* ── BUTTON ROW ──────────────────────────────────────────────────────────
   Centred flex row for two or more CTA buttons side by side.
   Wraps on small screens.
──────────────────────────────────────────────────────────────────────── */
.btn-row {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}


/* ============================================================
 DAY PASSES PAGE
   ============================================================ */


/* ── INTRO PARAGRAPHS ──────────────────────────────────────────────────── */
/* Used in the page header for body text outside a .content-body wrapper.  */
.content-body-text {
  font-family: var(--font-sans);
  font-size: 16px;
  color: var(--brown-mid);
  line-height: 1.75;
  margin: 0;
}


/* ── PRICING GRID (What's Included section) ────────────────────────────── */
.day-pass__pricing-grid {
  max-width: var(--container-mid);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}

/* Tier label — small all-caps eyebrow above the price */
.day-pass__tier-label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--olive);
  margin-bottom: 10px;
}
.day-pass__tier-label--terracotta {
  color: var(--terracotta);
}

/* Price row — large number + small note side by side */
.day-pass__price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 20px;
}
.day-pass__price {
  font-family: var(--font-serif);
  font-size: 3rem;
  font-weight: 700;
  color: var(--brown-mid);
  line-height: 1;
}
.day-pass__price-note {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--brown-light);
}

/* Include items — checkmark + text */
.day-pass__includes {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.day-pass__include {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.day-pass__check {
  color: var(--green);
  font-size: 15px;
  flex-shrink: 0;
  margin-top: 1px;
}
.day-pass__include span:last-child {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--brown-mid);
  line-height: 1.6;
}

/* Optional add-on column — left border separates from the day pass column */
.day-pass__addon {
  border-left: 1px solid var(--border);
  padding-left: 48px;
}
.day-pass__addon-body {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--brown-mid);
  line-height: 1.75;
  margin: 0 0 16px;
}


/* ── EVENTS SECTION HEADER ─────────────────────────────────────────────── */
.day-pass__events-header {
  padding: 52px 0 28px;
}


/* ── EMPTY STATE ───────────────────────────────────────────────────────── */
/* Shown when no events are currently flagged for day passes.              */
.day-pass__empty {
  padding: 52px 0;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.day-pass__empty-label {
  display: block;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 8px;
}
.day-pass__empty-note {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--muted);
  margin: 0;
}


/* ── EVENT CARD ROW ────────────────────────────────────────────────────── */
/* Horizontal card: square thumbnail on the left, details on the right.   */
.day-pass__event {
  display: flex;
  gap: 44px;
  padding: 40px 0;
  border-bottom: 1px solid var(--border);
  align-items: flex-start;
  flex-wrap: wrap;
}
/* First card also gets a top border */
.day-pass__event:first-of-type {
  border-top: 1px solid var(--border);
}

/* Thumbnail */
.day-pass__event-img-wrap {
  position: relative;
  flex: 1 1 260px;
  max-width: 260px;
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-md);
  overflow: hidden;
  flex-shrink: 0;
}
.day-pass__event-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Details column */
.day-pass__event-body {
  flex: 2 1 420px;
  display: flex;
  flex-direction: column;
}

/* Tag + badge row */
.day-pass__event-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.day-pass__event-tag {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--olive);
}
.day-pass__badge {
  font-family: var(--font-sans);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--green);
  border: 1px solid var(--green);
  border-radius: 20px;
  padding: 2px 10px;
}

/* Event title */
.day-pass__event-title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.4vw, 1.9rem);
  color: var(--brown-mid);
  line-height: 1.25;
  margin: 0 0 8px;
}
.day-pass__event-title a {
  color: inherit;
  text-decoration: none;
}
.day-pass__event-title a:hover {
  color: var(--olive);
}

/* Date line */
.day-pass__event-date {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  color: var(--brown-mid);
  letter-spacing: 0.01em;
  margin-bottom: 8px;
}

/* Description headline / tagline */
.day-pass__event-tagline {
  display: block;
  font-family: var(--font-sans);
  font-size: 13.5px;
  font-style: italic;
  color: var(--tan);
  margin-bottom: 16px;
}

/* Register button + price row */
.day-pass__event-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: auto;
}
.day-pass__coming-soon {
  font-family: var(--font-sans);
  font-size: 13.5px;
  font-style: italic;
  color: var(--muted);
}
.day-pass__price-inline {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  color: var(--brown-mid);
}

/* "More coming soon" footer row below the last card */
.day-pass__more-soon {
  padding: 52px 0;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.day-pass__more-soon span {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}


/* ── FULL RETREAT CTA ──────────────────────────────────────────────────── */
.day-pass__cta-inner {
  max-width: var(--container-mid);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}
.day-pass__cta-text {
  max-width: 640px;
}
.day-pass__cta-heading {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  color: var(--brown-mid);
  margin: 0 0 10px;
}
.day-pass__cta-body {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--brown-mid);
  line-height: 1.7;
  margin: 0;
}





/* ============================================================
   18. BLOG INDEX PAGE (/stories/)
   ============================================================ */

.blog-index {
  padding: 72px 48px;
}

.blog-index__inner {
  max-width: var(--container-mid);
  margin: 0 auto;
}

/* ── ROW CARD ── */
.blog-row {
  display: flex;
  gap: 48px;
  padding: 48px 0;
  border-bottom: 1px solid var(--border);
  align-items: flex-start;
}
.blog-row:first-of-type {
  border-top: 1px solid var(--border);
}

/* ── IMAGE ── */
.blog-row__image-link {
  flex: 0 0 300px;
  border-radius: var(--radius-md);
  overflow: hidden;
  display: block;
}
.blog-row__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: opacity 0.2s ease;
}
.blog-row__image-link:hover .blog-row__image {
  opacity: 0.88;
}

/* ── CONTENT ── */
.blog-row__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.blog-row__date {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}

.blog-row__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  color: var(--brown-mid);
  line-height: 1.2;
  margin: 0;
}
.blog-row__title a {
  color: inherit;
  text-decoration: none;
}
.blog-row__title a:hover {
  color: var(--olive);
}

.blog-row__excerpt {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--brown-light);
  line-height: 1.7;
  margin: 0;
}

/* ── PAGINATION ── */
.blog-index__pagination {
  padding: 48px 0 0;
  display: flex;
  justify-content: center;
}
.blog-index__pagination .nav-links {
  display: flex;
  gap: 16px;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  color: var(--olive);
}
.blog-index__pagination a {
  color: var(--olive);
}
.blog-index__pagination a:hover {
  color: var(--green);
}

/* ── EMPTY STATE ── */
.blog-index__empty {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--muted);
  padding: 72px 0;
  text-align: center;
}


.img-crop-match {
  height: 300px;
  overflow: hidden;
}
.img-crop-match img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.related-card__image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}





/* ── SECTION DIVIDER HEADERS (Staff / Facilitators) ── */
.facilitators-section-header {
  margin-bottom: 40px;
}

.facilitators-section-title {
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 600;
  color: var(--brown-mid);
  margin: 0 0 16px;
}

.facilitators-section-intro {
  font-family: var(--font-sans);
  font-size: 15.5px;
  color: var(--brown-light);
  line-height: 1.75;
  max-width: 760px;
  margin: 0;
}

/* Alternate background for the Facilitators section */
.event-presenters--alt {
  background: var(--sand);
}

/* ── LODGING COMPARISON TABLE ── */
.lodging-table-wrap {
  overflow-x: auto;
}

.lodging-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-sans);
  font-size: 14px;
  min-width: 580px;
}

.lodging-table thead tr {
  background: var(--sand);
}

.lodging-table th {
  padding: 12px 16px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--brown-light);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.lodging-table td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  color: var(--brown-mid);
  vertical-align: middle;
}

.lodging-table tbody tr:last-child td {
  border-bottom: none;
}

.lodging-table__group td {
  background: var(--sand);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--brown-light);
  padding: 8px 16px;
}

.lodging-table__name {
  font-weight: 700;
  color: var(--brown-dark);
}

.lodging-table__check {
  color: var(--green);
  font-weight: 700;
  text-align: center;
}

.lodging-table__dash {
  color: var(--muted);
  text-align: center;
}

/* Privacy / seasonal badges */
.lodging-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 3px 10px;
  border-radius: 20px;
  white-space: nowrap;
}

.lodging-badge--shared {
  background: var(--sand);
  color: var(--brown-light);
  border: 1px solid var(--border);
}

.lodging-badge--semi {
  background: #EAF3FB;
  color: #2A6A9E;
}

.lodging-badge--private {
  background: #EAF3DE;
  color: #3B6D11;
}

.lodging-badge--seasonal {
  background: #FDF0E6;
  color: var(--terracotta);
}

/* =============================================
   FACILITIES PAGE
   ============================================= */

.facility-section {
    background-color: var(--cream);
    padding: 64px 0;
}

.facility-section--alt {
    background-color: var(--sand);
}

.facility-section__inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 48px;
}



.facility-section .feature-row {
    margin-bottom: 20px;
}

.facility-section .feature-row__image img {
    width: 100%;
    height: 340px;
    object-fit: cover;
    border-radius: 4px;
}

.facility-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 12px;
}

.facility-grid img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .facility-section {
        padding: 40px 0;
    }
    .facility-section__inner {
        padding: 0 20px;
    }
    .facility-section .feature-row__image img {
        height: 240px;
    }
    .facility-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .facility-grid img {
        height: 150px;
    }
}















/* ============================================================
   32. MOBILE NAV — BASE STYLES (apply at all breakpoints)
   Hamburger, overlay, and drawer are hidden on desktop.
   The @media block below activates them on mobile.
   ============================================================ */

/* Hamburger button — hidden on desktop */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
}
.nav-hamburger__bar {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--brown-dark);
  border-radius: 2px;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

/* Overlay and drawer — hidden on desktop */
.nav-overlay,
.nav-drawer {
  display: none;
}


/* ============================================================
   32. RESPONSIVE — max-width: 768px
   ============================================================ */
@media (max-width: 768px) {

  /* ──────────────────────────────────────────────────────────
     HEADER & NAVIGATION
     ────────────────────────────────────────────────────────── */

  .site-header {
    padding: 14px 20px;
  }

  /* Hide desktop nav (includes the CTA button inside it) */
  .site-nav {
    display: none;
  }

  /* Show hamburger */
  .nav-hamburger {
    display: flex;
  }

  /* Hamburger → X animation when drawer is open */
  .nav-hamburger.is-open .nav-hamburger__bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .nav-hamburger.is-open .nav-hamburger__bar:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
  }
  .nav-hamburger.is-open .nav-hamburger__bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  /* ── Overlay ── */
  .nav-overlay {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(44, 40, 37, 0.5);
    z-index: 200;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }
  .nav-overlay.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  /* ── Drawer ── */
  .nav-drawer {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 82%;
    max-width: 320px;
    background: var(--cream);
    z-index: 300;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
    box-shadow: -4px 0 24px rgba(44, 40, 37, 0.18);
  }
  .nav-drawer.is-open {
    transform: translateX(0);
  }

  /* Drawer: header row (logo + close button) */
  .nav-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
  }
  .nav-drawer__logo {
    height: 44px;
    width: auto;
  }
  .nav-drawer__close {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 26px;
    line-height: 1;
    color: var(--brown-mid);
    padding: 4px 8px;
  }

  /* Drawer: link list */
  .nav-drawer__links {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .nav-drawer__item {
    border-bottom: 1px solid var(--border);
  }

  /* Simple direct link */
  .nav-drawer__link {
    display: block;
    padding: 16px 20px;
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: 600;
    color: var(--brown-dark);
    text-decoration: none;
  }
  .nav-drawer__link:hover {
    color: var(--olive);
  }

  /* Sub-menu trigger button (items with children) */
  .nav-drawer__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 20px;
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: 600;
    color: var(--brown-dark);
    text-align: left;
  }
  .nav-drawer__trigger-icon {
    font-size: 20px;
    font-weight: 300;
    color: var(--brown-light);
    line-height: 1;
    transition: transform 0.2s ease;
  }

  /* Sub-menu links (collapsed by default) */
  .nav-drawer__sub {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
    background: var(--sand);
  }
  .nav-drawer__sub.is-open {
    max-height: 600px;
  }
  .nav-drawer__sub a {
    display: block;
    padding: 13px 20px 13px 36px;
    font-family: var(--font-sans);
    font-size: 14px;
    font-weight: 400;
    color: var(--brown-mid);
    text-decoration: none;
    border-bottom: 1px solid var(--border);
  }
  .nav-drawer__sub a:last-child {
    border-bottom: none;
  }
  .nav-drawer__sub a:hover {
    color: var(--olive);
  }

  /* CTA at bottom of drawer */
  .nav-drawer__cta {
    padding: 24px 20px;
  }
  .nav-drawer__cta .btn {
    display: block;
    width: 100%;
    text-align: center;
  }


  /* ──────────────────────────────────────────────────────────
     HERO
     ────────────────────────────────────────────────────────── */

  .hero {
    height: 520px;
  }
  .hero__content {
    padding: 0 24px 48px;
  }


  /* ──────────────────────────────────────────────────────────
     FOUNDER QUOTE
     ────────────────────────────────────────────────────────── */

  .section-founder-quote {
    padding: 56px 24px;
  }


  /* ──────────────────────────────────────────────────────────
     COMMUNITY PHOTO GRID
     ────────────────────────────────────────────────────────── */

  .section-community {
    padding: 56px 24px;
  }
  .photo-grid-main {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .photo-grid-main__tall {
    grid-row: 1 / 3;
  }
  .photo-grid-bottom {
    grid-template-columns: 1fr 1fr;
  }
  .photo-grid-bottom__cell {
    height: 100px;
  }


  /* ──────────────────────────────────────────────────────────
     UPCOMING EVENTS (homepage cards)
     ────────────────────────────────────────────────────────── */

  .section-events {
    padding: 56px 20px;
  }
  .events-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }


  /* ──────────────────────────────────────────────────────────
     TESTIMONIAL
     ────────────────────────────────────────────────────────── */

  .section-testimonial {
    padding: 48px 24px;
  }


  /* ──────────────────────────────────────────────────────────
     BLOG CARDS (homepage)
     ────────────────────────────────────────────────────────── */

  .section-blog {
    padding: 56px 20px;
  }
  .blog-grid {
    grid-template-columns: 1fr;
  }


  /* ──────────────────────────────────────────────────────────
     FOOTER
     ────────────────────────────────────────────────────────── */

  .site-footer {
    padding: 56px 24px 32px;
  }
  /* Both footer grid variants → 2 columns */
  .footer-grid,
  .site-footer__inner {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  .site-footer__bottom {
    flex-direction: column;
    gap: 8px;
  }


  /* ──────────────────────────────────────────────────────────
     ARTICLE / BLOG POST PAGES
     ────────────────────────────────────────────────────────── */

  .article__wide {
    padding-left: 20px;
    padding-right: 20px;
  }
  .article__wide--top {
    padding-top: 24px;
  }
  .article__wide--header {
    padding-top: 20px;
    padding-bottom: 24px;
  }
  .article__portrait {
    flex-direction: column;
  }


  /* ──────────────────────────────────────────────────────────
     GENERAL CONTENT SECTIONS
     (About, Mission, Land, Staff, Volunteer, Support, etc.)
     ────────────────────────────────────────────────────────── */

  .content-section {
    padding: 48px 20px;
  }

  /* Mission statements 2-col → 1-col */
  .mission-statements {
    grid-template-columns: 1fr;
  }

  /* Split layout (image left / content right) → stack */
  .split-layout {
    flex-direction: column;
    gap: 32px;
  }
  .split-layout__media {
    flex: none;
    width: 100%;
  }

  /* Feature rows (land page) → stack; reverse rows straighten out */
  .feature-row {
    flex-direction: column;
    gap: 28px;
    padding: 40px 0;
  }
  .feature-row--reverse {
    flex-direction: column;
  }
  .feature-row__media {
    flex: none;
    width: 100%;
  }

  /* 2-col grids → 1-col */
  .paths-grid,
  .facilities-grid,
  .wildlife-grid,
  .transport-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .wildlife-grid {
    gap: 32px;
  }

  /* Transport card padding reduction */
  .transport-card {
    padding: 32px 24px;
  }

  /* Ride callout → stack */
  .ride-callout {
    flex-direction: column;
    gap: 16px;
  }

  /* Scholarship callout → stack */
  .scholarship-callout {
    padding: 48px 20px;
  }
  .scholarship-callout__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  /* Section header margin reduction */
  .section-header {
    margin-bottom: 28px;
  }

  /* Linked continue size cap on narrow screens */
  .linked-continue {
    font-size: clamp(1.5rem, 6vw, 2.5rem);
  }


  /* ──────────────────────────────────────────────────────────
     BLOG INDEX PAGE
     ────────────────────────────────────────────────────────── */

  .blog-index {
    padding: 40px 20px 64px;
  }
  .blog-row {
    flex-direction: column;
    gap: 20px;
    padding: 40px 0;
  }
  .blog-row__image-link {
    width: 100%;
  }
  .blog-row__image {
    width: 100%;
    height: 220px;
  }


  /* ──────────────────────────────────────────────────────────
     EVENTS LISTING PAGE
     ────────────────────────────────────────────────────────── */

  .page-header-section {
    padding: 40px 20px 0;
  }
  .events-divider-wrap,
  .events-list-section {
    padding-left: 20px;
    padding-right: 20px;
  }
  .event-row {
    flex-direction: column;
    gap: 20px;
    padding: 36px 0;
  }
  .event-row__image-wrap {
    max-width: 100%;
    width: 100%;
    flex: none;
    aspect-ratio: 1 / 1;
  }
  .event-row__content {
    flex: none;
    width: 100%;
  }
  .events-archive {
    padding: 32px 20px 64px;
  }


  /* ──────────────────────────────────────────────────────────
     EVENT DETAIL PAGE
     ────────────────────────────────────────────────────────── */

  .event-breadcrumb {
    padding: 20px 20px 0;
  }
  .event-hero {
    padding: 20px 20px 0;
  }
  .event-hero__image-wrap {
    height: 240px;
  }
  .event-gallery {
    grid-template-columns: repeat(3, 1fr);
  }
  .event-intro {
    padding: 0 20px 40px;
  }
  .event-schedule {
    padding: 0 20px 20px;
  }
  /* Remove left indent on schedule — too tight on mobile */
  .event-sessions {
    padding: 0 0 24px 0;
  }
  /* Stack time + content vertically */
  .event-session {
    flex-direction: column;
    gap: 4px;
    padding: 16px 0;
  }
  .event-session__time {
    flex: none;
    width: auto;
  }
  .event-session-divider {
    margin-right: 0;
  }
  .event-rates {
    padding: 48px 20px;
  }
  .event-quote {
    padding: 48px 20px;
  }
  .past-event-banner {
    padding: 14px 20px;
  }
  .em-preview-bar {
    padding: 14px 20px;
  }
  /* Alert signup email form → stack */
  .alert-signup {
    padding: 48px 20px;
  }
  .alert-signup__form {
    flex-direction: column;
  }
  .alert-signup__input,
  .alert-signup__btn {
    width: 100%;
  }


  /* ──────────────────────────────────────────────────────────
     DAY PASSES PAGE
     ────────────────────────────────────────────────────────── */

  .day-pass__pricing-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .day-pass__cta-inner {
    flex-direction: column;
    align-items: flex-start;
  }

} /* end @media (max-width: 768px) */



  /* ──────────────────────────────────────────────────────────
    MEMBERSHIP PAGE
     ────────────────────────────────────────────────────────── */

  .membership-row {
    flex-direction: column;
    gap: 24px;
    padding: 40px 0;
  }
  .membership-row__media,
  .membership-row__identity {
    flex: none;
    width: 100%;
  }
  
  
  
  
  /* ============================================================
   MOBILE FIXES — paste at end of easton.css
   ============================================================ */

@media (max-width: 768px) {

  /* 1. Header — hide the standalone "Find your retreat" CTA
        (it's already in the drawer; this is the sibling button) */
  .site-header > .btn {
    display: none;
  }

  /* 2. Lodging — stack gallery above room description */
  .room-row {
    flex-direction: column;
    gap: 20px;
  }
  .room-img-block {
    width: 100%;
  }
  .room-img-main {
    width: 100%;
    height: 220px;
  }

  /* 3. Dining — one chef per row; photo above text */
  .chef-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .chef-card {
    flex-direction: column;
    gap: 14px;
  }

  /* 4. Day passes — single column, no horizontal scroll */
  .day-pass__pricing-grid {
    grid-template-columns: 1fr;
    gap: 40px;
    padding-left: 0;
    padding-right: 0;
  }

  /* 5. Blog listing — tighten gap between image and text */
  .blog-row {
    flex-direction: column;
    gap: 0;
    padding: 36px 0;
  }
  .blog-row__image,
  .blog-row__image-link {
    width: 100%;
  }
  .blog-row__image {
    height: 200px;
  }
  .blog-row__content {
    padding-top: 20px;
  }

/* Facilitators & Hosts on event pages — 2 columns on mobile */
.event-presenter-grid,
.event-host-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

/* Fix oval photos — force square so border-radius: 50% renders as circle */
.event-presenter__photo,
.event-host__photo {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  max-width: 140px;
}
}


/* ============================================================
   PLUGIN ROUTE STYLES

   These rules existed only in the plugin's copy of this stylesheet
   while the theme carried its own, so they are collected here where
   the two were brought back together. Everything above this point
   comes from the theme copy that had been serving the site.

   The classes below are used by the templates in the Easton Mountain
   plugin, so removing one will leave part of a retreat page unstyled.
   ============================================================ */

/* Additional schedule notes on a retreat page. */
    /* ── ADDITIONAL SCHEDULE NOTES ── */
    .event-additional-notes { padding: 8px 0 16px; }
    .event-note { padding: 22px 0; border-top: 1px solid var(--border); }
    .event-note:first-child { border-top: 0; }

    /* Headline reads as a section heading, matching .event-highlights-label
       in the intro section so the two look like the same level of thing. */
    .event-note__title {
      font-family: var(--font-serif);
      font-weight: 600;
      font-size: 1.4rem;
      color: var(--brown-mid);
      margin: 0 0 10px;
      line-height: 1.3;
    }
    /* The facilitator is part of the heading but subordinate to it: back to
       the body face at body size, so a long name can't compete with the
       headline it belongs to. */
    .event-note__facilitator {
      font-family: var(--font-sans);
      font-size: 15px;
      font-weight: 400;
      font-style: italic;
      color: var(--tan);
      white-space: nowrap;
    }

    /* Description paragraphs follow .event-intro__body exactly: a flex column
       so the 18px gap spaces paragraphs evenly, with the <p> themselves
       carrying no margin.

       The !important flags are copied from that rule deliberately. These are
       unclassed <p> elements produced by wpautop(), which the active theme
       styles directly — the intro body needed the same flags to win, and the
       old single .event-note__desc paragraph only escaped it by being
       classed. */
    .event-note__body,
    .event-note__full {
      display: flex;
      flex-direction: column;
      gap: 18px !important;
      font-weight: 400 !important;
    }
    /* .event-note__full is display:flex above, which would beat the [hidden]
       attribute's display:none and leave the expanded copy permanently
       visible. This restores it. */
    .event-note__full[hidden] { display: none; }

    .event-note__body p {
      font-size: 16px !important;
      color: var(--brown-mid) !important;
      line-height: 1.75 !important;
      margin: 0;
    }
    .event-note__toggle {
      color: #B5623E;
      font-weight: 600;
      white-space: nowrap;
      margin-left: 4px;
    }
    /* Pulls the "Show less" link up tight against the last paragraph instead
       of sitting a full 18px gap away from it. */
    .event-note__toggle-wrap {
      margin-top: -8px !important;
    }

/* Intro split: the square event image beside the description. */
    /* ── INTRO SPLIT: square image on the left, copy on the right ── */
    /* Mobile first, so the wrapper stays a plain block and the image simply
       follows the copy on a narrow screen. The two column layout is added
       back in the media query below. */
    .event-intro__split-media {
      margin-top: 28px;
    }
    .event-intro__split-img {
      width: 260px;
      height: 260px;
      max-width: 100%;      /* never overflow a narrow phone */
      object-fit: cover;    /* fill the square whatever the source ratio */
      border-radius: 6px;   /* matches .event-gallery__item */
      display: block;
    }

    /* This is the only breakpoint in the stylesheet, so the value is taken
       from the container maths rather than from an existing convention. The
       block sits inside .event-hero, which is 1100px wide with 48px of
       padding each side, and the image column takes 260px plus a 40px gap.
       That still leaves the copy about 460px of measure, which stays
       comfortable to read. Going narrower squeezes the text into a column
       too tight to scan. */
    @media (min-width: 860px) {
      .event-intro__split {
        display: flex;
        align-items: flex-start;  /* image sits level with the heading */
        gap: 40px;
      }
      .event-intro__split-media {
        flex: 0 0 260px;  /* fixed: never grows, never shrinks */
        margin-top: 0;
      }
      .event-intro__split-content {
        flex: 1;
        min-width: 0;     /* lets the text column shrink, so a long unbroken
                             word cannot force the layout to overflow */
      }
    }

/* Two column gallery variant. No template references this today. */
    .event-gallery--grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

/* Keeps the learn more button readable on hover. */
.btn--learn-more:hover { 
  color: var(--cream); 
}