/*
Theme Name: Būsto rūmai
Theme URI: https://bustorumai.lt/
Update URI: https://bustorumai.lt/
Author: Lietuvos būsto rūmai
Description: Individuali Lietuvos būsto rūmų tema su aiškia turinio hierarchija ir paprastu LT / EN valdymu.
Version: 2.4.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: busto-rumai
License: GPL-2.0-or-later
*/

/* Foundations: one readable scale for the whole public site. */

:root {
    --green: #205247;
    --deep: #112e28;
    --ink: #18352e;
    --muted: #4e6258;
    --line: #cbd6cc;
    --line-soft: #e3e8df;
    --paper: #fcfbf7;
    --surface: #ffffff;
    --soft: #edf2e9;
    --warm: #f1eee5;
    --gold: #a58a50;
    --font: "Source Sans 3", Arial, sans-serif;
    --body: 20px;
    --ui: 16px;
    --meta: 14px;
    --site-width: 1320px;
    --reading-width: 70ch;
    --section-space: 88px;
    --header-height: 88px;
    --adminbar-height: 0px;
    --header-offset: 0px;
    --sticky-top: 112px;
    --radius: 4px;
    --motion-fast: 160ms;
    --motion-duration: 200ms;
    --motion-ease: cubic-bezier(.2,.65,.3,1);
    --s1: 8px;
    --s2: 16px;
    --s3: 24px;
    --s4: 32px;
    --s5: 40px;
    --s6: 48px;
    --s8: 64px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 0;
    scrollbar-gutter: stable;
}

:where(main[id], main [id]) {
    scroll-margin-top: var(--sticky-top);
}

body {
    --sticky-top: calc(var(--header-height) + var(--header-offset) + 16px);
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font: 400 var(--body)/1.65 var(--font);
    -webkit-font-smoothing: antialiased;
    font-optical-sizing: auto;
}

h1,
h2,
h3,
h4,
p,
ul,
ol,
dl,
figure {
    margin-top: 0;
}

h1,
h2,
h3,
h4 {
    color: var(--ink);
    font-weight: 550;
    line-height: 1.16;
    letter-spacing: -.025em;
}

h1,
h2,
h3 {
    margin-bottom: 24px;
}

a {
    color: inherit;
    text-decoration: none;
}

a,
button {
    touch-action: manipulation;
}

a,
button,
input,
summary {
    transition: color var(--motion-fast) var(--motion-ease), background-color var(--motion-fast) var(--motion-ease), border-color var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease);
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

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

svg {
    display: block;
    flex-shrink: 0;
}

button,
a,
input,
summary {
    outline-offset: 4px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--green);
    box-shadow: 0 0 0 4px var(--paper);
}

[hidden] {
    display: none !important;
}

::selection {
    background: #dce8d7;
    color: var(--deep);
}

.container {
    width: min(var(--site-width), calc(100% - 80px));
    margin-inline: auto;
}

.screen-reader-text,
.skip-link:not(:focus) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link:focus {
    position: fixed;
    z-index: 100000;
    top: 12px;
    left: 16px;
    padding: 12px 20px;
    background: var(--surface);
    border: 2px solid var(--green);
    font-size: var(--ui);
}

.eyebrow {
    margin: 0 0 20px;
    color: var(--green);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.5;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.lead {
    max-width: 65ch;
    margin-bottom: 28px;
    color: var(--muted);
    font-size: 23px;
    line-height: 1.6;
}

/* Shared actions: comfortable targets, no decorative button variants. */

.button,
.header-action,
.wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    min-height: 48px;
    padding: 11px 22px;
    border: 1px solid transparent;
    border-radius: var(--radius);
    font-size: var(--ui);
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
}

.button svg,
.text-link svg,
.quiet-link svg,
.header-action svg,
.directory-link svg {
    width: 18px;
    height: 18px;
}

.button-green,
.wp-block-button__link {
    background: var(--green);
    color: #fff;
}

.button-green:hover,
.wp-block-button__link:hover {
    background: var(--deep);
}

.button-light {
    background: var(--surface);
    color: var(--green);
}

.button-light:hover {
    background: #e2ebdb;
}

.text-link,
.quiet-link,
.directory-link {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    min-height: 44px;
    color: var(--green);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.5;
}

.text-link,
.quiet-link {
    border-bottom: 1px solid #91ad99;
}

.text-link:hover,
.quiet-link:hover {
    color: var(--deep);
    border-color: var(--deep);
}

.inline-actions,
.page-heading-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px;
}

.text-button {
    min-height: 44px;
    padding: 8px 0;
    border: 0;
    border-bottom: 1px solid var(--green);
    background: none;
    color: var(--green);
    font-size: var(--ui);
}

/* Header and native WordPress navigation. */

.site-header {
    position: sticky;
    z-index: 1000;
    top: var(--header-offset);
    background: var(--paper);
    border-bottom: 1px solid var(--line-soft);
}

.admin-bar {
    --adminbar-height: 32px;
    --header-offset: 32px;
}

.header-inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 24px;
    min-height: var(--header-height);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    max-width: 100%;
    flex-shrink: 0;
    color: var(--green);
}

.brand > img {
    width: 66px;
    height: 48px;
    object-fit: contain;
    flex-shrink: 0;
}

.brand-name {
    font-size: 22px;
    font-weight: 650;
    line-height: 1.06;
    letter-spacing: -.025em;
    white-space: nowrap;
}

.brand-name > span {
    display: block;
}

.primary-navigation {
    justify-self: end;
    min-width: 0;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 0;
    margin: 0;
    list-style: none;
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.4;
    white-space: nowrap;
}

.nav-menu > li {
    position: relative;
}

.nav-menu a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 12px 0;
}

.nav-menu a > svg {
    width: 14px;
    height: 14px;
}

.nav-menu a:hover,
.nav-menu .current-menu-item > a {
    color: var(--green);
}

.nav-menu .current-menu-item > a {
    text-decoration: underline;
    text-underline-offset: 7px;
    text-decoration-thickness: 1px;
}

.nav-menu .sub-menu {
    position: absolute;
    z-index: 10;
    top: 100%;
    left: -24px;
    min-width: 260px;
    max-width: 390px;
    margin: 0;
    padding: 12px 24px;
    list-style: none;
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 12px 24px #112e2810;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--motion-duration) var(--motion-ease), visibility 0s linear var(--motion-duration);
}

.nav-menu .sub-menu a {
    padding: 10px 0;
    white-space: normal;
}

.nav-menu .menu-item-has-children:hover > .sub-menu,
.nav-menu .menu-item-has-children:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.header-action {
    min-height: 44px;
    padding: 9px 16px;
    border-color: var(--green);
    color: var(--green);
    white-space: nowrap;
}

.header-action:hover {
    background: var(--soft);
    border-color: var(--green);
}

.header-controls {
    display: flex;
    align-items: center;
    gap: 16px;
}

.language-switcher,
.language-switcher > ul {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}

.language-switcher a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 44px;
    padding: 8px 6px;
    color: var(--muted);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.3;
    text-transform: uppercase;
}

.language-switcher [aria-current],
.language-switcher .current-lang a {
    color: var(--green);
    text-decoration: underline;
    text-underline-offset: 6px;
}

.menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: transparent;
    color: var(--green);
}

.menu-toggle svg {
    width: 22px;
    height: 22px;
}

.menu-icon-close,
.menu-toggle[aria-expanded="true"] .menu-icon-open {
    display: none;
}

.menu-toggle[aria-expanded="true"] .menu-icon-close {
    display: block;
}

/* Homepage: a calm editorial introduction, anchored by the existing housing photo. */

.hero {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    min-height: 500px;
    margin-top: 28px;
    background: var(--warm);
}

.hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    min-width: 0;
    padding: 32px 40px 24px;
}

.hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: var(--green);
}

.hero-eyebrow::before {
    content: "";
    width: 3px;
    height: 24px;
    background: var(--gold);
    flex-shrink: 0;
}

.hero h1 {
    max-width: 680px;
    margin-bottom: 24px;
    color: var(--green);
    font-size: clamp(52px, 4.4vw, 66px);
    font-weight: 550;
    line-height: 1.045;
    letter-spacing: -.04em;
}

.hero-summary {
    max-width: 600px;
    margin-bottom: 24px;
    color: var(--ink);
    font-size: 20px;
    line-height: 1.6;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px;
}

.hero-note {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.5;
}

.status-dot {
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--green);
}

.hero-visual {
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 500px;
    background: var(--soft);
    border-left: 6px solid var(--green);
}

.hero-visual > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 58% 50%;
}

.image-marker {
    position: absolute;
    inset: auto 0 0;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 24px;
    background: var(--green);
    color: #fff;
    font-size: 15px;
    line-height: 1.4;
}

.image-marker > span:first-child {
    padding: 4px 8px;
    border: 1px solid #93b3a3;
    font-size: 13px;
    font-weight: 600;
}

.focus-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-bottom: 1px solid var(--line);
}

.focus-strip > a {
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 76px;
    padding: 20px 24px 20px 0;
    border-right: 1px solid var(--line);
}

.focus-strip > a + a {
    padding-left: 24px;
}

.focus-strip > a:last-child {
    border-right: 0;
    padding-right: 0;
}

.focus-index {
    color: var(--muted);
    font-size: var(--meta);
    font-variant-numeric: tabular-nums;
}

.focus-title {
    font-size: 20px;
    font-weight: 550;
    line-height: 1.3;
    letter-spacing: -.015em;
}

