/* Hallmark · genre: editorial · macrostructure: Long Document · design-system: design.md · designed-as-app */
:host{--space-3xs:.25rem;--space-2xs:.5rem;--space-xs:.75rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2rem;--space-xl:3rem;--space-2xl:4.5rem;--space-3xl:7rem;
 --ease-out:cubic-bezier(0.16,1,0.3,1);--dur-short:140ms;
 --rule:color-mix(in oklch,var(--text) 16%,var(--bg));--rule-strong:color-mix(in oklch,var(--text) 55%,var(--bg));
 --measure:44rem;--wide:none;--gutter:clamp(1.25rem,4vw,2.5rem);--hw:500}
*,*::before,*::after{box-sizing:border-box}
:host{overflow-x:clip}
:host{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem}
:host{margin:0;background:var(--bg);color:var(--text);font:400 1.0625rem/1.6 var(--font-b);-webkit-font-smoothing:antialiased;text-wrap:pretty}
img,video,iframe{max-width:100%;display:block}
img{height:auto}
h1,h2,h3,h4{font-family:var(--font-h);font-weight:var(--hw);font-style:normal;line-height:1.12;letter-spacing:-.02em;margin:0 0 .6em;text-wrap:balance;overflow-wrap:anywhere;min-width:0}
h1,.hero-title{font-size:clamp(2.5rem,4.5vw + 1rem,4.75rem);line-height:1.04}
h1.is-long,.hero-title.is-long{font-size:clamp(2.1rem,3vw + 1rem,3.5rem)}
h2{font-size:clamp(1.9rem,2.6vw + 1rem,3.4rem);letter-spacing:-.025em;line-height:1.06}h3{font-size:1.3rem;line-height:1.25;letter-spacing:-.01em}
p{margin:0 0 1em;max-width:var(--measure)}
a{color:var(--link,var(--primary));text-underline-offset:.2em;text-decoration-thickness:1px}
a{transition:text-decoration-thickness var(--dur-short),text-underline-offset var(--dur-short)}
a:hover{text-decoration-thickness:2px;text-underline-offset:.28em}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:.5rem;top:-4rem;background:var(--primary);color:var(--on-primary);padding:var(--space-xs) var(--space-sm);z-index:100;border-radius:var(--radius)}
.skip:focus{top:.5rem}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 var(--gutter)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.num{font-variant-numeric:tabular-nums}
/* header: broadsheet nav, one line only */
.announce{background:var(--accent);color:var(--on-accent);text-align:center;padding:var(--space-2xs) var(--gutter);font-size:.95rem;font-weight:600}
.site-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);min-height:4.5rem}
.brand{display:flex;align-items:center;gap:var(--space-xs);color:var(--text);text-decoration:none;font:var(--hw) clamp(.95rem,4.2vw,1.4rem)/1.15 var(--font-h);letter-spacing:-.02em;white-space:nowrap;flex:none}
.brand{padding:.35rem 0}.brand img{height:2.5rem;width:auto}
.brand span{background:linear-gradient(currentColor 0 0) left 100%/0 1px no-repeat;transition:background-size .45s var(--ease-out)}
@media(hover:hover){.brand:hover span{background-size:100% 1px}}.brand:focus-visible span{background-size:100% 1px}
.brand span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.nav{position:relative}
.nav-toggle{display:none;align-items:center;min-height:2.75rem;background:none;border:1px solid var(--rule-strong);color:var(--text);border-radius:var(--radius-btn);padding:0 var(--space-xs);font:600 1rem var(--font-b);cursor:pointer;white-space:nowrap;flex:none}
.nav-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:nowrap;gap:var(--space-3xs) 1.25rem;align-items:center}
html:not(.js) .nav-list{flex-wrap:wrap}
.nav-list a{display:block;padding:.5rem 0;color:var(--text);text-decoration:none;font-weight:600;font-size:.97rem;white-space:nowrap;background:linear-gradient(currentColor 0 0) left calc(100% - .15rem)/0 1px no-repeat;transition:background-size .45s var(--ease-out)}
@media(hover:hover){.nav-list a:hover{background-size:100% 1px}}
.nav-list a:focus-visible{background-size:100% 1px}
.nav-list a[aria-current=page]{background-image:linear-gradient(var(--accent) 0 0);background-size:100% 3px}
/* sections: Long Document rhythm; padding varies by block type */
.sec{--s-bg:var(--bg);--s-fg:var(--text);--s-link:var(--primary);--s-rule:var(--rule);--btn-bg:var(--primary);--btn-fg:var(--on-primary);--s-muted:color-mix(in oklch,var(--text) 72%,var(--bg));--field-bg:var(--bg);--pad:var(--space-2xl);
 background:var(--s-bg);color:var(--s-fg);padding:var(--pad) 0}
