/* Shared native-block sections. wn-* classes isolate these from existing pages. */
.wn-standard-page { --wn-gutter: clamp(28px, calc(10vw - 40px), 80px); padding-block: var(--space-7) var(--space-8); }
.wn-page-header { margin-bottom: var(--space-5); }
.wn-page-title { max-width: var(--measure-body); margin: 0 auto; }
.wn-page-title, .wn-section :is(h2, h3, p, a) { overflow-wrap: anywhere; }
.wn-page-content > * { margin-block: 0; }
.wn-page-content > :not(.wn-section) { width: calc(100% - 2 * var(--wn-gutter)); max-width: var(--measure-body); margin-inline: auto; }
.wn-page-content > :not(.wn-section) + :not(.wn-section) { margin-block-start: var(--space-4); }
.wn-page-content > :is(.alignwide, .alignfull):not(.wn-section) { max-width: var(--content-width); }
.wn-section { padding-block: var(--space-6); color: var(--ink-2); }
.wn-section > .site-container { margin-block: 0; }
.wn-reading { max-width: var(--measure-body); margin-inline: auto; }
.wn-section .wn-reading > * + * { margin-block-start: var(--space-4); }
.wn-section p { font-size: var(--fs-body); line-height: 1.6; }
.wn-section :is(h2, h3, p, figure) { margin-block-end: 0; }
.wn-section :is(h2, h3, p):first-child { margin-block-start: 0; }
.wn-section .eyebrow-label { font-size: var(--fs-label); }
.wn-section .wn-intro { font-family: var(--font-serif); font-style: italic; font-size: 22px; }
.wn-section a:not(.wp-element-button) { text-decoration: underline; }
.wn-section .wn-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); margin: 0; }
.wn-section .wn-columns > .wp-block-column { min-width: 0; margin: 0; }
.wn-section .wn-columns > .wp-block-column > * + * { margin-block-start: var(--space-4); }
.wn-section .wn-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.wn-card { padding: var(--space-5); background: var(--white); border: 1px solid var(--sand); border-radius: var(--radius-card); }
.wn-section .wn-card h3 { font-size: var(--fs-card-title); }
.wn-section .wn-card p { font-size: var(--fs-small); }
.wn-section .wn-image { margin: 0; }
.wn-section .wn-image img { width: 100%; height: auto; border-radius: var(--radius-card); }
.wn-section .wn-image figcaption { font-size: var(--fs-small); color: var(--ink-3); }
.wn-section--contact { background: var(--cream); }
.wn-section .wp-block-buttons { margin-top: var(--space-5); gap: var(--space-3); }
.wn-section .wp-block-button__link { min-height: 44px; border-radius: var(--radius-pill); }
/* Keep the last button group aligned across a row as staff edit card copy. */
.wn-section .wn-cards > .wn-card:has(> .wp-block-buttons:last-child) {
  display: flex;
  flex-direction: column;
}
.wn-section .wn-cards > .wn-card > .wp-block-buttons:last-child {
  margin-block-start: auto;
  padding-block-start: var(--space-4);
}
.wn-section .wn-question { border-bottom: 1px solid var(--divider); padding-block: var(--space-4); }
.wn-section .wn-question + .wn-question { margin-top: 0; }
.wn-question > summary { cursor: pointer; min-height: 44px; align-content: center; font-weight: 700; color: var(--ink); }
.wn-question > summary:hover { color: var(--navy-500); }
.wn-question > summary:focus-visible { outline: 3px solid var(--gold-500); outline-offset: 4px; }
.wn-question > :not(summary) { margin-block: var(--space-4) 0; }
@media (max-width: 900px) {
  .wn-section .wn-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .wn-standard-page { padding-block: var(--space-6); }
  .wn-section { padding-block: var(--space-5); }
  .wn-section .wn-columns { grid-template-columns: minmax(0, 1fr); }
  .wn-section .wn-intro { font-size: 20px; }
}
@media (max-width: 600px) {
  .wn-standard-page { --wn-gutter: 20px; }
}
/* Keep native editor controls usable; wp-block wrappers must not impose a second measure. */
.editor-styles-wrapper .wn-section { max-width: none; }
.editor-styles-wrapper .wn-section .wp-block { max-width: none; }
.editor-styles-wrapper .wn-section .wn-reading { max-width: var(--measure-body); }