.focus-strip svg {
    width: 20px;
    height: 20px;
    margin-left: auto;
}

.focus-strip a:hover .focus-title {
    text-decoration: underline;
    text-underline-offset: 5px;
}

/* Section rhythm and the shared title/action alignment. */

.section {
    padding-block: var(--section-space);
}

.section-grid {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 64px;
    align-items: start;
}

.section-label {
    min-width: 0;
}

.section-label > .eyebrow {
    margin-bottom: 20px;
}

.section-caption {
    max-width: 220px;
    margin: 0;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.6;
}

.section-body {
    min-width: 0;
}

.section-title {
    max-width: 800px;
    margin: 0 0 24px;
    font-size: 40px;
    font-weight: 550;
    line-height: 1.16;
    letter-spacing: -.03em;
}

.section-title.small-title {
    font-size: 34px;
}

.section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 32px;
}

.section-heading .eyebrow {
    margin-bottom: 12px;
}

.section-heading .section-title {
    margin-bottom: 0;
}

.section-heading > .text-link {
    flex-shrink: 0;
}

.section-news {
    padding-top: var(--section-space);
    padding-bottom: 0;
}

/* Native Activities content: one image and three sourced rows, not another card grid. */

.section-initiatives {
    padding-top: 0;
}

.initiatives-grid {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 64px;
    align-items: start;
}

.initiatives-story,
.initiatives-list {
    min-width: 0;
}

.initiatives-story .section-title {
    max-width: 460px;
    margin-bottom: 28px;
}

.initiative-photo {
    margin: 0;
}

.initiative-photo-media {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--soft);
}

.initiative-photo-media > .lbr-optimized-picture {
    display: block;
    width: 100%;
    height: 100%;
}

.entry-content picture.lbr-optimized-picture {
    display: block;
}

.initiative-photo-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 35%;
}

.initiative-photo figcaption {
    margin: 14px 0 0;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.55;
}

.initiatives-story > .text-link {
    margin-top: 20px;
}

.initiative-row {
    padding: 24px 0;
    border-top: 1px solid var(--line);
}

.initiative-row:first-child {
    padding-top: 20px;
}

.initiative-row:last-child {
    padding-bottom: 0;
}

.initiative-date {
    margin: 0 0 12px;
    color: var(--green);
    font-size: var(--meta);
    font-weight: 600;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

.initiative-row h3 {
    margin: 0 0 12px;
    font-size: 26px;
    font-weight: 550;
    line-height: 1.3;
}

.initiative-summary {
    margin-bottom: 16px;
    color: var(--muted);
    font-size: var(--body);
    line-height: 1.65;
}

.initiative-source {
    max-width: 100%;
}

.initiative-source > span:first-child {
    min-width: 0;
    overflow-wrap: break-word;
}

.initiatives-without-image {
    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
}

/* News: image geometry and action baselines are the same on home and archive. */

.home-news-grid,
.news-archive-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 48px 32px;
}

.home-news-item,
.archive-news-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.archive-news-visual {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    margin-bottom: 24px;
    background: var(--soft);
}

.archive-news-visual > a {
    display: block;
    width: 100%;
    height: 100%;
}

.archive-news-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.archive-news-visual > img[src*="lbr-symbol.svg"] {
    padding: 32px;
    object-fit: contain;
}

.news-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 14px;
    margin-bottom: 16px;
    color: var(--muted);
    font-size: var(--meta);
    font-weight: 500;
    line-height: 1.5;
}

.news-meta time {
    color: var(--green);
    font-variant-numeric: tabular-nums;
}

.news-meta > span {
    padding-left: 14px;
    border-left: 1px solid var(--line);
}

.home-news-item h3,
.archive-news-item h2 {
    margin-bottom: 16px;
    font-size: 26px;
    font-weight: 550;
    line-height: 1.28;
    letter-spacing: -.02em;
}

.home-news-item h3 a:hover,
.archive-news-item h2 a:hover {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 5px;
}

.home-news-item > p,
.archive-news-item > p {
    margin-bottom: 24px;
    color: var(--muted);
    font-size: var(--body);
    line-height: 1.65;
}

.home-news-item .news-read,
.archive-news-item .news-read {
    margin-top: auto;
}

.archive-language-note {
    margin: 16px 0 0;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.6;
}

.news-results {
    min-width: 0;
}

/* Community: a distinct, restrained brand segment with original member marks. */

.section-community {
    background: var(--deep);
    color: #fff;
}

.community-grid {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 64px;
    align-items: center;
}

.community-story,
.member-showcase {
    min-width: 0;
}

.section-community .eyebrow {
    color: #bfd2bf;
}

.community-grid .section-title {
    max-width: 15ch;
    margin: 0 0 24px;
    color: #fff;
    font-size: 44px;
}

.community-copy .lead {
    margin-bottom: 28px;
    color: #dce5d9;
    font-size: 23px;
}

.section-community .text-link {
    color: #fff;
    border-color: #92ae97;
}

.section-community .text-link:hover {
    border-color: #fff;
}

.section-community :focus-visible {
    outline-color: #fff;
    box-shadow: 0 0 0 4px var(--deep);
}

/* Native horizontal reading order also works without JavaScript. */
.member-preview-strip {
    display: flex;
    gap: 16px;
    margin: 0;
    padding: 0 0 12px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: #78958a transparent;
}

.member-preview-strip > .member-rail-tile {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 calc((100% - 16px) / 2);
    min-width: 0;
    height: 148px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 4px;
    background: var(--surface);
    scroll-snap-align: start;
}

.member-rail-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 56px;
    margin-top: 10px;
    border-top: 1px solid #496158;
}

.member-rail-position {
    color: #c8d7cd;
    font-size: 15px;
    font-variant-numeric: tabular-nums;
    letter-spacing: .12em;
}

.member-rail-buttons {
    display: flex;
    align-items: center;
    gap: 4px;
}

.member-rail-buttons button {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 50%;
    background: transparent;
    color: #fff;
    cursor: pointer;
    transition: background-color var(--motion-fast), border-color var(--motion-fast);
}

.member-rail-buttons button:hover {
    border-color: #6b897c;
    background: #24443a;
}

.member-rail-buttons button:disabled {
    opacity: .35;
    cursor: default;
}

.member-rail-buttons button:disabled:hover {
    border-color: transparent;
    background: transparent;
}

.member-rail-buttons span {
    display: flex;
}

.member-rail-buttons svg {
    display: block;
    width: 22px;
    height: 22px;
}

@media (min-width: 761px) and (max-width: 960px) {
    .member-preview-strip > .member-rail-tile {
        flex-basis: calc((100% - 32px) / 3);
    }
}

.member-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 160px;
    height: 88px;
    flex-shrink: 0;
}

.member-logo-image {
    width: auto;
    height: auto;
    object-fit: contain;
}

.logo-wordmark .member-logo-image {
    max-width: 160px;
    max-height: 48px;
}

.logo-landscape .member-logo-image {
    max-width: 150px;
    max-height: 64px;
}

.logo-compact .member-logo-image {
    max-width: 76px;
    max-height: 76px;
}

.logo-portrait .member-logo-image {
    max-width: 60px;
    max-height: 78px;
}

.logo-on-dark .member-logo-image {
    max-width: 52px;
    max-height: 52px;
    padding: 10px;
    box-sizing: content-box;
    border-radius: var(--radius);
    background: var(--deep);
}

.member-preview-strip .member-logo {
    width: 100%;
    height: 96px;
}

.member-preview-strip .logo-wordmark .member-logo-image {
    max-width: min(100%, 200px);
    max-height: 52px;
}

.member-preview-strip .logo-landscape .member-logo-image {
    max-width: min(100%, 190px);
    max-height: 70px;
}

.member-monogram {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--soft);
    color: var(--green);
    font-size: 22px;
}

/* Documents: accessible rows for both the library and homepage highlights. */

.document-library {
    min-width: 0;
}

.document-list {
    border-top: 1px solid var(--line);
}

.document-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    min-height: 112px;
    padding: 24px 0;
    border-bottom: 1px solid var(--line);
}

.document-icon {
    position: relative;
    width: 36px;
    color: var(--green);
}

.document-icon > svg {
    width: 32px;
    height: 38px;
}

.document-icon > span {
    position: absolute;
    top: 21px;
    right: -2px;
    padding: 0 2px;
    background: var(--paper);
    color: var(--green);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.2;
}

.document-identity {
    min-width: 0;
}

.document-identity h2,
.document-identity h3 {
    margin: 0 0 8px;
    font-size: 22px;
    line-height: 1.35;
    letter-spacing: -.015em;
}

.document-identity p {
    margin: 0;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

.document-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}

.directory-link:hover > span:first-child {
    text-decoration: underline;
    text-underline-offset: 5px;
}

.download-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--green);
}

.download-link svg {
    width: 20px;
    height: 20px;
}

.download-link:hover {
    background: var(--soft);
    border-color: var(--green);
}

.notice-panel {
    padding: 28px 0;
    border-block: 1px solid var(--line);
    color: var(--muted);
}

.notice-panel p {
    margin: 0;
}

/* Inner-page entry: concise orientation before useful content. */

.page-main {
    padding: 24px 0 80px;
}

.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 12px;
    margin-bottom: 20px;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.5;
}

.breadcrumbs a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
}

.breadcrumbs a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.breadcrumbs > span[aria-hidden] {
    color: #7e9285;
}