.sec--compact,.sec--stats,.sec--newsletter,.sec--embed,.sec--schedule,.sec--faq{--pad:var(--space-xl)}
.sec--features,.sec--imageText,.sec--testimonials,.sec--team,.sec--donate,.sec--gallery,.sec--cta{--pad:var(--space-3xl)}
.sec--divider,.sec--buttons{--pad:var(--space-md)}
/* adjacent sections with the same background share one gap instead of stacking both paddings */
.sec[data-bg=default]+.sec[data-bg=default],.sec[data-bg=muted]+.sec[data-bg=muted],.sec[data-bg=primary]+.sec[data-bg=primary],.sec[data-bg=dark]+.sec[data-bg=dark]{padding-top:calc(var(--pad) * .3)}
@media(max-width:700px){.sec{--pad:var(--space-xl)}.sec--features,.sec--imageText,.sec--testimonials,.sec--team,.sec--donate,.sec--gallery,.sec--cta{--pad:var(--space-2xl)}.sec--stats,.sec--newsletter,.sec--embed,.sec--schedule,.sec--faq{--pad:var(--space-lg)}.sec--divider,.sec--buttons{--pad:var(--space-sm)}}
.sec a{color:var(--s-link)}
.sec--muted{--s-bg:var(--muted)}
.sec--primary{--s-bg:var(--primary);--s-fg:var(--on-primary);--s-link:var(--on-primary);--s-rule:color-mix(in oklch,var(--on-primary) 35%,transparent);--btn-bg:var(--on-primary);--btn-fg:var(--primary);--s-muted:color-mix(in oklch,var(--on-primary) 86%,var(--primary))}
.sec--dark{--s-bg:color-mix(in oklch,var(--text) 90%,black);--s-fg:var(--bg);--s-link:var(--bg);--s-rule:color-mix(in oklch,var(--bg) 28%,transparent);--btn-bg:var(--bg);--btn-fg:color-mix(in oklch,var(--text) 90%,black);--s-muted:color-mix(in oklch,var(--bg) 78%,var(--text));--field-bg:var(--bg)}
.sec--muted .num-lead,.sec--default .num-lead{color:var(--primary)}
.sec-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--space-md);margin-bottom:var(--space-lg)}
.sec-head>*{grid-column:1/-1}
@media(min-width:900px){.sec-head>.sec-title{grid-column:1/span 8}.sec-head>.lead{grid-column:1/span 7}}
.sec-title{text-align:left;margin-bottom:var(--space-md)}
.sec-head .sec-title{margin-bottom:var(--space-sm)}
.sec-head .lead{margin-bottom:0}
.lead{font-size:1.2rem;max-width:var(--measure);margin:0 0 var(--space-md);color:var(--s-muted)}
.more{margin-top:var(--space-lg);font-weight:600;white-space:nowrap}
.empty{color:var(--s-muted)}
.prose{margin:0}.prose--narrow{max-width:var(--measure)}.prose--wide{max-width:var(--wide)}
.prose h2,.prose h3,.prose h4{margin-top:1.6em}.prose>:first-child{margin-top:0}
.sub-h{font-size:clamp(1.35rem,1.2vw + 1rem,1.75rem);margin:var(--space-xl) 0 var(--space-sm)}
.dates{list-style:none;padding:0;margin:0 0 var(--space-md);max-width:var(--measure);border-top:1px solid var(--s-rule,var(--rule))}
.dates li{padding:var(--space-xs) 0;border-bottom:1px solid var(--s-rule,var(--rule));font-variant-numeric:tabular-nums}
.prose blockquote{margin:1.5em 0;padding:.1em 0 .1em var(--space-md);border-left:3px solid var(--accent);font-size:1.15em}
.prose ul,.prose ol{padding-left:1.4em;max-width:var(--measure)}
.prose img{border-radius:var(--radius)}
/* buttons */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:0 var(--space-md);border-radius:var(--radius-btn);border:1px solid var(--btn-bg,var(--primary));background:var(--btn-bg,var(--primary));color:var(--btn-fg,var(--on-primary))!important;font:600 1rem/1.2 var(--font-b);text-decoration:none!important;cursor:pointer;white-space:nowrap;transition:color .3s var(--ease-out),scale var(--dur-short)}
/* hover: a darker fill floods up from the baseline (transform only, so it never repaints the label) */
.btn::before{content:"";position:absolute;inset:-1px;z-index:-1;background:color-mix(in oklch,var(--btn-bg,var(--primary)) 78%,black);transform:translateY(101%);transition:transform .5s var(--ease-out)}
@media(hover:hover){.btn:hover::before{transform:none}}
.btn:focus-visible::before{transform:none}
.btn:active{scale:.97}
.btn--secondary{background:transparent;color:var(--btn-bg,var(--primary))!important;border-color:currentColor}
.btn--secondary::before{background:var(--btn-bg,var(--primary))}
@media(hover:hover){.btn--secondary:hover{color:var(--btn-fg,var(--on-primary))!important;border-color:var(--btn-bg,var(--primary))}}
.btn--secondary:focus-visible{color:var(--btn-fg,var(--on-primary))!important}
.btn--small{min-height:2.75rem;padding:0 var(--space-sm);font-size:.95rem}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--space-xs);justify-content:center}
.btn-row--left{justify-content:flex-start}
/* hero */
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;background:var(--muted);color:var(--text);padding:var(--space-2xl) 0 var(--space-xl);border-bottom:1px solid var(--rule);overflow:hidden;--btn-bg:var(--primary);--btn-fg:var(--on-primary)}
@media(min-width:820px){.hero{padding:var(--space-3xl) 0 var(--space-2xl)}}
.hero a{color:inherit}
.hero-in{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.hero-in::before{content:"";width:4rem;border-top:3px solid var(--accent);margin-bottom:var(--space-md)}
.hero-title{max-width:16ch;margin-bottom:.35em}
.hero--img .hero-title{font-size:clamp(2.75rem,5.6vw + 1rem,7rem);line-height:.98;letter-spacing:-.03em}
.hero--img .hero-title.is-long{font-size:clamp(2.3rem,3.6vw + 1rem,4.75rem)}
.hero-title.is-long{max-width:22ch}
.hero-sub{font-size:clamp(1.1rem,1vw + .9rem,1.4rem);max-width:40rem;color:var(--s-muted,color-mix(in oklch,var(--text) 78%,var(--bg)))}
.hero .btn-row{justify-content:flex-start;margin-top:var(--space-sm)}
.hero--center .hero-in{align-items:center;text-align:center}
.hero--center .hero-in::before{margin-left:auto;margin-right:auto}
.hero--center .hero-title{margin-left:auto;margin-right:auto}
.hero--center .hero-sub{margin-left:auto;margin-right:auto}
.hero--center .btn-row{justify-content:center}
.hero--img{--hero-ink:var(--bg);color:var(--bg);min-height:clamp(28rem,88svh,60rem);border-bottom:0;background:color-mix(in oklch,var(--text) 90%,black);--btn-bg:var(--bg);--btn-fg:color-mix(in oklch,var(--text) 90%,black);padding-bottom:var(--space-xl)}
@media(min-width:820px){.hero--img{padding-bottom:var(--space-2xl)}}
.hero--img .hero-sub{color:color-mix(in oklch,var(--bg) 92%,transparent)}
.hero--img .hero-in::before{border-top-color:var(--bg)}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero--overlay::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in oklch,var(--text) 45%,transparent) 0%,color-mix(in oklch,var(--text) 78%,transparent) 100%);z-index:-1}
.hero--img:not(.hero--overlay) .hero-in{text-shadow:0 1px 18px color-mix(in oklch,var(--text) 70%,transparent)}
.hero--img .btn--secondary{color:var(--bg)!important}
@media(hover:hover){.hero--img .btn--secondary:hover{color:var(--btn-fg)!important}}
.hero--img .btn--secondary:focus-visible{color:var(--btn-fg)!important}
/* media */
.figure{margin:0}.figure--narrow{max-width:var(--measure)}.figure--wide{max-width:none}.figure--full{max-width:none}
.figure img,.figure video{width:100%;border-radius:var(--radius)}
figcaption{font-size:.95rem;color:var(--s-muted);margin-top:var(--space-2xs);max-width:60ch}
.gallery{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-sm);grid-template-columns:repeat(2,minmax(0,1fr))}
.gallery figure{margin:0}.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius)}
@media(min-width:720px){.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
 /* gallery wall: with 4+ photos the first hangs large, two columns by two rows */
 .gallery--wall{grid-auto-flow:dense}.gallery--wall>li:first-child{grid-column:span 2;grid-row:span 2}
 .gallery--wall>li:first-child figure{height:100%;display:flex;flex-direction:column}.gallery--wall>li:first-child img{flex:1;min-height:0;aspect-ratio:auto}}
