/*
 * Heritage Narrative
 * Light featured-image background with vertically flowing editorial sections.
 * Scoped to the Heritage Narrative page template.
 */

.page-template-page-heritage-narrative {
    background: #f4f0e7;
}

.heritage-narrative {
    --narrative-ink: #0d0e0f;
    --narrative-ink-soft: #2c2a27;
    --narrative-paper: #f4f0e7;
    --narrative-ash: #625e57;
    --narrative-brass: #846b38;
    --narrative-rule: rgba(13, 14, 15, 0.16);
    position: relative;
    min-height: 100vh;
    overflow: clip;
    background: transparent;
    color: var(--narrative-ink);
    font-family: Epilogue, sans-serif;
}

.heritage-narrative::before,
.heritage-narrative::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
}

.heritage-narrative::before {
    z-index: -2;
    background-color: var(--narrative-ink);
    background-image: var(--heritage-narrative-bg, none);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: none;
    transform: none;
}

.heritage-narrative::after {
    z-index: -1;
    background: rgba(244, 240, 231, 0.52);
}

.heritage-narrative.has-no-featured-background::after {
    background: var(--narrative-paper);
}

.heritage-narrative__hero {
    display: flex;
    align-items: flex-end;
    padding:
        calc(var(--site-header-height, 80px) + clamp(2rem, 5vw, 4rem))
        max(clamp(1.25rem, 6vw, 6rem), env(safe-area-inset-right))
        clamp(2.5rem, 5vw, 4.5rem)
        max(clamp(1.25rem, 6vw, 6rem), env(safe-area-inset-left));
    border-bottom: 1px solid var(--narrative-rule);
}

.heritage-narrative__hero-inner {
    width: min(100%, 90rem);
    margin-inline: auto;
}

.heritage-narrative__heading {
    display: grid;
    justify-items: center;
    gap: clamp(0.75rem, 1.5vw, 1.1rem);
    max-width: 30ch;
    margin: 0 auto;
    color: var(--narrative-ink);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(2.75rem, 5.3vw, 5.4rem);
    font-weight: 500;
    line-height: 0.94;
    letter-spacing: -0.025em;
    text-align: center;
    text-wrap: balance;
    text-shadow: 0 0.1rem 0.8rem rgba(244, 240, 231, 0.72);
}

.heritage-narrative__heading-primary {
    display: block;
    max-width: 22ch;
}

.heritage-narrative__heading-secondary {
    display: block;
    max-width: 36ch;
    font-family: Epilogue, sans-serif;
    font-size: clamp(1.1rem, 1.3vw + 0.85rem, 1.65rem);
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
    text-wrap: balance;
}

.heritage-narrative__content {
    padding-block: clamp(3rem, 6vw, 6rem);
}

.heritage-narrative__section {
    padding-inline-start: max(clamp(1.25rem, 6vw, 6rem), env(safe-area-inset-left));
    padding-inline-end: max(clamp(1.25rem, 6vw, 6rem), env(safe-area-inset-right));
}

.heritage-narrative__section + .heritage-narrative__section {
    margin-top: clamp(3.5rem, 7vw, 6.5rem);
}

.heritage-narrative__section-inner {
    width: min(100%, 90rem);
    margin-inline: auto;
}

.heritage-narrative__reading-field {
    position: relative;
    box-sizing: border-box;
    background: rgba(244, 240, 231, 0.46);
    border: 1px solid var(--narrative-rule);
    padding: clamp(1rem, 1.5vw, 1.5rem);
    color: var(--narrative-ink);
}

.heritage-narrative__reading-field h2 {
    max-width: 18ch;
    margin: 0 0 clamp(1.5rem, 2.5vw, 2.25rem);
    color: var(--narrative-ink);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(2.25rem, 4.8vw, 5rem);
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.022em;
    text-align: start;
    text-wrap: balance;
}

