/* Sub-pages: Who we are (/about/), What we stand for (/stand-for/) and the not-found page.
   Linked only from pages rendered by cms/pages.mjs; the homepage does not load it. */
.page{flex:1 0 auto;display:flex;flex-direction:column}
.page :where(h1,h2,h3,p,blockquote,figure){margin:0}
.page [id]{scroll-margin-top:var(--space-6)}

/* Banner the overlaid header sits on: a centred title and subtitle on the
   brand colour, with a photo rising from the bottom edge. Here it is Roosevelt at the 1912 rally in the site blue, fading in at its top. */
.page-hero{display:flex;flex-direction:column;align-items:center;background:var(--color-red-02);color:var(--color-tan-02);text-align:center;padding:calc(56px + var(--space-7)) var(--margin-page-inline) 0}
.page-hero:after{content:"";align-self:stretch;height:clamp(11rem,30vw,27rem);margin:var(--space-7) calc(-1 * var(--margin-page-inline)) 0;background:url(/_optimized/241e77f20af117a2bf0a.webp) 50% 0/cover no-repeat;-webkit-mask-image:linear-gradient(transparent,#000 22%);mask-image:linear-gradient(transparent,#000 22%)}
.page-hero__inner{display:grid;gap:var(--space-5);justify-items:center;width:min(100%,56rem)}
.page-hero__heading{color:var(--color-tan-02);font-size:clamp(var(--type-title-lg),9vw,var(--type-title-xl));line-height:var(--leading-title-tight);text-wrap:balance;overflow-wrap:break-word}
.page-hero__lede{max-width:36rem;text-wrap:balance}
.page-hero--full{flex:1 0 auto;justify-content:center;border-bottom:1px solid color-mix(in srgb,var(--color-tan-02) 22%,transparent)}
.page-hero__actions{margin-top:var(--space-3)}
.page-hero__button{background:var(--color-tan-02);color:var(--color-red-02)}
.page-hero__button:hover,.page-hero__button:focus-visible{background:var(--color-tan-03)}
@media (width>=760px){.page-hero{padding-top:calc(96px + var(--space-8))}.page-hero:after{margin-top:var(--space-8)}}
/* With a banner image the banner works like the homepage hero, whose .hero markup and scroll arrow it shares: the image is
   the banner, under the menu, with the title set over it and the arrow below. It is a bit shorter than the homepage's,
   cropping rather than squashing the photo: 80% of a phone screen, and about 2.4:1 on wider screens (never more than three
   quarters of the window). It grows if its words need more room, so they never get cut off.
   The selectors outrank the homepage's own .hero sizing rules. */
.page-hero--image{display:block;padding:0}
.page-hero--image:after{content:none}
section.page-hero--image.hero{height:auto;min-height:max(32rem,80svh)}
.page-hero--image.hero .hero__media[data-astro-cid-i3irphx7],.page-hero--image.hero .hero__media[data-astro-cid-i3irphx7] picture[data-astro-cid-i3irphx7]{position:absolute;inset:0}
.page-hero--image.hero .hero__media[data-astro-cid-i3irphx7] img[data-astro-cid-i3irphx7]{height:100%;object-fit:cover;object-position:center 40%}
.page-hero--image .page-hero__inner{position:relative;z-index:1;width:auto;min-height:inherit;align-content:center;padding:calc(56px + var(--space-6)) var(--margin-page-inline) var(--space-9)}
/* A soft shade behind the words keeps them readable over the lighter parts of the photo. */
.page-hero--image .page-hero__inner:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 55% 45% at 50% 52%,color-mix(in srgb,#001a4d 55%,transparent),transparent);pointer-events:none}
.page-hero--image .page-hero__heading,.page-hero--image .page-hero__lede{text-shadow:0 2px 24px color-mix(in srgb,#001a4d 75%,transparent)}
@media (width>=760px){
  section.page-hero--image.hero{min-height:max(26rem,min(41.7vw,75svh))}
  .page-hero--image .page-hero__inner{padding:calc(96px + var(--space-5)) var(--margin-page-inline) var(--space-8)}
}

/* Not found: the hoofprints wander off from under the button instead of the photo strip. */
.page-hero--art{padding-bottom:var(--space-8)}
.page-hero--art:after{content:none}
.page-hero__art{display:block;width:min(100%,46rem);height:auto;margin-top:var(--space-7);pointer-events:none}
@media (width>=760px){.page-hero--art{padding-bottom:var(--space-9)}.page-hero__art{margin-top:var(--space-8)}}

/* Body sections: a large heading on the left, the text on the right,
   on alternating beige and blue (never white). Used by each priority, the story and the questions. */
.plank,.story,.faq{padding:var(--space-8) var(--margin-page-inline)}
.plank__inner,.story__inner,.faq__inner{display:grid;gap:var(--space-5);width:min(100%,72rem);margin:0 auto}
.plank__title,.story__heading,.faq__heading{color:var(--color-red-02);text-wrap:balance}
.plank__body,.story__body{display:grid;gap:1em;max-width:40rem;color:var(--color-black-02)}
@media (width>=900px){
  .plank,.story,.faq{padding-block:var(--space-9)}
  .plank__inner,.story__inner,.faq__inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-8);align-items:start}
}
.story{background:var(--color-tan-02)}
/* Who we are: the story is one centered column rather than heading-left, text-right. */
.story__inner{grid-template-columns:minmax(0,1fr);gap:var(--space-5);justify-items:center;text-align:center}
.plank{background:var(--color-tan-02)}
/* What we stand for alternates beige and blue under the blue banner, never white. */
.plank:nth-child(even){background:var(--color-red-02)}
.plank:nth-child(even) :is(.plank__title,.plank__number,.plank__lead,.plank__body){color:var(--color-tan-02)}
.planks:has(.plank:last-child:nth-child(even)) + .page-cta{border-top:1px solid color-mix(in srgb,var(--color-tan-02) 22%,transparent)}

/* What we stand for: each priority's number above its title, and its image below, if it has one. */
.plank__head{display:grid;gap:var(--space-3);justify-items:start}
.plank__number{color:var(--color-red-02);opacity:.55;font-variant-numeric:lining-nums tabular-nums}
.plank__image{display:block;width:min(100%,14rem);height:auto;margin-top:var(--space-4)}
.plank__content{display:grid;gap:var(--space-5);align-content:start}
.plank__lead{color:var(--color-red-02);font-weight:600;max-width:40rem}

/* Phones: every part of the plank centered. Wider: the subtitle starts level with the title and the body
   follows it at a fixed gap, independent of how tall the title or image is. */
.page--stand-for .plank__title{--type-title-lg:clamp(40px,4.5vw,60px)}
.page--stand-for .plank__lead{font-size:clamp(22px,2vw,28px);line-height:1.35;text-wrap:pretty}
.page--stand-for .plank__body{font-size:clamp(18px,1.6vw,22px);line-height:1.55;text-wrap:pretty}
.page--stand-for :is(.plank__head,.plank__content){display:contents}
.page--stand-for .plank__number{grid-row:1}
.page--stand-for .plank__title{grid-row:2}
.page--stand-for .plank__lead{grid-row:3}
.page--stand-for .plank__image{grid-row:4;margin-top:0}
.page--stand-for .plank__body{grid-row:5}
@media (width<900px){
  .page--stand-for :is(.plank__number,.plank__title,.plank__lead,.plank__body){text-align:center}
  .page--stand-for :is(.plank__lead,.plank__image,.plank__body){justify-self:center}
}
@media (width>=900px){
  .page--stand-for .plank{padding-block:var(--space-8)}
  /* A wider band and larger subtitle and body, so the text fills its side beside the title and image.
     Sized so the longest body still ends level with the image and every band stays the same height. */
  .page--stand-for .plank__inner{width:min(100%,80rem);row-gap:var(--space-5);grid-template-rows:auto auto 1fr}
  .page--stand-for .plank__lead{font-size:clamp(22px,2.2vw,32px)}
  .page--stand-for .plank__body{font-size:clamp(18px,1.7vw,24px);line-height:1.5}
  .page--stand-for .plank__number{grid-column:1 / -1;grid-row:1}
  /* Every title holds two lines, so a one-line title keeps its band as tall as the others and its image level with theirs. */
  .page--stand-for .plank__title{grid-column:1;grid-row:2;min-height:2lh}
  .page--stand-for .plank__image{grid-column:1;grid-row:3;width:min(100%,16rem)}
  .page--stand-for .plank__content{display:grid;grid-column:2;grid-row:2 / span 2}
  .page--stand-for :is(.plank__lead,.plank__body){grid-row:auto}
}

/* Who we are: a pull quote on the site blue. */
.quote{display:grid;gap:var(--space-5);justify-items:center;padding:var(--space-8) var(--margin-page-inline);background:var(--color-red-02);color:var(--color-tan-02);text-align:center}
.quote__text{max-width:52rem;color:var(--color-tan-02);font-size:clamp(var(--type-title-md),5vw,var(--type-title-lg));line-height:var(--leading-title);text-wrap:balance}
.quote__text p:before{content:"“"}
.quote__text p:after{content:"”"}
.quote__credit{max-width:34rem;color:var(--color-tan-03);text-wrap:balance}
@media (width>=900px){.quote{padding-block:var(--space-9)}}

/* Who we are: questions that open in place. */
.faq__list{border-top:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent)}
.faq__item{border-bottom:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent)}
.faq__question{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);padding:var(--space-5) 0;color:var(--color-red-02);cursor:pointer;list-style:none}
.faq__question::-webkit-details-marker{display:none}
.faq__question:after{content:"";flex:none;width:32px;height:32px;border-radius:999px;background:var(--color-red-02) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff5e5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/20px no-repeat;transition:transform var(--transition-hover)}
.faq__item[open] .faq__question:after{transform:rotate(180deg)}
.faq__item.is-closing .faq__question:after{transform:none}
@media (hover:hover){.faq__question:hover{color:var(--color-black-02)}}
.faq__question:focus-visible{outline:2px solid var(--color-red-02);outline-offset:4px;border-radius:var(--radius-control)}
.faq__answer{display:grid;gap:1em;max-width:44rem;padding-bottom:var(--space-5);color:var(--color-black-01)}