.split-img{overflow:hidden;border-radius:var(--radius)}
.split{display:grid;gap:var(--space-lg);align-items:center;grid-template-columns:minmax(0,1fr)}
.split-img img{width:100%;border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover}
.split-txt .sec-title{margin-bottom:var(--space-sm)}
@media(min-width:900px){.split{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--space-md)}.split-img{grid-column:1/span 6;grid-row:1}.split-txt{grid-column:8/span 5;grid-row:1}.split--right .split-img{grid-column:7/span 6}.split--right .split-txt{grid-column:1/span 5}.split--text .split-txt{grid-column:1/span 8}}
.video,.map{position:relative;aspect-ratio:16/9;border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;background:var(--muted)}
.video iframe,.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.figure video{aspect-ratio:16/9;background:var(--muted);border:1px solid var(--rule)}
.map-note{max-width:var(--measure);margin-top:var(--space-sm);display:flex;flex-wrap:wrap;gap:var(--space-3xs) var(--space-md);align-items:baseline}
.map-note address{font-style:normal;font-weight:600}.map-note span{color:var(--s-muted)}
.map-note a{white-space:nowrap;background:linear-gradient(color-mix(in oklch,var(--accent) 28%,transparent) 0 0) left/0 100% no-repeat;transition:background-size .45s var(--ease-out);padding:0 .15em;margin:0 -.15em}
@media(hover:hover){.map-note a:hover{background-size:100% 100%}}.map-note a:focus-visible{background-size:100% 100%}
.embed{width:100%;height:20rem;border:1px solid var(--rule);border-radius:var(--radius);background:var(--bg)}
.placeholder{border:1px dashed var(--rule-strong);border-radius:var(--radius);padding:var(--space-lg) var(--space-sm);text-align:center;color:var(--s-muted)}
.divider hr{border:0;border-top:1px solid var(--s-rule);margin:0}.divider--sm{padding:var(--space-xs) 0}.divider--md{padding:var(--space-md) 0}.divider--lg{padding:var(--space-xl) 0}
/* features / rows: hairlines instead of boxes */
.cards{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-lg) var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
.card{position:relative;border-top:2px solid var(--s-fg);padding-top:var(--space-sm);min-width:0}
.card h3{margin-bottom:.4em}.card p{margin-bottom:.6em}.card p:last-child{margin-bottom:0}
.card-link{color:inherit!important;text-decoration:none}
.card-link::after{content:"";position:absolute;inset:0}
.card--click{cursor:pointer}
.card--click:hover{border-top-color:var(--accent)}
.card-link{background:linear-gradient(currentColor 0 0) left 92%/0 1px no-repeat;transition:background-size .45s var(--ease-out)}
.card--click:hover .card-link,.card--click:focus-within .card-link{background-size:100% 1px}
.card-more .arr{display:inline-block;transition:translate .35s var(--ease-out)}
.card--click:hover .card-more .arr,.card--click:focus-within .card-more .arr{translate:.3em 0}
.card--click:focus-within{outline:3px solid var(--accent);outline-offset:4px}
.card--click .card-link:focus-visible{outline:none}
.card-more{display:inline-block;margin-top:var(--space-2xs);font-weight:600;color:var(--s-link);white-space:nowrap}
.card-icon{display:block;font-size:1.75rem;line-height:1;margin-bottom:var(--space-xs)}
.meta{font-size:.92rem;color:var(--s-muted);margin-bottom:.4em;font-variant-numeric:tabular-nums}
/* date rows (events, news) */
.rows-title{font-size:1.3rem;margin:var(--space-xl) 0 var(--space-sm)}.rows-title:first-child{margin-top:0}
.rows{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--s-rule);max-width:var(--measure)}
.row{display:grid;grid-template-columns:6.5rem minmax(0,1fr) auto;gap:var(--space-md);padding:var(--space-md) 0;border-top:1px solid var(--s-rule);position:relative;align-items:start}
.row-date{font-variant-numeric:tabular-nums;line-height:1.15;margin:0;color:var(--s-muted);font-size:.92rem}
.row-date strong{display:block;font:var(--hw) 2.2rem/1 var(--font-h);color:var(--s-fg);letter-spacing:-.02em;margin-top:.15em}
.row-body h3,.row-body .row-h{margin-bottom:.25em}.row-body .row-h{font-size:1.3rem;line-height:1.25;letter-spacing:-.01em}.row-body p{margin-bottom:.4em}.row-body p:last-child{margin-bottom:0}
.row-body h3 a,.row-body .row-h a{color:inherit;text-decoration:none}.row-body h3 a:hover,.row-body .row-h a:hover{text-decoration:underline}
.row-aside{align-self:center}
.row-thumb{width:8rem;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius)}
.row--link h3 a::after,.row--link .row-h a::after{content:"";position:absolute;inset:0}
.row .btn{position:relative;z-index:1}
@media(max-width:620px){.row{grid-template-columns:4.5rem minmax(0,1fr);gap:var(--space-sm)}.row-aside{grid-column:2}.row-thumb{width:100%;max-width:14rem}.row-date strong{font-size:1.75rem}}
/* team */
.team{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr))}
.person{min-width:0}
.portrait{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);margin-bottom:var(--space-sm);background:var(--muted)}
.avatar--init{display:grid;place-items:center;width:100%;aspect-ratio:4/5;border-radius:var(--radius);margin-bottom:var(--space-sm);background:color-mix(in oklch,var(--s-fg) 14%,var(--s-bg));color:var(--s-fg);font:var(--hw) 3rem/1 var(--font-h);letter-spacing:-.02em}
.person h3{margin-bottom:.15em}.role{color:var(--s-muted);font-weight:600;font-size:.95rem}
.person p{margin-bottom:.4em}
/* testimonials: pull quotes */
.quotes{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-xl) var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr))}
.quote{margin:0;border-top:3px solid var(--accent);padding-top:var(--space-md)}
.quote blockquote{margin:0 0 var(--space-md);font:var(--hw) clamp(1.35rem,1vw + 1.1rem,1.85rem)/1.3 var(--font-h);letter-spacing:-.015em;text-wrap:balance}
.quotes:has(>li:only-child){max-width:var(--measure)}
.quote blockquote p{max-width:none;margin:0}
.quote figcaption{margin:0;color:var(--s-fg);font-size:.97rem}.quote figcaption strong{font-weight:600}.quote figcaption span{display:block;color:var(--s-muted)}
.sec--primary .quote,.sec--dark .quote{border-top-color:var(--s-fg)}
.cta{max-width:46rem;margin:0 auto;text-align:center}.cta-title{font-size:clamp(2rem,3vw + 1rem,3.5rem)}.cta p{margin-left:auto;margin-right:auto}
.stats{display:grid;gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));margin:0}
.stat{display:flex;flex-direction:column-reverse;border-top:1px solid var(--s-rule);padding-top:var(--space-sm);min-width:0}
.stat dd{margin:0;font:var(--hw) clamp(2.5rem,3vw + 1.2rem,4rem)/1.05 var(--font-h);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--s-fg);overflow-wrap:anywhere}
.stat dt{font-weight:600;color:var(--s-muted);font-size:.95rem;margin-top:var(--space-3xs)}
/* faq: hairline accordion */
.faq{max-width:var(--measure);border-bottom:1px solid var(--s-rule)}
details{border-top:1px solid var(--s-rule)}
summary{cursor:pointer;padding:var(--space-sm) var(--space-xl) var(--space-sm) 0;min-height:2.75rem;font-weight:600;font-size:1.08rem;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:.25rem;top:var(--space-xs);font-size:1.6rem;line-height:1.2;font-weight:400}
details[open] summary::after{content:"\2212"}
.faq-a{padding:0 0 var(--space-sm)}
/* schedule: tabular two-column list */
.schedule{max-width:var(--measure);margin:0;border-bottom:1px solid var(--s-rule)}
.sched-row{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--space-md);padding:var(--space-sm) 0;border-top:1px solid var(--s-rule)}
.sched-row dt{font-weight:600}
.sched-row dd{margin:0}
.sched-time{grid-column:2;grid-row:1;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right;font-weight:600}
.sched-note{grid-column:1/-1;color:var(--s-muted);font-size:.95rem;margin-top:var(--space-3xs)}
@media(max-width:480px){.sched-row{grid-template-columns:minmax(0,1fr)}.sched-time{grid-column:1;grid-row:auto;text-align:left}}
/* forms */
.formbox,.formbox--inline{max-width:var(--measure)}
.form{display:grid;gap:var(--space-md)}
.form>.btn{justify-self:start}
.form--row{grid-template-columns:minmax(0,1fr);align-items:end}
@media(min-width:620px){.form--row{grid-template-columns:minmax(0,1fr) auto}}
.field{display:grid;gap:var(--space-2xs);border:0;padding:0;margin:0;min-width:0}
.field label,.field>span,legend{font-weight:600;font-size:.97rem;padding:0}
.req{color:inherit}
input:not([type=radio]):not([type=checkbox]),select,textarea{width:100%;font:inherit;color:var(--text);background:var(--field-bg,var(--bg));border:1px solid var(--rule-strong);border-radius:var(--radius);padding:0 var(--space-sm);min-height:2.75rem}
textarea{padding:var(--space-xs) var(--space-sm);min-height:8rem}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:1px;border-color:var(--text)}
.check{display:flex;gap:var(--space-xs);align-items:flex-start;min-height:2.75rem;align-items:center}.check input{width:1.25rem;height:1.25rem;flex:none;accent-color:var(--primary)}
.amounts{border:0;padding:0;margin:0;display:grid;gap:var(--space-md);min-width:0}
.chips{display:flex;flex-wrap:wrap;padding:0 1px 1px 0}
.chip{flex:1 1 4.5rem;margin:0 -1px -1px 0;position:relative}
.chip input{position:absolute;opacity:0;left:50%;top:50%;width:1px;height:1px;margin:0;pointer-events:none}.chip span{cursor:pointer}
.chip span{display:flex;align-items:center;justify-content:center;min-height:2.75rem;border:1px solid var(--rule-strong);font-weight:600;font-variant-numeric:tabular-nums;background:var(--field-bg,var(--bg));color:var(--text);white-space:nowrap}
.chip:first-child span{border-radius:var(--radius) 0 0 var(--radius)}.chip:last-child span{border-radius:0 var(--radius) var(--radius) 0}
.chip input:checked+span{background:var(--primary);color:var(--on-primary);border-color:var(--primary);position:relative;z-index:1}
.chip input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px;z-index:2;position:relative}
.notice{padding:var(--space-xs) var(--space-sm);border-radius:var(--radius);font-weight:600;margin-bottom:var(--space-md);border:1px solid}
.notice--ok{background:oklch(95% .04 150);color:oklch(33% .08 150);border-color:oklch(55% .1 150)}.notice--err{background:oklch(95% .03 28);color:oklch(36% .13 28);border-color:oklch(55% .15 28)}
/* pages */
.page-head{padding:var(--space-2xl) var(--gutter) var(--space-md)}
.page-head h1{max-width:20ch}
.page-head p{color:var(--s-muted,inherit)}
.page-:host{padding-top:var(--space-md);padding-bottom:var(--space-3xl);--s-rule:var(--rule);--s-muted:color-mix(in oklch,var(--text) 72%,var(--bg));--s-fg:var(--text)}
.article{max-width:65ch}.article h1{margin-bottom:.4em}.article .cover{width:100%;border-radius:var(--radius);margin:var(--space-md) 0;aspect-ratio:16/9;object-fit:cover}
.article audio{width:100%;margin:var(--space-sm) 0}
.article .video{margin:var(--space-md) 0}.article .prose{margin-top:var(--space-md)}
.article .formbox{margin-top:var(--space-xl);padding-top:var(--space-lg);border-top:1px solid var(--rule);--field-bg:var(--bg)}
.crumb{display:inline-block;margin-bottom:var(--space-md);font-weight:600;white-space:nowrap}
.notfound{padding-top:var(--space-3xl);padding-bottom:var(--space-3xl)}.notfound>*{max-width:var(--measure)}
.notfound::before{content:"";display:block;width:4rem;border-top:3px solid var(--accent);margin-bottom:var(--space-md)}
.notfound .prose{margin-top:var(--space-md)}
/* footer: mast-headed */
.site-footer{background:var(--bg);color:var(--text);border-top:1px solid var(--rule-strong);padding:var(--space-xl) 0 var(--space-lg);font-size:.97rem;--s-muted:color-mix(in oklch,var(--text) 72%,var(--bg))}
.site-footer a{color:var(--text)}
.mast{display:grid;gap:var(--space-lg) var(--space-md);grid-template-columns:minmax(0,1fr);padding-bottom:var(--space-lg);border-bottom:1px solid var(--rule)}
.mast-name{font:var(--hw) clamp(2rem,3.2vw + 1rem,4.25rem)/1.02 var(--font-h);letter-spacing:-.02em;margin:0;overflow-wrap:break-word;min-width:0;text-wrap:balance}
.mast-tag{color:var(--s-muted);margin:var(--space-2xs) 0 0}
.mast-cols{display:grid;gap:var(--space-lg) var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));min-width:0}
.mast h2{font:600 .8125rem/1.2 var(--font-b);letter-spacing:.06em;text-transform:uppercase;color:var(--s-muted);margin:0 0 var(--space-2xs)}
.mast ul{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-3xs)}
.mast address{font-style:normal}.mast p{margin:0}
.mast ul a{display:inline-block;padding:.2rem 0}
.map:focus-within{outline:3px solid var(--accent);outline-offset:3px}.map iframe:focus{outline:3px solid var(--accent);outline-offset:-3px}
@media(min-width:900px){.mast{grid-template-columns:minmax(0,36rem) minmax(0,1fr);align-items:start}}
.foot-bottom{padding-top:var(--space-md);display:flex;justify-content:space-between;gap:var(--space-sm);flex-wrap:wrap;color:var(--s-muted);font-size:.875rem}
/* motion (renderer v2, design.md): cross-document page transitions, a hero that settles in and drifts, images that settle as they scroll in.
   Transform and clip-path only (never opacity), and nothing at all under reduced motion. */