.breadcrumbs > span[aria-current] {
    min-width: 0;
    overflow-wrap: break-word;
}

.page-heading {
    padding-bottom: 28px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--line);
}

.page-heading .eyebrow {
    margin-bottom: 10px;
}

.page-heading h1 {
    max-width: 24ch;
    margin: 0;
    font-size: 56px;
    font-weight: 550;
    line-height: 1.1;
    letter-spacing: -.035em;
}

.page-heading-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: end;
    gap: 40px;
}

.page-heading-grid > div:first-child {
    min-width: 0;
}

.page-heading-grid > .page-intro,
.page-heading-copy {
    grid-column: 2;
    min-width: 0;
    max-width: 48ch;
}

.page-intro {
    max-width: 65ch;
    margin: 0;
    color: var(--muted);
    font-size: 22px;
    line-height: 1.55;
}

.page-heading-actions {
    margin-top: 20px;
}

.prose-layout {
    display: grid;
    grid-template-columns: 220px minmax(0, var(--reading-width));
    align-items: start;
    justify-content: start;
    gap: 64px;
}

.page-outline {
    position: sticky;
    top: var(--sticky-top);
    min-width: 0;
}

.page-outline .eyebrow {
    margin-bottom: 16px;
}

.page-outline nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.page-outline a {
    display: flex;
    align-items: center;
    min-height: 40px;
    padding: 6px 0;
    color: var(--muted);
    font-size: var(--ui);
    line-height: 1.45;
}

.page-outline a:hover {
    color: var(--green);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.entry-content {
    min-width: 0;
    max-width: var(--reading-width);
    color: var(--ink);
    font-size: var(--body);
    line-height: 1.7;
}

.entry-content > :first-child {
    margin-top: 0;
}

.entry-content p {
    margin-bottom: 24px;
}

.entry-content h2 {
    margin: 44px 0 24px;
    font-size: 36px;
    line-height: 1.22;
    letter-spacing: -.025em;
}

.entry-content h3 {
    margin: 36px 0 20px;
    font-size: 29px;
    line-height: 1.28;
}

.entry-content h4 {
    margin: 32px 0 16px;
    font-size: 24px;
    line-height: 1.3;
}

.entry-content a {
    color: var(--green);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    overflow-wrap: break-word;
}

.entry-content a:hover {
    color: var(--deep);
}

.entry-content ul,
.entry-content ol {
    padding-left: 26px;
    margin-bottom: 28px;
}

.entry-content li {
    padding-left: 4px;
    margin-bottom: 12px;
}

.entry-content blockquote {
    padding-left: 28px;
    margin: 36px 0;
    border-left: 3px solid var(--gold);
    color: var(--green);
    font-size: 25px;
    line-height: 1.55;
}

.entry-content blockquote p:last-child {
    margin-bottom: 0;
}

.entry-content img {
    max-width: 100%;
    height: auto;
}

.entry-content figure {
    margin: 32px 0;
}

.entry-content figcaption {
    margin-top: 12px;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.6;
}

.entry-content table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--body);
    line-height: 1.55;
}

.entry-content .wp-block-table {
    max-width: 100%;
    overflow-x: auto;
}

.entry-content td,
.entry-content th {
    padding: 16px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.entry-content th {
    background: var(--soft);
    font-weight: 600;
}

.entry-content .wp-block-file {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    border-block: 1px solid var(--line);
    font-size: 18px;
}

.entry-content .wp-block-file__button {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 18px;
    border-radius: var(--radius);
    background: var(--green);
    color: #fff;
    font-size: var(--ui);
    text-decoration: none;
}

.entry-content .wp-block-button__link {
    color: #fff;
    text-decoration: none;
}

.entry-content .lbr-home-initiative {
    padding: 28px 0;
    border-top: 1px solid var(--line);
}

.entry-content .lbr-home-initiative h3 {
    margin-top: 0;
}

.entry-content .lbr-home-initiative h3 + p {
    color: var(--muted);
    font-size: var(--meta);
}

/* Member directory: compact continuous cards, native search and real A–Ž anchors. */

.directory-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    padding-bottom: 20px;
}

.directory-count {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--ink);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.5;
}

.directory-count > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding-inline: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--soft);
    color: var(--green);
    font-size: var(--meta);
    font-variant-numeric: tabular-nums;
}

.directory-search {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 400px;
    max-width: 48%;
    min-height: 52px;
    padding: 4px 12px 4px 16px;
    border: 1px solid #718878;
    border-radius: var(--radius);
    background: var(--surface);
}

.directory-search:focus-within {
    border-color: var(--green);
    outline: 2px solid var(--green);
    outline-offset: 2px;
}

.directory-search > svg {
    width: 20px;
    height: 20px;
    color: var(--muted);
}

.directory-search input {
    width: 100%;
    min-width: 0;
    height: 44px;
    padding: 8px 0;
    border: 0;
    outline: none;
    background: none;
    color: var(--ink);
    font-size: 18px;
}

.directory-search input:focus-visible {
    outline: none;
    box-shadow: none;
}

.directory-search input::placeholder {
    color: var(--muted);
    opacity: 1;
}

.directory-search > button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 44px;
    padding: 8px;
    flex-shrink: 0;
    border: 0;
    background: none;
    color: var(--green);
}

.directory-search > button svg {
    width: 20px;
    height: 20px;
}

.directory-index {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 12px 0;
    margin-bottom: 24px;
    border-block: 1px solid var(--line);
}

.alphabet-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px;
}

.alphabet-label {
    padding-right: 12px;
    color: var(--muted);
    font-size: var(--meta);
    font-weight: 550;
}

.alphabet-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    border-radius: var(--radius);
    color: var(--green);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.3;
}

.alphabet-nav a:hover {
    background: var(--soft);
}

.directory-result {
    margin: 0;
    flex-shrink: 0;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

.member-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.member-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 296px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.member-card:target {
    border-color: var(--green);
}

.member-card-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 104px;
    padding: 12px 20px;
    flex-shrink: 0;
    border-bottom: 1px solid var(--line-soft);
}

.member-card .member-logo {
    width: 100%;
    height: 78px;
}

.member-card-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--soft);
    color: #6c8974;
}

.member-card-placeholder svg {
    width: 24px;
    height: 24px;
}

.member-card-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 20px;
    flex: 1;
}

.member-card-identity {
    min-width: 0;
    margin-bottom: 12px;
}

.member-card-identity h2 {
    margin: 0;
    font-size: 22px;
    font-weight: 550;
    line-height: 1.3;
    letter-spacing: -.015em;
    overflow-wrap: break-word;
}

.member-card-meta {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: var(--meta);
    line-height: 1.5;
}

.member-card-footer {
    display: flex;
    align-items: center;
    min-height: 53px;
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid var(--line-soft);
}

.member-card-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 44px;
    color: var(--green);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.4;
}

.member-card-link > svg {
    width: 18px;
    height: 18px;
}

.member-card-link:hover > span:first-child {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.member-card-status {
    display: flex;
    align-items: center;
    min-height: 44px;
    color: var(--muted);
    font-size: var(--ui);
    line-height: 1.4;
}

.member-contact-links {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    max-width: 100%;
    margin-top: 12px;
}

.member-contact-links a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    max-width: 100%;
    color: var(--green);
    font-size: var(--ui);
    line-height: 1.4;
}

.member-contact-links a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.member-contact-links svg {
    width: 18px;
    height: 18px;
}

.member-card-group {
    min-width: 0;
    margin-top: 8px;
}

.member-card-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    color: var(--green);
    font-size: var(--ui);
    line-height: 1.4;
    list-style: none;
    cursor: pointer;
}

.member-card-group > summary::-webkit-details-marker {
    display: none;
}

.member-card-group > summary > svg {
    width: 16px;
    height: 16px;
}

.member-card-group[open] > summary > svg {
    transform: rotate(180deg);
}

.group-entry-count {
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.member-group-content {
    padding-top: 8px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
}

.member-group-content ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 16px;
    padding-left: 18px;
    margin: 0;
}

.member-group-content li {
    padding: 0;
    margin: 0;
}

.directory-empty {
    margin-top: 24px;
    padding: 40px;
    border: 1px solid var(--line);
    background: var(--soft);
}

.directory-empty h2 {
    margin-bottom: 16px;
    font-size: 32px;
}

.directory-empty p {
    margin-bottom: 24px;
}

.catalog-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    margin-top: 48px;
    padding: 32px;
    background: var(--soft);
}

.catalog-cta .eyebrow {
    margin-bottom: 12px;
}

.catalog-cta h2 {
    max-width: 700px;
    margin: 0;
    font-size: 34px;
}

.catalog-cta > .button {
    flex-shrink: 0;
}

.member-contacts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 32px;
    margin-top: 32px;
}

.member-contacts > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--green);
    font-size: 18px;
    overflow-wrap: anywhere;
}

/* Membership: three clear native steps beside one readable service panel. */

.membership-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    grid-template-areas: "content aside";
    gap: 64px;
    align-items: start;
}

.membership-content {
    grid-area: content;
    min-width: 0;
    counter-reset: lbr-membership-step;
}

.membership-content .lbr-membership-step {
    position: relative;
    padding: 28px 0 32px 60px;
    margin: 0;
    border-top: 1px solid var(--line);
    counter-increment: lbr-membership-step;
}