.heritage-narrative__prose {
    max-width: 68ch;
    color: var(--narrative-ink);
    font-size: clamp(1.03rem, 0.35vw + 0.96rem, 1.16rem);
    font-weight: 400;
    line-height: 1.62;
    letter-spacing: 0.008em;
    text-align: start;
}

.heritage-narrative__prose > * {
    margin-block: 0 0.85em;
}

.heritage-narrative__prose > p:has(> b:only-child),
.heritage-narrative__prose > p:has(> strong:only-child) {
    margin-bottom: 0.6em;
    line-height: 1.35;
}

.heritage-narrative__prose > *:last-child {
    margin-bottom: 0;
}

.heritage-narrative__prose p {
    color: inherit;
    font: inherit;
    text-wrap: pretty;
}

.heritage-narrative__prose h3,
.heritage-narrative__prose h4,
.heritage-narrative__prose h5,
.heritage-narrative__prose h6 {
    max-width: 28ch;
    margin-block: 2.25em 0.8em;
    color: var(--narrative-ink);
    font-family: Epilogue, sans-serif;
    font-weight: 600;
    line-height: 1.25;
    text-wrap: balance;
}

.heritage-narrative__prose h3 {
    font-size: clamp(1.35rem, 1.6vw, 1.75rem);
}

.heritage-narrative__prose ul,
.heritage-narrative__prose ol {
    padding-inline-start: 1.35em;
}

.heritage-narrative__prose li + li {
    margin-top: 0.65em;
}

.heritage-narrative__prose strong {
    color: var(--narrative-ink);
    font-weight: 600;
}

.heritage-narrative__prose a {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: var(--narrative-brass);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.22em;
}

.heritage-narrative__prose a:focus-visible {
    outline: 2px solid var(--narrative-brass);
    outline-offset: 4px;
}

.heritage-narrative__prose blockquote {
    margin-inline: 0;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid rgba(132, 107, 56, 0.48);
    color: var(--narrative-ink);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    line-height: 1.35;
}

.heritage-narrative__prose hr {
    margin-block: 3.5rem;
    border: 0;
    border-top: 1px solid var(--narrative-rule);
}

.heritage-narrative__media {
    position: relative;
    min-width: 0;
}

.heritage-narrative__media-item,
.heritage-narrative__media-item > p,
.heritage-narrative__media-item > figure {
    margin: 0;
}

.heritage-narrative__media-item a {
    border: 0;
}

.heritage-narrative__media-item img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 72svh;
    margin-inline: auto;
    border-radius: 2px;
    box-shadow: 0 1.25rem 3.5rem rgba(6, 6, 7, 0.28);
    object-fit: contain;
}

.heritage-narrative__media-item .alignleft,
.heritage-narrative__media-item .alignright,
.heritage-narrative__media-item .aligncenter,
.heritage-narrative__media-item .alignnone {
    float: none;
    margin-inline: auto;
}

.heritage-narrative__media-item figcaption,
.heritage-narrative__media-item .wp-caption-text,
.heritage-narrative__media-item .gallery-caption {
    max-width: 52ch;
    margin: 0.8rem auto 0;
    color: var(--narrative-ash);
    font-size: 0.82rem;
    line-height: 1.55;
    letter-spacing: 0.015em;
    text-align: start;
}

.heritage-narrative__section.has-single-media .heritage-narrative__section-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(15rem, 0.65fr);
    align-items: center;
}

.heritage-narrative__section.has-single-media .heritage-narrative__reading-field {
    grid-column: 1;
    grid-row: 1;
    padding-inline-end: clamp(2.75rem, 5vw, 4.5rem);
}

.heritage-narrative__section.has-single-media .heritage-narrative__media--single {
    z-index: 1;
    grid-column: 2;
    grid-row: 1;
    margin-inline-start: clamp(-3.25rem, -3.5vw, -1.75rem);
}