/* Closing call to action on the site blue, a hairline above the footer. */
.page-cta{margin-top:auto;padding:var(--space-8) var(--margin-page-inline);background:var(--color-red-02);color:var(--color-tan-02);text-align:center;border-bottom:1px solid color-mix(in srgb,var(--color-tan-02) 22%,transparent)}
.page-cta__inner{display:grid;gap:var(--space-5);justify-items:center;width:min(100%,44rem);margin:0 auto}
.page-cta__heading{color:var(--color-tan-02);text-wrap:balance}
.page-cta__body{text-wrap:pretty}
.page-cta__button{margin-top:var(--space-2);background:var(--color-tan-02);color:var(--color-red-02)}
.page-cta__button:hover,.page-cta__button:focus-visible{background:var(--color-tan-03)}
.page-cta__button:focus-visible{outline:2px solid var(--color-tan-02);outline-offset:3px}
@media (width>=900px){.page-cta{padding-block:var(--space-8)}}

/* The current page in the mobile menu and footer. The header draws its line in index.html, the same one that slides in on hover. */
a[aria-current=page].site-header__mobile-link,a[aria-current=page].site-footer__link{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.3em;text-decoration-color:currentColor}

@media (prefers-reduced-motion:reduce){.faq__question:after{transition:none}}