.membership-content .lbr-membership-step::before {
    content: counter(lbr-membership-step, decimal-leading-zero);
    position: absolute;
    top: 33px;
    left: 0;
    color: var(--green);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

.membership-content .lbr-membership-step > h2,
.membership-content .lbr-membership-step > .wp-block-group__inner-container > h2 {
    margin: 0 0 20px;
    font-size: 32px;
    line-height: 1.25;
}

.membership-content .lbr-membership-step p,
.membership-content .lbr-membership-step ul,
.membership-content .lbr-membership-step ol {
    font-size: var(--body);
    line-height: 1.7;
}

.membership-content .lbr-membership-step > :last-child,
.membership-content .lbr-membership-step > .wp-block-group__inner-container > :last-child {
    margin-bottom: 0;
}

.membership-content .lbr-membership-step:last-child {
    padding-bottom: 0;
}

.membership-aside {
    grid-area: aside;
    position: static;
    min-width: 0;
}

.membership-panel {
    padding: 28px;
    border: 1px solid #b5c7b2;
    background: var(--soft);
}

.membership-panel > .eyebrow {
    margin-bottom: 24px;
}

.fee-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px 0;
    border-top: 1px solid #cad6c4;
}

.fee-row > span {
    font-size: 18px;
    line-height: 1.5;
}

.fee-row > strong {
    color: var(--green);
    font-size: 42px;
    font-weight: 550;
    line-height: 1.15;
    letter-spacing: -.035em;
}

.fee-row > strong.monthly-fee {
    font-size: 38px;
}

.fee-row > strong > small {
    font-size: 19px;
    font-weight: 400;
    letter-spacing: 0;
    white-space: nowrap;
}

.fee-note {
    margin: 0 0 24px;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.6;
}

.membership-panel > .button {
    width: 100%;
    padding-inline: 14px;
}

.bank-details {
    margin-bottom: 24px;
}

.bank-details .eyebrow {
    margin-bottom: 8px;
}

.bank-details p {
    margin: 0;
    font-size: 18px;
    overflow-wrap: anywhere;
}

.membership-contact {
    padding-top: 28px;
}

.membership-contact .eyebrow {
    margin-bottom: 12px;
}

.membership-contact p:not(.eyebrow) {
    margin-bottom: 16px;
    color: var(--muted);
    font-size: 20px;
    line-height: 1.6;
}

.membership-contact .text-link {
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* Contacts: actual office information and association representatives. */

.contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 64px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--line);
}

.contact-primary,
.contact-office {
    min-width: 0;
}

.contact-section-title {
    margin: 0 0 24px;
    font-size: 28px;
    font-weight: 550;
    line-height: 1.25;
}

.contact-email {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    max-width: 100%;
    min-height: 52px;
    padding-bottom: 10px;
    border-bottom: 1px solid #9db59e;
    color: var(--green);
    font-size: clamp(28px, 2.7vw, 38px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.025em;
}

.contact-email svg {
    width: 24px;
    height: 24px;
}

.contact-phone {
    display: block;
    width: fit-content;
    min-height: 44px;
    margin-top: 20px;
    color: var(--green);
    font-size: 28px;
    line-height: 1.5;
}

.contact-details {
    padding: 0;
    margin: 0;
}

.contact-details > div {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}

.contact-details > div:last-child {
    margin-bottom: 0;
}

.contact-details dt {
    padding-top: 3px;
    color: var(--muted);
    font-size: 16px;
    font-weight: 550;
    line-height: 1.5;
}

.contact-details dd {
    min-width: 0;
    margin: 0;
    font-size: var(--body);
    line-height: 1.65;
    overflow-wrap: break-word;
}

.contact-people {
    padding-top: 48px;
}

.contact-people .section-heading {
    margin-bottom: 24px;
}

.contact-people .section-title {
    font-size: 36px;
}

.person-row {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 32px;
    padding: 28px 0;
    border-top: 1px solid var(--line);
}

.person-row > .eyebrow {
    padding-top: 7px;
    margin: 0;
}

.person-row h3 {
    margin: 0;
    font-size: 27px;
    line-height: 1.3;
}

.person-row > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
}

.person-row > div a {
    display: flex;
    align-items: center;
    min-height: 40px;
    max-width: 100%;
    color: var(--green);
    font-size: 18px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.person-row.contact-person-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.person-row.contact-person-row > .contact-person-identity {
    grid-column: 1;
    grid-row: 1;
}

.person-row.contact-person-row > .contact-person-links {
    grid-column: 2;
    grid-row: 1;
}

.contact-person-identity > .eyebrow {
    margin: 0 0 8px;
}

.contact-person-name {
    margin: 8px 0 0;
    color: var(--muted);
}

@media (max-width: 760px), (max-width: 1120px) and (max-height: 500px) {
    .person-row.contact-person-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .person-row.contact-person-row > .contact-person-identity,
    .person-row.contact-person-row > .contact-person-links {
        grid-column: 1;
        grid-row: auto;
    }
}

.contact-membership {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    margin-top: 40px;
    padding: 32px;
    background: var(--soft);
}

.contact-membership p {
    max-width: 680px;
    margin: 0;
    font-size: 26px;
    line-height: 1.4;
}

.contact-membership > .text-link {
    flex-shrink: 0;
}

/* Article reading column and archive search. */

.article-layout {
    max-width: 1120px;
    margin-inline: auto;
}

.article-heading {
    max-width: 1050px;
    margin-inline: auto;
}

.article-heading .news-meta {
    margin-bottom: 20px;
}

.article-heading h1 {
    margin-bottom: 24px;
    font-size: 52px;
    line-height: 1.12;
    letter-spacing: -.03em;
}

.article-lead {
    max-width: 65ch;
    margin: 0;
    color: var(--muted);
    font-size: 24px;
    line-height: 1.6;
}

.article-image {
    margin: 32px 0 44px;
}

.article-image img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.article-reading {
    min-width: 0;
    max-width: var(--reading-width);
    margin-inline: auto;
}

.article-reading .article-content {
    max-width: 100%;
}

.article-end {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px 24px;
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid var(--line);
}

.article-end .text-link {
    max-width: 100%;
}

.archive-toolbar {
    margin-bottom: 36px;
}

.search-form {
    width: 100%;
    max-width: 620px;
    margin: 0;
}

.search-form-label {
    display: block;
    margin-bottom: 12px;
    color: var(--ink);
    font-size: var(--ui);
    font-weight: 550;
    line-height: 1.5;
}

.search-controls {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.search-form input {
    width: 100%;
    min-width: 0;
    min-height: 50px;
    padding: 10px 16px;
    border: 1px solid #718878;
    border-radius: var(--radius) 0 0 var(--radius);
    background: var(--surface);
    color: var(--ink);
    font-size: 18px;
}

.search-form input::placeholder {
    color: var(--muted);
    opacity: 1;
}

.search-form button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 10px 24px;
    border: 1px solid var(--green);
    border-radius: 0 var(--radius) var(--radius) 0;
    background: var(--green);
    color: #fff;
    font-size: var(--ui);
    font-weight: 550;
}

.search-form button:hover {
    background: var(--deep);
}

.pagination {
    margin-top: 48px;
}

.nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--green);
    font-size: var(--ui);
    line-height: 1.4;
}

.page-numbers.current {
    border-color: var(--green);
    background: var(--green);
    color: #fff;
}

a.page-numbers:hover {
    background: var(--soft);
    border-color: var(--green);
}

.page-numbers.dots {
    padding-inline: 4px;
    border: 0;
}

.empty-state {
    padding: 64px 0;
}

.empty-state h1 {
    font-size: 56px;
}

.empty-state h2 {
    font-size: 36px;
}

/* Footer is a readable continuation of the association identity. */

.site-footer {
    padding-top: 56px;
    background: var(--deep);
    color: #fff;
}

.footer-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(180px, .65fr);
    gap: 56px;
    padding-bottom: 48px;
}

.brand-light {
    color: #fff;
}

.brand-light > img {
    filter: brightness(0) invert(1);
}

.footer-brand-column {
    min-width: 0;
}

.footer-brand-column > p {
    max-width: 34ch;
    margin: 24px 0 0;
    color: #d4e1d4;
    font-size: 20px;
    line-height: 1.6;
}

.site-footer .eyebrow {
    margin-bottom: 16px;
    color: #b8d0ba;
}

.footer-contact-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 0;
}

.footer-contact-column > a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    max-width: 100%;
    font-size: 20px;
    overflow-wrap: anywhere;
}

.footer-contact-column > .footer-email {
    font-size: 30px;
    line-height: 1.3;
    letter-spacing: -.02em;
}

.footer-contact-column > p {
    margin: 12px 0 0;
    color: #d4e1d4;
    font-size: 18px;
    line-height: 1.6;
}

.footer-navigation {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
}

.footer-navigation > a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    font-size: 18px;
    line-height: 1.4;
}

.footer-navigation svg {
    width: 18px;
    height: 18px;
}

.site-footer a:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
}

.site-footer :focus-visible {
    outline-color: #fff;
    box-shadow: 0 0 0 4px var(--deep);
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 32px;
    padding: 24px 0;
    border-top: 1px solid #456359;
    color: #d4e1d4;
    font-size: var(--meta);
    line-height: 1.6;
}

@media (min-width: 961px) and (min-height: 900px) {
    .membership-aside {
        position: sticky;
        top: var(--sticky-top);
    }
}

/* Laptop and tablet: preserve reading sizes; adapt the composition instead. */