/* Opt-in short-page composition: one section axis, with text measure inside it. */
.wn-standard-page:has(.wn-section--aligned-intro) .wn-page-header { margin-bottom: var(--space-4); }
.wn-standard-page:has(.wn-section--aligned-intro) .wn-page-title { max-width: none; margin-inline: 0; }
.wn-section--aligned-intro { padding-top: 0; }
.wn-section--aligned-intro .wn-reading { margin-inline: 0; }
.wn-action-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-5); }
.wn-action-row > .wp-block-group { max-width: var(--measure-body); }
.wn-action-row > .wp-block-group > * + * { margin-top: var(--space-3); }
.wn-section .wn-action-row > .wp-block-buttons { margin-top: 0; flex-shrink: 0; }

/* Native video callout pattern: shared public/editor styling. */
.civic-introductions { padding: 20px 22px; border: 1px solid var(--sand); border-radius: 14px; background: #fff; color: var(--navy-700); overflow-wrap: anywhere; }
.civic-introductions h2.section-label { font-size: var(--fs-section-label); line-height: 1.35; margin: 0 0 16px; color: inherit; }
.civic-introductions .heading-tick::before { flex-shrink: 0; }
.civic-introductions h3 { font-size: 20px; line-height: 1.3; margin: 14px 0 6px; color: inherit; }
.civic-introductions p { font-size: var(--fs-small); line-height: 1.6; margin: 0 0 16px; color: inherit; }
.civic-introductions a, .civic-introductions a:visited { color: inherit; }
.civic-introductions .wp-block-video, .civic-introductions .wp-block-embed, .civic-introductions .wp-block-image { margin: 16px 0; }
.civic-introductions video, .civic-introductions iframe { display: block; width: 100%; max-width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: 10px; }
.civic-introductions img { max-width: 100%; height: auto; border-radius: 10px; }
.civic-introductions .wp-block-video:empty { display: none; }
.civic-introductions > :last-child { margin-bottom: 0; }

/* Opt-in staff biography layout; native blocks own the editable content. */
.wn-bio-page { padding-block: 40px 48px; color: var(--navy-700); }
.wn-bio-back { display: block; width: fit-content; margin-bottom: 32px; font-size: 14px; font-weight: 600; }
.wn-bio-layout.wp-block-columns { gap: clamp(24px, 4vw, 40px); align-items: flex-start; margin: 0; }
.wn-bio-layout > .wp-block-column { min-width: 0; }
/* Override saved percentage widths without migrating staff-owned page blocks. */
.wn-bio-layout.wp-block-columns > .wp-block-column:first-child { flex: 0 0 280px !important; }
.wn-bio-layout.wp-block-columns > .wp-block-column:last-child { flex: 1 1 0 !important; max-width: 640px; }
.wn-bio-layout h1 { margin: 0; font-size: clamp(32px, 4vw, 44px); line-height: 1.15; overflow-wrap: anywhere; }
.wn-bio-layout .wn-bio-role { margin-block: 8px 0; font-size: 22px; line-height: 1.4; color: var(--ink-2); }
.wn-bio-portrait { margin: 0; max-width: 280px; }
.wn-bio-portrait img { display: block; width: 100%; height: auto; border-radius: 8px; }
.wn-bio-text { margin-top: 20px; max-width: 640px; overflow-wrap: anywhere; }
.wn-bio-text p { font-size: 18px; line-height: 1.65; margin-block: 0 20px; }
@media (max-width: 781px) {
  .wn-bio-page { padding-block: 28px 36px; }
  .wn-bio-layout.wp-block-columns { flex-direction: column; }
  .wn-bio-layout.wp-block-columns > .wp-block-column:first-child,
  .wn-bio-layout.wp-block-columns > .wp-block-column:last-child { flex: 0 0 auto !important; width: 100%; }
}

@media (min-width: 782px) {
  .wn-bio-layout .wn-bio-portrait { margin-top: 28px; }
}