.heritage-narrative__section.has-single-media .heritage-narrative__media-item,
.heritage-narrative__section.has-single-media .heritage-narrative__media-item > p,
.heritage-narrative__section.has-single-media .heritage-narrative__media-item > figure,
.heritage-narrative__section.has-single-media .heritage-narrative__media-item img {
    width: 100%;
}

.heritage-narrative__section.is-media-trailing .heritage-narrative__media-item img {
    margin-inline: 0;
}

.heritage-narrative__section.is-media-leading .heritage-narrative__media-item img {
    margin-inline: auto 0;
}

.heritage-narrative__section.is-media-leading .heritage-narrative__section-inner {
    grid-template-columns: minmax(15rem, 0.65fr) minmax(0, 1.5fr);
}

.heritage-narrative__section.is-media-leading .heritage-narrative__reading-field {
    grid-column: 2;
    padding-inline: clamp(2.75rem, 5vw, 4.5rem) clamp(1rem, 1.5vw, 1.5rem);
}

.heritage-narrative__section.is-media-leading .heritage-narrative__media--single {
    grid-column: 1;
    margin-inline: 0 clamp(-3.25rem, -3.5vw, -1.75rem);
}

.heritage-narrative__section.has-no-media .heritage-narrative__reading-field,
.heritage-narrative__section.has-multiple-media .heritage-narrative__reading-field {
    width: min(100%, 52rem);
}

.heritage-narrative__section.has-no-media .heritage-narrative__reading-field,
.heritage-narrative__section.has-multiple-media .heritage-narrative__reading-field {
    margin-inline: auto;
}