@media (max-width: 1240px) {
    .header-inner {
        gap: 20px;
    }

    .nav-menu {
        gap: 20px;
    }

    .brand {
        gap: 10px;
    }

    .brand > img {
        width: 60px;
        height: 44px;
    }

    .brand-name {
        font-size: 21px;
    }

    .hero-copy {
        padding-inline: 32px;
    }

    .section-grid {
        gap: 48px;
    }

    .initiatives-grid,
    .community-grid {
        gap: 48px;
    }

    .membership-layout {
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: 48px;
    }

    .contact-grid {
        gap: 48px;
    }

    .document-row {
        gap: 20px;
    }

    .footer-main {
        gap: 40px;
    }
}

@media (max-width: 1120px) {
    :root {
        --section-space: 72px;
    }

    .container {
        width: calc(100% - 64px);
    }

    .header-inner {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .header-action {
        justify-self: end;
    }

    .header-controls {
        gap: 12px;
    }

    .hero {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    }

    .hero h1 {
        font-size: 52px;
    }

    .hero-copy {
        padding-inline: 28px;
    }

    .hero-visual {
        min-height: 500px;
    }

    .section-grid {
        grid-template-columns: 200px minmax(0, 1fr);
        gap: 40px;
    }

    .initiatives-grid {
        gap: 40px;
    }

    .section-title {
        font-size: 38px;
    }

    .prose-layout {
        grid-template-columns: 200px minmax(0, 1fr);
        gap: 40px;
    }

    .member-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .directory-index {
        align-items: flex-start;
    }

    .directory-result {
        padding-top: 9px;
    }

    .document-row {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .document-actions {
        grid-column: 2;
        justify-content: flex-start;
        margin-top: -8px;
    }

    .contact-details > div {
        grid-template-columns: 110px minmax(0, 1fr);
        gap: 16px;
    }

    .person-row {
        grid-template-columns: 140px minmax(0, 1fr) minmax(0, 1fr);
        gap: 24px;
    }

    .footer-main {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 40px 48px;
    }

    .footer-navigation {
        grid-column: 1 / -1;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px 28px;
    }

    .footer-navigation > .eyebrow {
        margin: 0 12px 0 0;
    }
}

@media (max-width: 960px) {
    .hero {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .hero-copy {
        padding-inline: 24px;
    }

    .hero h1 {
        font-size: 46px;
    }

    .hero-visual {
        min-height: 520px;
    }

    .hero-actions {
        gap: 12px 20px;
    }

    .focus-strip > a {
        gap: 12px;
        padding-right: 16px;
    }

    .focus-strip > a + a {
        padding-left: 16px;
    }

    .focus-title {
        font-size: 18px;
    }

    .section-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .section-caption {
        max-width: 50ch;
    }

    .section-label > .eyebrow {
        margin-bottom: 12px;
    }

    .initiatives-grid,
    .initiatives-without-image {
        grid-template-columns: minmax(0, 1fr);
        gap: 36px;
    }

    .initiatives-story .section-title {
        max-width: 700px;
    }

    .initiative-photo {
        max-width: 700px;
    }

    .community-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .community-grid .section-title {
        max-width: 700px;
    }

    .community-copy .lead {
        max-width: 65ch;
    }

    .home-news-grid,
    .news-archive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-news-grid > :last-child {
        grid-column: 1 / -1;
        max-width: calc((100% - 32px) / 2);
    }

    .prose-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .page-outline {
        position: static;
        padding-bottom: 24px;
        border-bottom: 1px solid var(--line);
    }

    .page-outline nav {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 4px 24px;
    }

    .page-outline .eyebrow {
        margin-bottom: 12px;
    }

    .membership-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 32px;
    }

    .membership-panel {
        padding: 24px;
    }

    .membership-content .lbr-membership-step {
        padding-left: 44px;
    }

    .contact-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .contact-details > div {
        grid-template-columns: 160px minmax(0, 1fr);
    }

    .person-row {
        grid-template-columns: 140px minmax(0, 1fr);
    }

    .person-row > div {
        grid-column: 2;
    }

    .article-heading h1 {
        font-size: 48px;
    }
}

/* Mobile: full-width reading, genuine touch targets and natural native-block flow. */

/* Shared mobile contracts leave desktop data and reading composition intact. */

.home-mobile-shortcuts,
.home-mobile-label,
.contact-mobile-actions,
.membership-mobile-actions,
.article-skip-link,
.navigation-panel-heading,
.navigation-panel-footer,
.navigation-backdrop,
.nav-submenu-toggle {
    display: none;
}

.navigation-panel {
    display: contents;
}

.page-outline-details > summary {
    display: none;
}

.mobile-action-end {
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.button-outline {
    border-color: var(--green);
    background: transparent;
    color: var(--green);
}

.button-outline:hover {
    background: var(--soft);
}

/* One keyboard-accessible sheet, not a second navigation tree. */

@media (max-width: 1120px) {
    .header-inner > .brand {
        grid-column: 1;
        grid-row: 1;
    }

    .header-inner > .header-action {
        grid-column: 2;
        grid-row: 1;
    }

    .header-inner > .header-controls {
        grid-column: 3;
        grid-row: 1;
    }

    .navigation-panel {
        display: block;
        grid-column: 1 / -1;
        grid-row: 2;
        padding: 8px 0 20px;
    }

    /* Reserve the enhanced header before the footer controller runs. Without JS, links stay in flow. */
    .lbr-js:not(.navigation-ready) .navigation-panel {
        display: none;
    }

    .primary-navigation {
        position: static;
        display: block;
        width: 100%;
        padding: 0;
        border: 0;
        max-height: none;
        min-height: 0;
    }

    .nav-menu {
        display: block;
        font-size: 18px;
        white-space: normal;
    }

    .nav-menu > li + li {
        border-top: 1px solid var(--line-soft);
    }

    .nav-menu a {
        min-height: 48px;
        padding: 12px 0;
        font-size: 18px;
    }

    .nav-menu > li > a > svg {
        display: none;
    }

    .nav-menu .sub-menu {
        position: static;
        min-width: 0;
        max-width: none;
        padding: 0 0 12px 20px;
        margin: 0;
        border: 0;
        background: none;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
    }

    .nav-menu .sub-menu a {
        min-height: 48px;
        font-size: 18px;
        color: var(--muted);
    }

    .lbr-js .menu-toggle,
    .navigation-ready .menu-toggle {
        display: inline-flex;
    }

    .lbr-js:not(.navigation-ready) .menu-toggle {
        visibility: hidden;
    }

    .navigation-ready .navigation-backdrop {
        position: fixed;
        z-index: 1001;
        inset: 0;
        display: block;
        width: 100%;
        height: 100dvh;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: #112e286b;
        cursor: default;
    }

    .navigation-ready .navigation-panel {
        position: fixed;
        z-index: 1002;
        inset: auto 0 0;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr) auto;
        width: min(100%, 600px);
        max-height: calc(100dvh - var(--adminbar-height) - max(12px, env(safe-area-inset-top, 0px)));
        margin-inline: auto;
        padding: 0 max(20px, env(safe-area-inset-right, 0px)) calc(16px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px));
        overflow: hidden;
        border: 1px solid var(--line);
        border-bottom: 0;
        border-radius: 12px 12px 0 0;
        background: var(--paper);
    }

    .navigation-ready .navigation-panel-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        min-height: 72px;
        padding: 12px 0;
        border-bottom: 1px solid var(--line);
        color: var(--ink);
        font-size: 20px;
        font-weight: 600;
    }

    .navigation-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        padding: 12px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: transparent;
        color: var(--green);
    }

    .navigation-close svg {
        width: 22px;
        height: 22px;
    }

    .navigation-ready .primary-navigation {
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .navigation-ready .navigation-panel-footer {
        display: block;
        padding-top: 16px;
        border-top: 1px solid var(--line);
    }

    .navigation-panel-footer .button {
        width: 100%;
        min-height: 48px;
    }

    .navigation-ready .nav-menu > .menu-item-has-children {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 48px;
        align-items: start;
    }

    .navigation-ready .nav-menu > .menu-item-has-children > a {
        grid-column: 1;
        grid-row: 1;
    }

    .navigation-ready .nav-submenu-toggle {
        display: inline-flex;
        grid-column: 2;
        grid-row: 1;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        padding: 14px;
        border: 0;
        background: transparent;
        color: var(--green);
    }

    .nav-submenu-toggle svg {
        width: 18px;
        height: 18px;
    }

    .submenu-is-open > .nav-submenu-toggle svg {
        transform: rotate(180deg);
    }

    .navigation-ready .nav-menu .sub-menu {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    body.menu-is-open {
        overscroll-behavior: none;
    }
}

@media (max-width: 960px) {
    .page-outline {
        padding-bottom: 0;
        border: 0;
    }

    .page-outline-details {
        border-block: 1px solid var(--line);
    }

    .page-outline-details > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        min-height: 48px;
        padding: 10px 0;
        color: var(--green);
        font-size: 16px;
        font-weight: 550;
        line-height: 1.5;
        list-style: none;
        cursor: pointer;
    }

    .page-outline-details > summary::-webkit-details-marker {
        display: none;
    }

    .page-outline-details > summary > svg {
        width: 18px;
        height: 18px;
    }

    .page-outline-details[open] > summary > svg {
        transform: rotate(180deg);
    }

    .page-outline-details .eyebrow {
        display: none;
    }

    .page-outline-details nav {
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 0;
        padding: 0 0 12px;
    }

    .page-outline-details nav a {
        min-height: 44px;
        padding: 8px 0;
    }
}

/* Phones and phone landscape use tasks and compact rows, never smaller reading text. */