/* Events (/events/): a short banner, highlighted events in large cards on the blue,
   then every event as a list by month and day (or a month grid), with filters and each event's details in a dialog.
   _astro/events-page.js adds everything past the list; the shared date tile and type label are in index.html. */
.page--events [hidden]{display:none!important}
.page--events :where(h4,ol,ul,dl,dd){margin:0}
.page-hero--compact:not(.page-hero--image){padding-bottom:var(--space-7)}
.page-hero--compact:not(.page-hero--image):after{content:none}
@media (width>=760px){.page-hero--compact:not(.page-hero--image){padding-top:calc(96px + var(--space-6));padding-bottom:var(--space-8)}}

/* Contact: the same blue banner and beige body as the other sub-pages. */
.contact{flex:1 0 auto;padding:var(--space-8) var(--margin-page-inline);background:var(--color-tan-02);color:var(--color-red-02)}
.contact [hidden]{display:none!important}
.contact__inner{display:grid;gap:var(--space-7);width:min(100%,72rem);margin:0 auto}
.contact__intro{display:grid;gap:var(--space-5);align-content:start;max-width:32rem}
.contact__heading{color:var(--color-red-02);text-wrap:balance}
.contact__body{min-width:0}
.contact__form{display:grid;gap:var(--space-5);padding:var(--space-5);border:1.5px solid var(--color-red-02);border-radius:var(--radius-image)}
.contact__fields,.contact__field{display:grid;gap:var(--space-3);min-width:0}
.contact__fields{gap:var(--space-5)}
.contact__field label{font-weight:600}
.contact__field :is(input,textarea){box-sizing:border-box;width:100%;min-width:0;min-height:52px;padding:var(--space-3) var(--space-4);border:1.5px solid var(--color-red-02);border-radius:var(--radius-control);background:var(--color-tan-02);color:var(--color-red-02);font:400 16px/1.5 var(--font-body)}
.contact__field textarea{min-height:10rem;resize:vertical}
.contact__field :is(input,textarea):focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px}
.contact__field input:autofill{box-shadow:0 0 0 1000px var(--color-tan-02) inset;-webkit-text-fill-color:var(--color-red-02)}
.contact__submit{justify-self:start;background:var(--color-red-02);color:var(--color-tan-02)}
.contact__submit:hover,.contact__submit:focus-visible{background:var(--color-red-03);color:var(--color-tan-02)}
.contact__submit:focus-visible,.contact__email a:focus-visible{outline:2px solid var(--color-red-02);outline-offset:4px}
.contact__submit:disabled{opacity:.65;cursor:wait}
.contact__status{padding:var(--space-4);border-left:3px solid var(--color-red-02)}
.contact__email{display:grid;gap:var(--space-2);margin-top:var(--space-5)!important}.contact__social{display:grid;gap:var(--space-3);margin-top:var(--space-5);color:var(--color-red-02)}.contact__social .social-links{margin-left:-2px}
.contact__email a{color:var(--color-red-02);overflow-wrap:anywhere;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.2em}
.contact__thanks{display:grid;gap:var(--space-5);justify-items:center;width:min(100%,40rem);margin:0 auto;text-align:center}
.contact__thanks .contact__submit{justify-self:center}
@media (width>=600px){.contact__fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.contact__form{padding:var(--space-6)}}
@media (width>=900px){.contact{padding-block:var(--space-9)}.contact__inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-8)}}