.heritage-narrative__media--multiple {
    width: min(100%, 78rem);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(0.9rem, 1.8vw, 1.5rem);
    margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__section-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(15rem, 0.65fr);
    gap: clamp(1rem, 2vw, 1.75rem);
    align-items: center;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__reading-field {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    padding-inline-end: clamp(2.75rem, 5vw, 4.5rem);
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media--multiple {
    display: contents;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child {
    z-index: 1;
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    margin-inline-start: clamp(-3.25rem, -3.5vw, -1.75rem);
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child > p,
.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child > figure,
.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child img {
    width: 100%;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
}

.heritage-narrative__section.media-count-3 .heritage-narrative__media-item:not(:first-child) img {
    max-height: 34svh;
}

.heritage-narrative__section.media-count-4 .heritage-narrative__media--multiple {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.heritage-narrative__media-item .gallery,
.heritage-narrative__media-item .wp-block-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: clamp(1rem, 2.4vw, 2.25rem);
    margin: 0;
}

.heritage-narrative__media-item .gallery-item,
.heritage-narrative__media-item .wp-block-image,
.heritage-narrative__media-item .gallery-icon {
    width: auto;
    max-width: none;
    margin: 0;
    float: none;
}

.heritage-narrative__section.has-no-copy .heritage-narrative__section-inner {
    display: block;
}

.heritage-narrative__section.has-no-copy .heritage-narrative__media {
    width: min(100%, 78rem);
    margin: 0 auto;
}

[dir="rtl"] .heritage-narrative__reading-field,
[dir="rtl"] .heritage-narrative__prose,
[dir="rtl"] .heritage-narrative__media-item figcaption {
    text-align: right;
}

[dir="rtl"] .heritage-narrative__prose {
    font-family: Beiruti, Epilogue, sans-serif;
    font-size: clamp(1.12rem, 0.45vw + 1rem, 1.28rem);
    line-height: 1.85;
}

@media (max-width: 64rem) {
    .heritage-narrative__section.has-single-media .heritage-narrative__section-inner {
        grid-template-columns: minmax(0, 1.4fr) minmax(13rem, 0.6fr);
    }

    .heritage-narrative__section.is-media-leading .heritage-narrative__section-inner {
        grid-template-columns: minmax(13rem, 0.6fr) minmax(0, 1.4fr);
    }

    .heritage-narrative__section.has-single-media .heritage-narrative__media--single {
        margin-inline-start: -2rem;
    }

    .heritage-narrative__section.is-media-leading .heritage-narrative__media--single {
        margin-inline: 0 -2rem;
    }
}

@media (max-width: 50rem) {
    .heritage-narrative::before {
        filter: none;
        transform: none;
    }

    .heritage-narrative::after {
        background: rgba(244, 240, 231, 0.62);
    }

    .heritage-narrative__section.has-single-media .heritage-narrative__section-inner,
    .heritage-narrative__section.is-media-leading .heritage-narrative__section-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }

    .heritage-narrative__section.has-single-media .heritage-narrative__reading-field,
    .heritage-narrative__section.is-media-leading .heritage-narrative__reading-field {
        grid-column: 1;
        grid-row: 1;
        padding: clamp(1rem, 3vw, 1.5rem);
    }

    .heritage-narrative__section.has-single-media .heritage-narrative__media--single,
    .heritage-narrative__section.is-media-leading .heritage-narrative__media--single {
        grid-column: 1;
        grid-row: 2;
        width: calc(100% - 2rem);
        margin: 0 auto;
    }

    .heritage-narrative__reading-field {
        background: rgba(244, 240, 231, 0.64);
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__section-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__reading-field {
        grid-column: 1;
        grid-row: auto;
        padding: clamp(1rem, 3vw, 1.5rem);
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media--multiple {
        display: grid;
        grid-column: 1;
        grid-row: auto;
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(0.9rem, 1.8vw, 1.5rem);
        margin-top: 0;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item,
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child,
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(2),
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(3) {
        grid-row: auto;
        width: auto;
        margin: 0;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child {
        grid-column: 1 / -1;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(2) {
        grid-column: 1;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(3) {
        grid-column: 2;
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:not(:first-child) img {
        max-height: 72svh;
    }
}

@media (max-width: 40rem) {
    .heritage-narrative__hero {
        padding-bottom: 2.5rem;
    }

    .heritage-narrative__heading {
        max-width: 100%;
        font-size: clamp(2.4rem, 11vw, 3.3rem);
        overflow-wrap: anywhere;
    }

    .heritage-narrative__heading-primary {
        max-width: 18ch;
    }

    .heritage-narrative__content {
        padding-block: 3rem 4.5rem;
    }

    .heritage-narrative__section + .heritage-narrative__section {
        margin-top: 3.5rem;
    }

    .heritage-narrative__reading-field,
    .heritage-narrative__section.has-single-media .heritage-narrative__reading-field,
    .heritage-narrative__section.is-media-leading .heritage-narrative__reading-field,
    .heritage-narrative__section.media-count-3 .heritage-narrative__reading-field {
        padding: 1.2rem 1rem 1.3rem;
    }

    .heritage-narrative__reading-field h2 {
        margin-bottom: 1.25rem;
        font-size: clamp(2rem, 10vw, 3.2rem);
    }

    .heritage-narrative__prose {
        font-size: 1rem;
        line-height: 1.72;
    }

    .heritage-narrative__media--multiple,
    .heritage-narrative__section.media-count-4 .heritage-narrative__media--multiple {
        grid-template-columns: minmax(0, 1fr);
    }

    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item,
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:first-child:not(:only-child),
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(2),
    .heritage-narrative__section.media-count-3 .heritage-narrative__media-item:nth-child(3) {
        grid-column: auto;
    }
}

@media print {
    .heritage-narrative::before,
    .heritage-narrative::after,
    .heritage-narrative__hero {
        display: none;
    }

    .heritage-narrative,
    .heritage-narrative__reading-field {
        background: #f4f0e7;
        color: #0d0e0f;
    }

    .heritage-narrative__reading-field h2,
    .heritage-narrative__prose,
    .heritage-narrative__prose p,
    .heritage-narrative__prose strong {
        color: #0d0e0f;
    }

    .heritage-narrative__section {
        break-inside: avoid;
    }
}