@media (max-width: 760px) {
    :root {
        --body: 19px;
        --section-space: 40px;
        --header-height: 72px;
    }

    .container {
        width: auto;
        max-width: none;
        margin-left: max(20px, env(safe-area-inset-left, 0px));
        margin-right: max(20px, env(safe-area-inset-right, 0px));
    }

    .header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 12px;
    }

    .header-inner > .header-controls {
        grid-column: 2;
    }

    .brand {
        gap: 8px;
    }

    .brand > img {
        width: 44px;
        height: 34px;
    }

    .brand-name {
        min-width: 0;
        font-size: 18px;
        white-space: normal;
    }

    .header-action {
        display: none;
    }

    .header-controls {
        justify-self: end;
        gap: 4px;
    }

    .language-switcher a {
        min-width: 36px;
        min-height: 44px;
        padding-inline: 4px;
        font-size: 16px;
    }

    .menu-toggle {
        width: 44px;
        height: 44px;
    }

    .eyebrow {
        font-size: 12px;
        letter-spacing: .08em;
    }

    .button {
        min-height: 48px;
        gap: 12px;
        padding: 10px 16px;
    }

    .hero {
        display: flex;
        flex-direction: column;
        min-height: 0;
        margin-top: 12px;
    }

    .hero-copy {
        gap: 16px;
        padding: 20px;
    }

    .hero-eyebrow {
        gap: 10px;
        margin-bottom: 16px;
        font-size: 12px;
        letter-spacing: .035em;
    }

    .hero-eyebrow::before {
        height: 20px;
    }

    .hero h1 {
        margin-bottom: 16px;
        font-size: 38px;
        line-height: 1.055;
    }

    .hero-summary {
        max-width: none;
        margin-bottom: 16px;
        font-size: 19px;
        line-height: 1.6;
    }

    .hero-actions {
        gap: 8px 16px;
    }

    .hero-actions .button {
        padding-inline: 14px;
    }

    .hero-note {
        font-size: 14px;
        line-height: 1.5;
    }

    .hero-visual {
        min-height: 0;
        height: 170px;
        border-left: 0;
        border-top: 4px solid var(--green);
    }

    .hero-visual > img {
        object-position: 58% 54%;
    }

    .image-marker {
        gap: 10px;
        padding: 10px 16px;
        font-size: 14px;
    }

    .image-marker > span:first-child {
        padding: 2px 6px;
        font-size: 12px;
    }

    .focus-strip {
        display: none;
    }

    .home-mobile-shortcuts {
        display: flex;
        gap: 8px;
        margin-top: 16px;
    }

    .home-mobile-shortcuts a {
        display: flex;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
        min-height: 48px;
        padding: 8px 6px;
        border: 1px solid #a6b8a7;
        border-radius: var(--radius);
        color: var(--green);
        font-size: 16px;
        font-weight: 550;
        line-height: 1.4;
    }

    .home-mobile-shortcuts a:hover {
        background: var(--soft);
    }

    .home-desktop-label {
        display: none;
    }

    .home-mobile-label {
        display: inline;
    }

    .section .section-title,
    .section-title.small-title {
        font-size: 30px;
        line-height: 1.2;
    }

    .section-grid {
        gap: 20px;
    }

    .section-label {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px 16px;
    }

    .section-label > .eyebrow {
        margin: 0;
    }

    .section-caption {
        max-width: none;
        font-size: 16px;
        line-height: 1.5;
    }

    .lead {
        margin-bottom: 20px;
        font-size: 21px;
        line-height: 1.6;
    }

    .section-about .lead,
    .community-copy .lead {
        font-size: 19px;
        line-height: 1.65;
    }

    .section-heading {
        align-items: flex-start;
        gap: 16px;
        margin-bottom: 24px;
    }

    .section-heading .eyebrow {
        margin-bottom: 10px;
    }

    .section-news {
        padding-top: 28px;
    }

    .section-news .section-heading {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 12px;
    }

    .section-news .section-heading > div {
        min-width: 0;
    }

    .section-news .section-heading .eyebrow {
        display: none;
    }

    .section-news .section-title {
        font-size: 28px;
    }

    .home-all-news {
        gap: 8px;
    }

    .home-news-grid {
        display: block;
    }

    .home-news-grid > :last-child {
        max-width: none;
    }

    .home-news-item {
        position: relative;
        display: grid;
        grid-template-columns: 108px minmax(0, 1fr);
        gap: 8px 16px;
        align-items: start;
        padding: 20px 0;
        border-top: 1px solid var(--line);
    }

    .home-news-item .archive-news-visual {
        grid-column: 1;
        grid-row: 1 / span 2;
        width: 108px;
        margin: 0;
        aspect-ratio: 16 / 9;
    }

    .home-news-item .news-meta {
        grid-column: 2;
        grid-row: 1;
        margin: 0;
        font-size: 14px;
        line-height: 1.5;
    }

    .home-news-item .news-meta > span {
        display: none;
    }

    .home-news-item h3 {
        grid-column: 2;
        grid-row: 2;
        margin: 0;
        font-size: 22px;
        line-height: 1.28;
    }

    .home-news-item > p,
    .home-news-item .news-read {
        display: none;
    }

    .home-news-item h3 a::after {
        content: "";
        position: absolute;
        inset: 0;
    }

    .home-news-item h3 a:focus-visible {
        outline: 0;
        box-shadow: none;
    }

    .home-news-item h3 a:focus-visible::after {
        outline: 2px solid var(--green);
        outline-offset: 3px;
    }

    .initiatives-grid,
    .initiatives-without-image {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .initiatives-story .section-title {
        margin-bottom: 20px;
    }

    .initiative-photo {
        max-width: none;
    }

    .initiative-photo figcaption {
        margin-top: 10px;
        font-size: 14px;
    }

    .initiatives-story > .text-link {
        margin-top: 12px;
    }

    .initiative-row,
    .initiative-row:first-child {
        padding: 20px 0;
    }

    .initiative-row:last-child {
        padding-bottom: 0;
    }

    .initiative-row h3 {
        font-size: 24px;
        line-height: 1.28;
        margin-bottom: 10px;
    }

    .initiative-date {
        font-size: 14px;
        margin-bottom: 8px;
    }

    .initiative-summary {
        font-size: 19px;
        line-height: 1.6;
        margin-bottom: 12px;
    }

    .community-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .community-grid .section-title {
        font-size: 32px;
    }

    .community-copy .lead {
        margin-bottom: 20px;
    }

    .inline-actions {
        gap: 12px 20px;
    }

    .community-grid {
        gap: 32px;
    }

    .community-grid .section-title {
        margin-bottom: 20px;
    }

    .member-preview-strip {
        gap: 12px;
        padding-bottom: 10px;
    }

    .member-preview-strip > .member-rail-tile {
        flex-basis: clamp(168px, 60%, 260px);
        height: 112px;
        padding: 18px;
    }

    .member-preview-strip .member-logo {
        height: 74px;
    }

    .member-preview-strip .logo-wordmark .member-logo-image {
        max-width: 100%;
        max-height: 42px;
    }

    .member-preview-strip .logo-landscape .member-logo-image {
        max-width: 100%;
        max-height: 60px;
    }

    .member-preview-strip .logo-compact .member-logo-image {
        max-width: 66px;
        max-height: 66px;
    }

    .member-preview-strip .logo-portrait .member-logo-image {
        max-width: 54px;
        max-height: 68px;
    }

    .member-rail-controls {
        margin-top: 4px;
    }

    .section-documents .section-label {
        display: block;
    }

    .section-documents .section-label > .eyebrow {
        margin-bottom: 12px;
    }

    .section-documents .small-title {
        margin-bottom: 16px;
    }

    .document-row {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 10px 14px;
        min-height: 0;
        padding: 20px 0;
    }

    .document-icon {
        width: 28px;
        align-self: start;
    }

    .document-icon > svg {
        width: 26px;
        height: 32px;
    }

    .document-icon > span {
        top: 17px;
        right: -2px;
        font-size: 12px;
    }

    .document-identity h2,
    .document-identity h3 {
        font-size: 20px;
    }

    .document-identity p {
        font-size: 14px;
    }

    .document-actions {
        margin: 0;
        gap: 12px;
    }

    .directory-link {
        gap: 10px;
    }

    .page-main {
        padding: 16px 0 40px;
    }

    .breadcrumbs {
        margin-bottom: 16px;
        gap: 4px 10px;
        font-size: 14px;
    }

    .page-heading {
        padding-bottom: 20px;
        margin-bottom: 24px;
    }

    .page-heading-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }

    .page-heading-grid > .page-intro,
    .page-heading-copy {
        grid-column: 1;
        max-width: none;
    }

    .page-heading .eyebrow {
        margin-bottom: 8px;
    }

    .page-heading h1 {
        font-size: 38px;
        line-height: 1.1;
    }

    .page-intro {
        font-size: 19px;
        line-height: 1.6;
    }

    .page-heading-actions {
        margin-top: 16px;
        gap: 8px 16px;
    }

    .prose-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .entry-content {
        font-size: 19px;
        line-height: 1.7;
    }

    .entry-content h2 {
        margin-top: 32px;
        font-size: 30px;
    }

    .entry-content h3 {
        margin-top: 28px;
        font-size: 26px;
    }

    .entry-content h4 {
        font-size: 23px;
    }

    .entry-content p {
        margin-bottom: 20px;
    }

    .entry-content blockquote {
        padding-left: 20px;
        font-size: 23px;
    }

    .entry-content ul,
    .entry-content ol {
        padding-left: 24px;
    }

    .entry-content td,
    .entry-content th {
        padding: 12px;
    }

    .entry-content table {
        font-size: 18px;
    }

    .entry-content .wp-block-file {
        font-size: 18px;
    }

    .directory {
        --directory-controls-height: 112px;
    }

    .directory-controls {
        position: sticky;
        z-index: 30;
        top: calc(var(--header-height) + var(--header-offset));
        padding: 6px 0 4px;
        border-bottom: 1px solid var(--line);
        background: var(--paper);
    }

    .directory-toolbar {
        display: block;
        padding: 0;
    }

    .directory-count {
        display: none;
    }

    .directory-search {
        width: 100%;
        max-width: none;
        height: 48px;
        min-height: 48px;
        padding: 3px 8px 3px 12px;
    }

    .directory-search input {
        height: 40px;
        padding: 0;
        font-size: 18px;
        line-height: 1.4;
    }

    .directory-search > button {
        height: 40px;
    }

    .directory-index {
        display: block;
        padding: 0;
        margin: 6px 0 0;
        border: 0;
    }

    .alphabet-nav {
        flex-wrap: nowrap;
        align-items: flex-start;
        width: 100%;
        height: 48px;
        gap: 0;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
        scrollbar-color: #809b87 transparent;
    }

    .alphabet-nav::-webkit-scrollbar {
        height: 4px;
    }

    .alphabet-nav::-webkit-scrollbar-thumb {
        border-radius: 2px;
        background: #809b87;
    }

    .alphabet-nav a {
        flex: 0 0 44px;
        min-width: 44px;
        min-height: 44px;
        height: 44px;
    }

    .alphabet-label {
        display: none;
    }

    .directory-result {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    .member-card-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .member-card {
        display: grid;
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 16px;
        align-items: start;
        min-height: 128px;
        padding: 12px 0;
        border: 0;
        border-bottom: 1px solid var(--line);
        border-radius: 0;
        background: transparent;
        scroll-margin-top: calc(var(--header-height) + var(--header-offset) + var(--directory-controls-height) + 12px);
    }

    .member-card-visual {
        grid-column: 1;
        grid-row: 1;
        height: 72px;
        padding: 0;
        border: 0;
    }

    .member-card .member-logo {
        width: 72px;
        height: 68px;
    }

    .member-card .logo-wordmark .member-logo-image {
        max-width: 72px;
        max-height: 32px;
    }

    .member-card .logo-landscape .member-logo-image {
        max-width: 72px;
        max-height: 44px;
    }

    .member-card .logo-compact .member-logo-image {
        max-width: 54px;
        max-height: 54px;
    }

    .member-card .logo-portrait .member-logo-image {
        max-width: 42px;
        max-height: 64px;
    }

    .member-card .logo-on-dark .member-logo-image {
        max-width: 36px;
        max-height: 36px;
        padding: 8px;
    }

    .member-card-placeholder {
        width: 44px;
        height: 44px;
    }

    .member-card-content {
        grid-column: 2;
        grid-row: 1;
        padding: 0;
    }

    .member-card-identity {
        margin: 0;
    }

    .member-card-identity h2 {
        font-size: 20px;
        line-height: 1.3;
    }

    .member-card-footer {
        min-height: 44px;
        padding: 0;
        margin-top: 4px;
        border: 0;
    }

    .member-card-link,
    .member-card-status {
        min-height: 44px;
        font-size: 16px;
    }

    .member-card-link {
        gap: 10px;
    }

    .member-card-group {
        margin-top: 4px;
    }

    .member-card-group > summary {
        min-height: 44px;
    }

    .member-group-content {
        font-size: 16px;
    }

    .member-group-content ul {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .directory-empty {
        padding: 24px 20px;
    }

    .directory-empty h2 {
        font-size: 29px;
    }

    .catalog-cta {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 24px 20px;
        margin-top: 28px;
    }

    .catalog-cta h2 {
        font-size: 28px;
    }

    .membership-page .page-heading-actions {
        display: none;
    }

    .membership-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "aside" "content";
        gap: 32px;
    }

    .membership-aside {
        position: static;
    }

    .membership-panel {
        padding: 20px;
    }

    .membership-panel > .eyebrow {
        margin-bottom: 16px;
    }

    .membership-fees-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 16px;
    }

    .fee-row {
        gap: 8px;
        padding: 12px 0;
    }

    .fee-row > span {
        font-size: 16px;
    }

    .fee-row > strong {
        font-size: 32px;
    }

    .fee-row > strong.monthly-fee {
        font-size: 28px;
    }

    .fee-row > strong > small {
        display: block;
        margin-top: 4px;
        font-size: 16px;
    }

    .fee-note {
        margin-bottom: 16px;
        font-size: 16px;
        line-height: 1.5;
    }

    .membership-panel > .button {
        padding-inline: 12px;
    }

    .membership-contact {
        padding-top: 20px;
    }

    .membership-contact .eyebrow {
        margin-bottom: 8px;
    }

    .membership-contact p:not(.eyebrow) {
        display: none;
        margin-bottom: 12px;
        font-size: 19px;
        line-height: 1.6;
    }

    .membership-content .lbr-membership-step {
        padding: 20px 0 24px;
    }

    .membership-content .lbr-membership-step::before {
        position: static;
        display: block;
        margin-bottom: 10px;
        font-size: 16px;
    }

    .membership-content .lbr-membership-step > h2,
    .membership-content .lbr-membership-step > .wp-block-group__inner-container > h2 {
        font-size: 28px;
        margin-bottom: 16px;
    }

    .membership-mobile-actions {
        position: fixed;
        z-index: 700;
        inset: auto 0 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 48px;
        align-items: center;
        gap: 12px;
        padding: 10px max(20px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px));
        border-top: 1px solid var(--line);
        background: var(--paper);
    }

    .membership-mobile-actions .button {
        min-height: 48px;
        padding: 10px 12px;
        gap: 10px;
    }

    .membership-mobile-actions .button-outline {
        width: 48px;
        padding: 12px;
    }

    .membership-mobile-actions .button-outline > span:not(.screen-reader-text) {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    body.has-mobile-actionbar {
        padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    }

    .contact-mobile-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 28px;
    }

    .contact-mobile-actions .button {
        min-width: 0;
        min-height: 48px;
        padding-inline: 10px;
        gap: 10px;
    }

    .contact-grid {
        gap: 28px;
        padding-bottom: 28px;
    }

    .contact-section-title {
        font-size: 26px;
        margin-bottom: 16px;
    }

    .contact-email {
        font-size: 28px;
        gap: 12px;
    }

    .contact-email svg {
        width: 20px;
        height: 20px;
    }

    .contact-phone {
        font-size: 25px;
        margin-top: 16px;
    }

    .contact-details > div {
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 16px;
    }

    .contact-details dt {
        font-size: 16px;
    }

    .contact-details dd {
        font-size: 19px;
    }

    .contact-people {
        padding-top: 32px;
    }

    .contact-people .section-title {
        font-size: 30px;
    }

    .person-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        padding: 20px 0;
    }

    .person-row > .eyebrow {
        padding: 0;
    }

    .person-row h3 {
        font-size: 26px;
    }

    .person-row > div {
        grid-column: 1;
    }

    .person-row > div a {
        min-height: 40px;
        font-size: 18px;
    }

    .contact-membership {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        margin-top: 28px;
        padding: 24px 20px;
    }

    .contact-membership p {
        font-size: 23px;
    }

    .article-heading h1 {
        font-size: 34px;
        line-height: 1.16;
        margin-bottom: 20px;
    }

    .article-lead {
        font-size: 19px;
        line-height: 1.6;
    }

    .article-skip-link {
        display: inline-flex;
        margin-top: 16px;
    }

    .article-image {
        margin: 24px 0 28px;
    }

    .article-reading {
        max-width: 100%;
    }

    .article-end {
        margin-top: 28px;
        gap: 8px 16px;
    }

    .archive-toolbar {
        margin-bottom: 24px;
    }

    .search-form {
        max-width: none;
    }

    .search-form-label {
        margin-bottom: 8px;
    }

    .search-form input {
        font-size: 18px;
        padding-inline: 12px;
    }

    .search-form button {
        padding-inline: 16px;
    }

    .news-archive-grid {
        display: block;
    }

    .news-archive-grid > .archive-news-item {
        position: relative;
        display: grid;
        grid-template-columns: 108px minmax(0, 1fr);
        gap: 8px 16px;
        align-items: start;
        padding: 20px 0;
        border-top: 1px solid var(--line);
    }

    .news-archive-grid > .archive-news-item .archive-news-visual {
        grid-column: 1;
        grid-row: 1 / span 2;
        width: 108px;
        margin: 0;
    }

    .news-archive-grid > .archive-news-item .news-meta {
        grid-column: 2;
        grid-row: 1;
        margin: 0;
        font-size: 14px;
    }

    .news-archive-grid > .archive-news-item .news-meta > span {
        display: none;
    }

    .news-archive-grid > .archive-news-item h2 {
        grid-column: 2;
        grid-row: 2;
        margin: 0;
        font-size: 22px;
        line-height: 1.28;
    }

    .news-archive-grid > .archive-news-item .archive-news-excerpt,
    .news-archive-grid > .archive-news-item .archive-news-read {
        display: none;
    }

    .news-archive-grid .news-title-link::after {
        content: "";
        position: absolute;
        inset: 0;
    }

    .news-archive-grid .news-title-link:focus-visible {
        outline: 0;
        box-shadow: none;
    }

    .news-archive-grid .news-title-link:focus-visible::after {
        outline: 2px solid var(--green);
        outline-offset: 3px;
    }

    .news-archive-grid > .is-leading {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding-top: 0;
        border: 0;
    }

    .news-archive-grid > .is-leading .archive-news-visual {
        width: 100%;
        margin-bottom: 16px;
    }

    .news-archive-grid > .is-leading .news-meta {
        margin-bottom: 12px;
    }

    .news-archive-grid > .is-leading h2 {
        margin-bottom: 16px;
        font-size: 26px;
        line-height: 1.28;
    }

    .news-archive-grid > .is-leading .archive-news-excerpt {
        display: block;
        margin-bottom: 16px;
        font-size: 19px;
        line-height: 1.65;
    }

    .news-archive-grid > .is-leading .archive-news-read {
        display: inline-flex;
        margin: 0;
    }

    .news-archive-grid > .is-leading .news-title-link::after {
        content: none;
    }

    .pagination {
        margin-top: 28px;
    }

    .empty-state {
        padding: 32px 0;
    }

    .empty-state h1 {
        font-size: 38px;
    }

    .empty-state h2 {
        font-size: 30px;
    }

    .site-footer {
        padding-top: 28px;
    }

    .footer-main {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
        padding-bottom: 28px;
    }

    .site-footer .brand > img {
        width: 50px;
        height: 38px;
    }

    .site-footer .brand-name {
        font-size: 20px;
    }

    .footer-brand-column > p {
        margin-top: 16px;
        max-width: 36ch;
        font-size: 19px;
        line-height: 1.55;
    }

    .site-footer .eyebrow {
        margin-bottom: 10px;
    }

    .footer-contact-column {
        gap: 0;
    }

    .footer-contact-column > .footer-email {
        font-size: 24px;
        min-height: 40px;
    }

    .footer-contact-column > a {
        min-height: 40px;
        font-size: 19px;
    }

    .footer-contact-column > p {
        margin-top: 8px;
        font-size: 18px;
        line-height: 1.5;
    }

    .footer-navigation {
        grid-column: 1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0 24px;
    }

    .footer-navigation > .eyebrow {
        grid-column: 1 / -1;
        margin: 0 0 8px;
    }

    .footer-navigation > a {
        min-height: 44px;
        font-size: 16px;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 8px;
        padding: 20px 0 calc(20px + env(safe-area-inset-bottom, 0px));
        font-size: 14px;
    }
}