@view-transition{navigation:auto}
.site-header{view-transition-name:site-header}
@keyframes wb-out{to{transform:translateY(-1.25rem);opacity:0}}
@keyframes wb-in{from{transform:translateY(2rem);opacity:0}}
@keyframes wb-rise{from{translate:0 1.4rem;clip-path:inset(0 0 100% 0)}to{translate:0 0;clip-path:inset(0 0 -20% 0)}}
@keyframes wb-rule{from{scale:0 1}}
@keyframes wb-drift{from{scale:1.06;translate:-1% 0}to{scale:1.12;translate:1% -1%}}
@keyframes wb-settle{from{translate:0 2.5rem}}
@keyframes wb-img{from{clip-path:inset(14% 0 0 0 round var(--radius));scale:1.06}to{clip-path:inset(0 round var(--radius));scale:1}}
@media(prefers-reduced-motion:no-preference){
 ::view-transition-old(root){animation:.3s var(--ease-out) both wb-out}
 ::view-transition-new(root){animation:.55s var(--ease-out) both wb-in}
 .hero-in>*{animation:wb-rise 1s var(--ease-out) both}.hero-in>:nth-child(2){animation-delay:.08s}.hero-in>:nth-child(3){animation-delay:.16s}
 .hero-in::before{transform-origin:left;animation:wb-rule .9s var(--ease-out) both}.hero--center .hero-in::before{transform-origin:center}
 .hero-bg{animation:wb-drift 24s ease-in-out infinite alternate}
 @supports(animation-timeline:view()){
  .sec>.wrap>*{animation:wb-settle linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
  .split-img img,.figure img,.gallery img,.portrait,.row-thumb{animation:wb-img linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
 }
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.btn:active{scale:none}}
@media print{.site-header,.site-footer,.announce{display:none}}