/* Privacy: the same blue banner and beige body as Contact, read as one centered column with each heading above its text. */
.policy{flex:1 0 auto;padding:var(--space-8) var(--margin-page-inline);background:var(--color-tan-02);color:var(--color-red-02)}
.policy__inner{display:grid;gap:var(--space-8);width:min(100%,44rem);margin:0 auto}
.policy__list{display:grid;gap:var(--space-7)}
.policy__item{display:grid;gap:var(--space-3)}
.policy__heading{color:var(--color-red-02);text-wrap:balance}
.policy__body{display:grid;gap:1em;color:var(--color-black-02)}
.policy__footer{display:grid;gap:var(--space-2);padding-top:var(--space-6);border-top:1.5px solid var(--color-red-02)}
.policy__footer p{margin:0}
.policy__email a{color:var(--color-red-02);overflow-wrap:anywhere;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.2em}
.policy__email a:focus-visible{outline:2px solid var(--color-red-02);outline-offset:4px}
.policy__updated{color:var(--color-black-02)}
@media (width>=900px){.policy{padding-block:var(--space-9)}}

/* Highlighted events: cream cards on the blue, sliding sideways when they don't all fit. */
.featured{display:grid;gap:var(--space-5);padding:0 0 var(--space-8) var(--margin-page-inline);background:var(--color-red-02);color:var(--color-tan-02);overflow:hidden}
.page-hero--image + .hero__anchor + script + .featured,.page-hero--image + .featured{padding-top:var(--space-8)}
.featured__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding-right:var(--margin-page-inline)}
.featured__heading{color:var(--color-moose)}
.featured__arrows .carousel-arrow img{opacity:0}
.featured__arrows .carousel-arrow:after{content:"";position:absolute;inset:4px;background-color:var(--color-red-02);-webkit-mask:var(--arrow) 50%/32px 32px no-repeat;mask:var(--arrow) 50%/32px 32px no-repeat}
.featured__arrows .carousel-arrow[data-scroll="-1"]{--arrow:url(/arrow-left.svg)}
.featured__arrows .carousel-arrow[data-scroll="1"]{--arrow:url(/arrow-right.svg)}
.featured__viewport{overflow:auto hidden;scroll-snap-type:x proximity;scrollbar-width:none}
.featured__viewport::-webkit-scrollbar{display:none}
.featured__viewport:focus-visible{outline:2px solid var(--color-tan-02);outline-offset:4px}
.featured__track{display:flex;align-items:stretch;gap:var(--space-5);margin:0;padding:0 var(--margin-page-inline) 0 0;list-style:none}
.featured__card{flex:0 0 min(44rem,86vw);display:grid;gap:var(--space-5);align-content:start;justify-items:start;padding:var(--space-5);border-radius:var(--radius-image);background:var(--color-tan-02);color:var(--color-black-02);scroll-snap-align:start}
.featured__card:only-child{flex-basis:min(60rem,calc(100vw - 2 * var(--margin-page-inline)))}
.featured__tile{align-self:start;min-width:5.25rem}
.featured__tile .event-tile__day{font-size:54px}
.featured__body{display:grid;gap:var(--space-3);justify-items:start;min-width:0}
.featured__type{color:var(--color-red-02)}
.featured__title{color:var(--color-red-02);text-wrap:balance;overflow-wrap:break-word}
.featured__when{color:var(--color-red-02);font-variant-numeric:lining-nums}
.featured__place{color:var(--color-black-01)}
.featured__summary{max-width:38rem;color:var(--color-black-02);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.featured__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5);margin-top:var(--space-2)}
@media (width>=760px){.featured__card{grid-template-columns:auto minmax(0,1fr);gap:var(--space-6);padding:var(--space-6)}}

/* Links styled as underlined words: Details, Clear all, Show past events. */
.featured__link,.agenda__link{color:inherit;text-decoration:none}
.featured__more,.agenda__more,.calendar__text-button{padding:0;border:0;background:none;color:var(--color-red-02);font-family:var(--font-title);font-weight:700;font-variation-settings:var(--font-title-variation);font-size:var(--type-button-sm);letter-spacing:.04em;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.25em;cursor:pointer}
@media (hover:hover){.featured__link:hover,.agenda__link:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}.featured__more:hover,.agenda__more:hover,.calendar__text-button:hover{text-decoration-thickness:3px}}
:is(.featured__link,.agenda__link,.featured__more,.agenda__more,.calendar__text-button):focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px;border-radius:var(--radius-control)}
.featured__rsvp,.agenda__rsvp{height:44px;min-height:44px;padding:0 var(--space-5);font-size:var(--type-button-sm)}
.featured__rsvp:focus-visible,.agenda__rsvp:focus-visible{outline-color:var(--color-red-02)}