@media (max-width: 1120px) and (max-height: 500px) {
    :root {
        --header-height: 72px;
    }

    .navigation-ready .navigation-panel-heading {
        min-height: 60px;
        padding-block: 6px;
    }

    .navigation-ready .navigation-panel-footer {
        padding-top: 10px;
    }
}

@media (max-width: 782px) {
    .admin-bar {
        --adminbar-height: 46px;
        --header-offset: 46px;
    }
}

@media (max-width: 600px) {
    .admin-bar {
        --header-offset: 0px;
    }
}

@media (max-width: 380px) {

    .hero h1 {
        font-size: 36px;
    }

    .hero-visual {
        height: 150px;
    }

    .home-news-item,
    .news-archive-grid > .archive-news-item {
        grid-template-columns: 96px minmax(0, 1fr);
        column-gap: 12px;
    }

    .home-news-item .archive-news-visual,
    .news-archive-grid > .archive-news-item .archive-news-visual {
        width: 96px;
    }

    .news-archive-grid > .is-leading .archive-news-visual {
        width: 100%;
    }

    .home-news-item h3,
    .news-archive-grid > .archive-news-item h2 {
        font-size: 21px;
    }

    .news-archive-grid > .is-leading h2 {
        font-size: 25px;
    }

    .member-card {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 12px;
    }

    .member-card .member-logo {
        width: 64px;
    }

    .member-card .logo-wordmark .member-logo-image,
    .member-card .logo-landscape .member-logo-image {
        max-width: 64px;
    }

    .contact-email {
        font-size: 27px;
        gap: 10px;
    }

    .contact-details > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .membership-panel {
        padding: 16px;
    }

    .membership-fees-grid {
        gap: 12px;
    }

    .fee-row > strong.monthly-fee {
        font-size: 26px;
    }
}

/* Motion follows explicit actions; layout and focus rings remain stable. */
.nav-submenu-toggle > svg,
.member-card-group > summary > svg,
.page-outline-details > summary > svg {
    transition: transform var(--motion-duration) var(--motion-ease);
}
.member-card-group.is-collapsing > summary > svg,
.page-outline-details.is-collapsing > summary > svg {
    transform: rotate(0deg);
}
.button:active,
.header-action:active,
.menu-toggle:active,
.navigation-close:active {
    opacity: .86;
}
.nav-submenu-toggle:active,
.member-card-group > summary:active,
.page-outline-details > summary:active {
    background-color: var(--soft);
}
@media (hover: hover) and (pointer: fine) {
    .menu-toggle:hover,
    .navigation-close:hover,
    .nav-submenu-toggle:hover {
        border-color: var(--green);
        background-color: var(--soft);
    }
    .member-card-group > summary:hover,
    .page-outline-details > summary:hover {
        color: var(--deep);
    }
}

/* A tablet reading column must not be squeezed beside the fee panel. */
@media (min-width: 761px) and (max-width: 960px) {
    .membership-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: 'aside' 'content';
        gap: 40px;
    }
    .membership-aside {
        position: static;
    }
    .membership-fees-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 24px;
    }
    .membership-panel > .button {
        width: auto;
        min-width: 260px;
    }
}

/* Native page navigation: only the incoming content fades; the shell stays still. */
@view-transition {
    navigation: auto;
}

@supports (view-transition-name: lbr-main) {
    :root {
        view-transition-name: none;
    }

    #main {
        view-transition-name: lbr-main;
    }

    .site-header {
        view-transition-name: lbr-header;
    }

    #wpadminbar {
        view-transition-name: lbr-adminbar;
    }

    ::view-transition {
        pointer-events: none;
    }

    ::view-transition-group(lbr-main),
    ::view-transition-group(lbr-header),
    ::view-transition-group(lbr-adminbar),
    ::view-transition-image-pair(lbr-main),
    ::view-transition-image-pair(lbr-header),
    ::view-transition-image-pair(lbr-adminbar) {
        animation: none;
    }

    ::view-transition-group(lbr-main) {
        z-index: 1;
    }

    ::view-transition-group(lbr-header) {
        z-index: 2;
    }

    ::view-transition-group(lbr-adminbar) {
        z-index: 3;
    }

    ::view-transition-old(lbr-main),
    ::view-transition-old(lbr-header),
    ::view-transition-old(lbr-adminbar) {
        display: none;
        animation: none;
    }

    ::view-transition-new(lbr-main),
    ::view-transition-new(lbr-header),
    ::view-transition-new(lbr-adminbar) {
        inline-size: 100%;
        block-size: auto;
        mix-blend-mode: normal;
        animation: none;
    }

    ::view-transition-new(lbr-main) {
        animation: lbr-page-enter 140ms var(--motion-ease) both;
    }
}

@keyframes lbr-page-enter {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    @view-transition {
        navigation: none;
    }

    html {
        scroll-behavior: auto;
    }

    a,
    button,
    input,
    summary,
    .nav-menu .sub-menu,
    .nav-submenu-toggle > svg,
    .member-card-group > summary > svg,
    .page-outline-details > summary > svg {
        transition: none;
    }

    ::view-transition-new(lbr-main) {
        animation: none;
    }
}

/* Print remains a useful reading/export view. */

@media print {
    :root {
        --body: 12pt;
    }

    html {
        scroll-padding-top: 0;
    }

    body {
        background: #fff;
        color: #000;
    }

    .site-header,
    .site-footer,
    .skip-link,
    .page-outline,
    .directory-toolbar,
    .directory-index,
    .article-end,
    .download-link,
    .archive-toolbar,
    .member-preview-strip,
    .member-showcase,
    .hero-actions,
    .header-action {
        display: none;
    }

    .container {
        width: 100%;
        max-width: none;
    }

    .page-main,
    .section {
        padding: 0;
    }

    .page-heading {
        padding-bottom: 16pt;
        margin-bottom: 20pt;
    }

    .page-heading h1 {
        font-size: 28pt;
    }

    .page-heading-grid,
    .prose-layout,
    .membership-layout,
    .contact-grid,
    .initiatives-grid,
    .community-grid {
        display: block;
    }

    .page-heading-copy {
        margin-top: 16pt;
    }

    .entry-content,
    .article-reading {
        max-width: none;
        font-size: 12pt;
    }

    .entry-content h2 {
        font-size: 21pt;
    }

    .entry-content h3 {
        font-size: 17pt;
    }

    .article-heading h1 {
        font-size: 28pt;
    }

    .membership-aside {
        position: static;
        margin-top: 24pt;
    }

    .member-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12pt;
    }

    .member-card {
        min-height: 170pt;
        break-inside: avoid;
    }

    .member-card-visual {
        height: 64pt;
    }

    .member-card-content {
        padding: 12pt;
    }

    .member-card-identity h2 {
        font-size: 13pt;
    }

    .member-card-footer {
        display: none;
    }

    .document-row,
    .person-row,
    .initiative-row {
        break-inside: avoid;
    }
}