/* The calendar: heading and view switch, filters, then the list or the month grid. */
.calendar{padding:var(--space-8) var(--margin-page-inline);background:var(--color-tan-02)}
/* Beige panels on the beige calendar are set off with a blue outline instead of a white fill. */
.calendar__filters,.month__agenda,.calendar__empty,.calendar__nomatch,.month__pick,.addcal__menu{border:1.5px solid color-mix(in srgb,var(--color-red-02) 25%,transparent)}
.calendar__inner{display:grid;gap:var(--space-5);width:min(100%,72rem);margin:0 auto}
.calendar__bar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-4)}
.calendar__heading{color:var(--color-red-02)}
.calendar__tools{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.calendar__views{display:inline-flex;padding:4px;border:1.5px solid color-mix(in srgb,var(--color-red-02) 30%,transparent);border-radius:999px;background:var(--color-tan-02)}
.calendar__view,.calendar__filter-toggle,.month__today,.event-dialog__secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:40px;padding:0 var(--space-4);border:0;border-radius:999px;background:transparent;color:var(--color-red-02);font-family:var(--font-title);font-weight:700;font-variation-settings:var(--font-title-variation);font-size:var(--type-button-sm);letter-spacing:.04em;line-height:1;text-transform:uppercase;cursor:pointer;transition:background-color var(--transition-hover),color var(--transition-hover)}
.calendar__view[aria-pressed=true]{background:var(--color-red-02);color:var(--color-tan-02)}
.calendar__filter-toggle,.month__today,.event-dialog__secondary{min-height:48px;border:2px solid var(--color-red-02)}
.calendar__filter-toggle:before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E") center/contain no-repeat}
.calendar__filter-toggle[aria-expanded=true]{background:var(--color-red-02);color:var(--color-tan-02)}
@media (hover:hover){.calendar__view[aria-pressed=false]:hover,.calendar__filter-toggle[aria-expanded=false]:hover,.month__today:hover:not(:disabled),.event-dialog__secondary:hover{background:color-mix(in srgb,var(--color-red-02) 10%,transparent)}}
:is(.calendar__view,.calendar__filter-toggle,.month__today,.event-dialog__secondary,.filter-option,.filter-chip,.month__date,.month__event,.month__nav,.month__pick):focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px}
.month__today:disabled{opacity:.4;cursor:default}

/* Filters: a group of toggles per kind of choice, each with the number of events it would show. */
.calendar__filters{display:grid;gap:var(--space-5);padding:var(--space-5);border-radius:var(--radius-image);background:var(--color-tan-02)}
.filter-group{display:grid;gap:var(--space-3);margin:0;padding:0;border:0}
.filter-group__label{padding:0;color:var(--color-red-02)}
.filter-group__options{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.filter-option{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 var(--space-4);border:1.5px solid color-mix(in srgb,var(--color-red-02) 35%,transparent);border-radius:999px;background:var(--color-tan-02);color:var(--color-red-02);font:600 var(--type-body-md)/1 var(--font-body);cursor:pointer;transition:background-color var(--transition-hover),border-color var(--transition-hover)}
.filter-option[aria-pressed=true]{border-color:var(--color-red-02);background:var(--color-red-02);color:var(--color-tan-02)}
.filter-option[aria-pressed=true]:before{content:"✓"}
.filter-option:disabled{opacity:.45;cursor:not-allowed}
@media (hover:hover){.filter-option[aria-pressed=false]:hover:not(:disabled){border-color:var(--color-red-02)}}
.filter-option__count{opacity:.75;font-variant-numeric:lining-nums tabular-nums}
.calendar__summary{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.calendar__status{margin:0;color:var(--color-black-01)}
.calendar__chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:0;list-style:none}
.calendar__chips:empty{display:none}
.filter-chip{display:inline-flex;align-items:center;gap:var(--space-2);min-height:36px;padding:0 var(--space-3);border:0;border-radius:999px;background:var(--color-moose);color:var(--color-red-02);font-family:var(--font-title);font-weight:700;font-variation-settings:var(--font-title-variation);font-size:14px;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.filter-chip:after{content:"×";font-size:20px;line-height:1}
.calendar__past{margin:0}

/* The list: a heading per month, then each day's tile beside its events. */
.agenda{display:grid;gap:var(--space-7)}
.agenda__month{display:grid;gap:var(--space-2)}
.agenda__month-heading{padding-bottom:var(--space-3);border-bottom:2px solid var(--color-red-02);color:var(--color-red-02)}
.agenda__days{margin:0;padding:0;list-style:none}
.agenda__day{display:grid;grid-template-columns:4.25rem minmax(0,1fr);gap:var(--space-4);padding:var(--space-5) 0;border-bottom:1px solid color-mix(in srgb,var(--color-red-02) 18%,transparent)}
.agenda__day--tba .agenda__events{grid-column:1/-1}
.agenda__tile{align-self:start}
.agenda__day.is-past .agenda__tile{--tile-bg:var(--color-greyscale-03)}
.agenda__events{display:grid;gap:var(--space-5);margin:0;padding:0;list-style:none}
.agenda__event{display:grid;gap:var(--space-3);align-items:center;scroll-margin-top:var(--space-8)}
.agenda__event + .agenda__event:not([hidden]){padding-top:var(--space-5);border-top:1px dashed color-mix(in srgb,var(--color-red-02) 22%,transparent)}
.agenda__main{display:grid;gap:var(--space-2);justify-items:start;min-width:0}
.agenda__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin:0}
.agenda__time{color:var(--color-red-02);font-variant-numeric:lining-nums}
.agenda__type{color:var(--color-red-02)}
.agenda__ended{color:var(--color-greyscale-03)}
.agenda__title{color:var(--color-red-02);text-wrap:balance;overflow-wrap:break-word}
.agenda__place{color:var(--color-black-01)}
.agenda__summary{max-width:44rem;color:var(--color-black-02);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.agenda__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5);margin:0}
.agenda__event.is-past .agenda__main{opacity:.6}
.agenda__event.is-past .agenda__rsvp{display:none}
@media (width>=760px){
  .agenda__day{grid-template-columns:5rem minmax(0,1fr);gap:var(--space-6)}
  .agenda__event{grid-template-columns:minmax(0,1fr) auto;column-gap:var(--space-6)}
  .agenda__actions{flex-direction:column;align-items:flex-end;gap:var(--space-3)}
}

/* The month grid. On phones each day shows dots for its events, and the chosen day's events are listed below. */
.month{display:grid;gap:var(--space-4)}
.month__bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.month__title{min-width:11ch;margin-inline:var(--space-2);color:var(--color-red-02)}
.month__nav{flex:none;width:40px;height:40px;border:0;border-radius:999px;background:var(--color-red-02);cursor:pointer;position:relative;transition:background-color var(--transition-hover)}
.month__nav:after{content:"";position:absolute;inset:4px;background:var(--color-tan-02);-webkit-mask:var(--arrow) 50%/32px 32px no-repeat;mask:var(--arrow) 50%/32px 32px no-repeat}
.month__nav[data-step="-1"]{--arrow:url(/arrow-left.svg)}
.month__nav[data-step="1"]{--arrow:url(/arrow-right.svg)}
.month__nav:disabled{opacity:.35;cursor:default}
@media (hover:hover){.month__nav:hover:not(:disabled){background:#01357a}}
.month__today{margin-left:auto}
.month__grid{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;border-top:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent);border-left:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent)}
.month__grid th{padding:var(--space-2);border-right:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent);border-bottom:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent);background:var(--color-red-02);color:var(--color-tan-02);font-family:var(--font-title);font-weight:700;font-variation-settings:var(--font-title-variation);font-size:14px;letter-spacing:.06em;text-align:left;text-transform:uppercase}
.month__grid abbr{text-decoration:none}
.month__day{height:8rem;padding:6px;border-right:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent);border-bottom:1px solid color-mix(in srgb,var(--color-red-02) 25%,transparent);background:var(--color-tan-02);vertical-align:top;transition:background-color var(--transition-hover)}
.month__day.is-other{background:var(--color-tan-03)}
.month__day.is-other .month__date{color:var(--color-greyscale-03)}
.month__day.is-selected{background:color-mix(in srgb,var(--color-moose) 30%,var(--color-tan-02))}
.month__date{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--color-red-02);font-family:var(--font-title);font-weight:700;font-variation-settings:var(--font-title-variation);font-size:16px;font-variant-numeric:lining-nums tabular-nums;cursor:pointer}
@media (hover:hover){.month__date:hover{background:color-mix(in srgb,var(--color-red-02) 10%,transparent)}}
.month__day.is-today .month__date{background:var(--color-red-02);color:var(--color-tan-02)}
.month__events{display:grid;grid-template-columns:minmax(0,1fr);gap:3px;margin:4px 0 0;padding:0;list-style:none}
.month__event{display:block;width:100%;padding:3px 6px;border:0;border-radius:6px;background:var(--color-red-02);color:var(--color-tan-02);font:600 13px/1.3 var(--font-body);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.month__event-time{font-weight:400;opacity:.85}
.month__event.is-past{background:color-mix(in srgb,var(--color-red-02) 45%,var(--color-tan-02))}
@media (hover:hover){.month__event:hover{background:#01357a}}
.month__more{display:block;margin-top:2px;padding:2px 6px;border:0;background:none;color:var(--color-red-02);font:700 12px/1.3 var(--font-body);cursor:pointer;text-decoration:underline}
.month__dots{display:none}
.month__agenda{display:grid;gap:var(--space-3);padding:var(--space-5);border-radius:var(--radius-image);background:var(--color-tan-02)}
.month__agenda-heading{color:var(--color-red-02)}
.month__agenda-list{display:grid;gap:var(--space-3);margin:0;padding:0;list-style:none}
.month__pick{display:grid;gap:2px;width:100%;padding:var(--space-3) var(--space-4);border:0;border-radius:var(--radius-field);background:var(--color-tan-02);color:var(--color-black-02);text-align:left;cursor:pointer}
.month__pick-time{color:var(--color-red-02);font:700 14px/1.3 var(--font-body)}
.month__pick-title{color:var(--color-red-02)}
.month__pick-place{color:var(--color-black-01);font:400 15px/1.35 var(--font-body)}
.month__pick.is-past{opacity:.6}
@media (hover:hover){.month__pick:hover{background:color-mix(in srgb,var(--color-moose) 25%,var(--color-tan-02))}}
.month__empty{margin:0;color:var(--color-black-01)}
@media (width<=759px){
  .month__title{order:-1;flex-basis:100%;margin:0}
  .month__grid th{padding:6px 0;text-align:center;font-size:12px}
  .month__day{height:3.5rem;padding:4px 0;text-align:center}
  .month__date{width:30px;height:30px;font-size:15px}
  .month__events,.month__more{display:none}
  .month__dots{display:flex;justify-content:center;gap:3px;height:6px;margin-top:3px}
  .month__dots span{width:6px;height:6px;border-radius:999px;background:var(--color-red-02)}
  .month__dots span.is-past{opacity:.4}
}

/* Nothing coming up, or nothing left after filtering. */
.calendar__empty,.calendar__nomatch{display:grid;justify-items:center;gap:var(--space-4);padding:var(--space-8) var(--space-5);border-radius:var(--radius-image);background:var(--color-tan-02);text-align:center}
.calendar__nomatch{padding-block:var(--space-7);gap:var(--space-2)}
.calendar__empty-art{width:min(9rem,40vw);height:auto}
.calendar__empty-heading,.calendar__nomatch-heading{color:var(--color-red-02);text-wrap:balance}
.calendar__empty-body{max-width:34rem;color:var(--color-black-01);text-wrap:balance}

/* One event's details: a sheet rising from the bottom on phones, a centred card on wider screens. */
.event-dialog{width:min(40rem,calc(100% - 2 * var(--space-5)));max-height:calc(100dvh - 2 * var(--space-5));margin:auto;padding:0;border:0;border-radius:var(--radius-image);background:var(--color-tan-02);color:var(--color-black-02);box-shadow:0 30px 80px color-mix(in srgb,#001a4d 35%,transparent);overflow:auto}
.event-dialog::backdrop{background:color-mix(in srgb,#001a4d 72%,transparent)}
.event-dialog[open]{animation:event-dialog-in .35s cubic-bezier(.22,1,.36,1)}
.event-dialog[open]::backdrop{animation:event-dialog-fade .35s ease}
@keyframes event-dialog-in{from{opacity:0;transform:translateY(24px) scale(.98)}}
@keyframes event-dialog-fade{from{opacity:0}}
.event-dialog__panel{position:relative;display:grid;gap:var(--space-4);padding:var(--space-6) var(--space-5) var(--space-5)}
.event-dialog__close{position:absolute;top:var(--space-4);right:var(--space-4);width:40px;height:40px;border:0;border-radius:999px;background:var(--color-red-02) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff5e5' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center/18px no-repeat;cursor:pointer}
.event-dialog__close:focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px}
.event-dialog__tags{display:flex;flex-wrap:wrap;gap:var(--space-2);min-height:1px;margin:0;padding-right:52px;color:var(--color-red-02)}
.event-dialog__title{padding-right:52px;color:var(--color-red-02);text-wrap:balance;overflow-wrap:break-word}
.event-dialog__ended{margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-field);background:var(--color-tan-03);font-weight:600}
.event-dialog__facts{display:grid;gap:var(--space-3);margin:0;padding:var(--space-4) 0;border-block:1px solid color-mix(in srgb,var(--color-red-02) 20%,transparent)}
.event-dialog__fact{display:grid;grid-template-columns:24px minmax(0,1fr);gap:var(--space-3);align-items:start}
.event-dialog__fact:before{content:"";width:24px;height:24px;background:var(--color-red-02);-webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat}
.event-dialog__fact--date{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E")}
.event-dialog__fact--time{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
.event-dialog__fact--place{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.1-7-11a7 7 0 0 1 14 0c0 4.9-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E")}
.event-dialog__fact dd{display:grid;gap:2px;justify-items:start;margin:0;font-weight:600}
.event-dialog__address{color:var(--color-black-01);font-weight:400}
.event-dialog__map{margin-top:2px;color:var(--color-red-02);text-decoration:underline;text-underline-offset:.2em}
.event-dialog__body{display:grid;gap:1em}
.event-dialog__body p{margin:0}
.event-dialog__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);padding-top:var(--space-2)}
.event-dialog__rsvp{height:48px;min-height:48px;padding:0 var(--space-5);font-size:var(--type-button-sm)}
.event-dialog__rsvp:focus-visible,.event-dialog__map:focus-visible,.addcal__item:focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px}
.addcal{position:relative}
.addcal summary{list-style:none}
.addcal summary::-webkit-details-marker{display:none}
.addcal[open] summary{background:var(--color-red-02);color:var(--color-tan-02)}
.addcal__menu{position:absolute;left:0;bottom:calc(100% + var(--space-2));z-index:1;display:grid;min-width:max-content;padding:var(--space-2);border-radius:var(--radius-field);background:var(--color-tan-02);box-shadow:0 12px 32px color-mix(in srgb,#001a4d 25%,transparent)}
.addcal__item{padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);color:var(--color-red-02);font-weight:600;text-decoration:none}
@media (hover:hover){.addcal__item:hover{background:var(--color-tan-02)}}
.event-dialog__note{color:var(--color-black-01);overflow-wrap:anywhere}
@media (width<=759px){
  .event-dialog{width:100%;max-width:100%;max-height:92dvh;margin:auto 0 0;border-radius:var(--radius-image) var(--radius-image) 0 0}
  @keyframes event-dialog-in{from{transform:translateY(40%)}}
}
@media (width>=760px){.event-dialog__panel{padding:var(--space-7) var(--space-7) var(--space-6)}.event-dialog__close{top:var(--space-5);right:var(--space-5)}}
@media (prefers-reduced-motion:reduce){.event-dialog[open],.event-dialog[open]::backdrop{animation:none}}

/* After removing the about-page questions, keep the closing invitation beige after the blue quote. */
.page--about .quote + .page-cta{background:var(--color-tan-02);color:var(--color-red-02)}
.page--about .quote + .page-cta :is(.page-cta__heading,.page-cta__body){color:var(--color-red-02)}
.page--about .quote + .page-cta .page-cta__button{background:var(--color-red-02);color:var(--color-tan-02)}
.page--about .quote + .page-cta .page-cta__button:focus-visible{outline-color:var(--color-red-02)}

/* What we stand for ends on its last (blue) priority, so its closing invitation is beige, with the same blue type and button. */
.page--stand-for .page-cta{border-top:0!important;background:var(--color-tan-02);color:var(--color-red-02)}
.page--stand-for .page-cta :is(.page-cta__heading,.page-cta__body){color:var(--color-red-02)}
.page--stand-for .page-cta .page-cta__button{background:var(--color-red-02);color:var(--color-tan-02)}
.page--stand-for .page-cta .page-cta__button:hover{background:var(--color-red-03)}
.page--stand-for .page-cta .page-cta__button:focus-visible{outline-color:var(--color-red-02)}

/* Event registration uses the existing blue and beige surfaces. */
.event-registration{border-top:1px solid color-mix(in srgb,var(--color-red-02) 20%,transparent);padding-top:var(--space-5)}
.event-registration[hidden],.rsvp-form [hidden]{display:none}
.rsvp-form{display:grid;gap:var(--space-4);font-size:1rem}
.rsvp-form label{display:grid;gap:var(--space-2);font-weight:600}
.rsvp-form input:not([type=checkbox]):not([type=hidden]){display:block;width:100%;min-width:0;padding:12px 14px;border:1px solid var(--color-red-02);border-radius:var(--radius-field);background:var(--color-tan-02);color:var(--color-black-02);font:inherit}
.rsvp-form input:focus-visible{outline:2px solid var(--color-red-02);outline-offset:3px}
.rsvp-form__names{display:grid;gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr))}
.rsvp-form .rsvp-form__choice{display:flex;align-items:flex-start;gap:12px;font-weight:400;line-height:1.5}
.rsvp-form__choice input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--color-red-02)}
.rsvp-form__help,.rsvp-form__status{margin:0;font-weight:400;font-size:.95rem;line-height:1.5}
.rsvp-form button{justify-self:start}
.rsvp-form button:disabled{opacity:.6;cursor:wait}
.rsvp-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.rsvp-page{padding:var(--margin-page-block) var(--margin-page-inline);background:var(--color-tan-02);color:var(--color-black-02)}
.rsvp-page__inner{width:min(100%,42rem);margin:auto;display:grid;gap:var(--space-5)}
.rsvp-page__inner a,.event-registration a{color:var(--color-red-02);text-decoration:underline;text-underline-offset:.2em}
.rsvp-standalone{background:#001a4d;color:#fff5e5;font-family:'autarchist-vf',sans-serif}
.rsvp-standalone header,.rsvp-standalone footer{padding:24px}
.rsvp-standalone header a,.rsvp-standalone footer a{color:inherit}
.rsvp-standalone .rsvp-page{background:#fff5e5;color:#001a4d}
@media(width<=420px){.rsvp-form__names{grid-template-columns:1fr}}