@font-face {
    font-family: "Forevs";
    src: url(https://static.propublica.org/projects/graphics/2025-grazing/fonts/Forevs-Light.woff2)
        format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

/* ACCENT COLORS */

html.force-light-mode body.neutral-cool {
--color-accent-10: #e9e3c9;
--color-accent-20: #CAC29D;
--color-accent-30: #b9ac63;
--color-accent-40: #89824A;
--color-accent-50: #82791a;
--color-accent-60: #676000;
--color-accent-70: #4d4800;
--color-accent-80: #373100;
--color-accent-90: #271900;
}
@media (prefers-color-scheme: light) { html:not(.force-dark-mode) body.neutral-cool {
--color-accent-10: #e9e3c9;
--color-accent-20: #CAC29D;
--color-accent-30: #b9ac63;
--color-accent-40: #89824A;
--color-accent-50: #82791a;
--color-accent-60: #676000;
--color-accent-70: #4d4800;
--color-accent-80: #373100;
--color-accent-90: #271900;
}}

html.force-dark-mode body.neutral-cool {
--color-accent-10: #271900;
--color-accent-20: #373100;
--color-accent-30: #4d4800;
--color-accent-40: #89824A;
--color-accent-50: #82791a;
--color-accent-60: #9e9235;
--color-accent-70: #b9ac63;
--color-accent-80: #CAC29D;
--color-accent-90: #e9e3c9;
}
@media (prefers-color-scheme: dark) { html:not(.force-light-mode) body.neutral-cool {
--color-accent-10: #271900;
--color-accent-20: #373100;
--color-accent-30: #4d4800;
--color-accent-40: #89824A;
--color-accent-50: #82791a;
--color-accent-60: #9e9235;
--color-accent-70: #b9ac63;
--color-accent-80: #CAC29D;
--color-accent-90: #e9e3c9;
}}

/* OTHER COLORS */

body {
    --custom-bg-color: var(--color-accent-20);
    --custom-border-color: var(--color-accent-40);
    --custom-sb-text-color: var(--color-accent-50);
    --color-neutral-10: var(--color-accent-40) !important;

    --color-text-supp: var(--color-accent-70) !important;
    --color-text-meta: var(--color-accent-40) !important;

    background-color: var(--custom-bg-color);
}

@media screen and (width < 60em) {
    .site-header--minimal {
        --site-header-color-text: rgba(255,255,255,0.5);
        --site-header-color-button-text: rgba(255,255,255,0.5);
    }
}

/* CUSTOMIZE EXISTING FURNITURE */

.variant-minimal__wordmark,
.variant-minimal__section-menu .button,
.variant-fixed__wordmark,
.variant-fixed__section-menu .button {
    color: var(--color-accent-70) !important;
}

.site-header--fixed {
    background-color: var(--custom-bg-color) !important;
}

.article-meta-1__byline {
    color: var(--color-accent-80) !important;
}

.share-tools .button {
    --button-bg-color: var(--color-accent-80) !important;
    --button-color: var(--custom-bg-color) !important;
}

.dark-mode-toggle .button {
    --button-bg-color: var(--custom-bg-color) !important;
    --button-color: var(--color-accent-80) !important;
}

.wp-block-post-content>p a:where(:not(.wp-element-button)) {
    text-decoration-color: var(--color-accent-40) !important;
}

.wp-block-propublica-reporting-highlights {
    background-color: var(--color-accent-30) !important; /* Important is needed to override in dark mode */
}

.rich-byline {
    border-color: var(--custom-border-color);
}

.rich-byline__more a,
.rich-byline__more .button {
    color: var(--color-text-supp) !important;
}

.rich-byline__contact-prompt,
.rich-byline__contact-prompt-tail {
    background-color: var(--color-accent-30) !important;
}

.cta-close {
    color: var(--color-light-none) !important;
}

/* HIDE ADS */

body.show-ads .wp-block-propublica-ad-slot { display: none !important; }

/* ADD ADDITIONAL BORDERS */

@media screen and (width >= 60em) {
    .article-body {
        border-left: 1px solid var(--custom-border-color);
        border-right: 1px solid var(--custom-border-color);

        margin-left: calc(-1 * var(--grid-gutter));
        padding: 0 var(--grid-gutter);
        width: calc(var(--grid-gutter) + var(--grid-gutter) + var(--col-size--08));
    }
}

/* .wp-block-propublica-html:not(:has(.custom-section-break)) {
    background-color: var(--custom-bg-color);
} */

/* .wp-block-propublica-html {
    background-color: var(--custom-bg-color);
    border-top: 1px solid var(--custom-border-color);
    border-bottom: 1px solid var(--custom-border-color);
    padding: var(--grid-gutter) 0;
} */

.media-with-borders {
    background-color: var(--custom-bg-color);
    border-top: 1px solid var(--custom-border-color);
    border-bottom: 1px solid var(--custom-border-color);
    padding: var(--grid-gutter) 0;
}

.media-with-borders.bb--size-full:not(.wp-block-propublica-html) {
    padding: var(--grid-gutter);
}

.media-with-borders.bb--size-full figcaption {
    margin-inline: 0 !important;
}

/* REMOVE UNNEEDED BORDERS */

.wp-block-propublica-aside {
    border: 0 !important;
    padding: 0 !important;
}

/* UTILS */

.mbs-0 {
    margin-block-start: 0 !important;
}

.mbe-0 {
    margin-block-end: 0 !important;
}

/* HACK */

.media-with-borders.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.wp-block-propublica-html:has(.custom-section-break) {
    margin-top: 0;
    margin-bottom: 0;
}

.wp-block-propublica-html:has(.custom-section-break) + p {
    margin-top: 0;
}

/* ATTRIBUTION */

.wp-element-caption {
    line-height: var(--line-height-1);
    margin-top: var(--spacing-2);

    color: var(--color-neutral-70);
    font-family: var(--fonts-sans);
    font-size: var(--scale-2);
}

.wp-element-caption a,
.wp-element-caption a:visited {
    color: inherit;
}

.attribution__credit {
    color: var(--color-text-meta);
    font-size: var(--scale-2);

    /* @include breakpoint-min(xl) {
        font-size: var(--scale-3);
    }*/
}

@media screen and (min-width: 60em) {
    .media-with-side-caption {
        align-items: center;
        display: flex;
        gap: var(--grid-gutter);
        flex-direction: row-reverse;
    }
    .media-with-side-caption img {
        width: var(--col-size--10);
    }
    .media-with-side-caption .attribution {
        margin-top: 0;
        width: var(--col-size--02);
    }
}

/* TODO: Fix this in global styles, but for now, fix gallery captions */

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    line-height: var(--line-height-1);
    margin-block-start: var(--spacing-1);
    padding-top: 0;
}

/* MAP */

/*
.grazing-map__map-container img {
    opacity: .85;
}
*/

.grazing-map__map-container .map-scale {
    color: var(--gray-80);
    font-size: var(--scale-2);
    transform: translate(-50%, -50%);
}

.grazing-map__labels-container {
    position: relative;
    width: 100%;
    height: 100%;
    font-size: var(--scale-2);
}

.grazing-map__labels-container > * {
    position: absolute;
    font-family: var(--fonts-sans);
    max-width: 70%;
}

.grazing-map + .attribution {
    margin-left: auto;
    margin-right: auto;
    width: var(--col-size--04);
}

@media screen and (width >= 48em) {
    .grazing-map + .attribution {
        width: var(--col-size--06);
    }
}

@media screen and (width >= 60em) {
    .grazing-map + .attribution {
        width: var(--col-size--08);
    }
}

.grazing-map .lead-in {
    background-color: var(--custom-bg-color);
    border-top: 4px solid var(--custom-border-color);
    border-bottom: 1px solid var(--custom-border-color);
}

@media screen and (width < 60em) {
    .grazing-map .lead-in {
        padding: var(--spacing0) 0;
        margin: 0 var(--grid-margins);
    }
}

@media screen and (width >= 60em) {
    .grazing-map {
        align-items: flex-start;
        padding: 2rem 0;
    }
    .grazing-map .lead-in {
        width: calc(var(--col-size--04));
        margin-left: calc(var(--col-size--01) + var(--grid-gutter) + ((100vw - var(--col-size--14)) / 2));
        padding: var(--grid-gutter) 0;
    }
    .grazing-map__map-container {
        width: calc(var(--col-size--09) + ((100vw - var(--col-size--14)) / 2));
    }
}

/* SECTION BREAKS */

.custom-section-break {
    background-color: var(--custom-bg-color);
    margin: 0;
    /* padding: 6rem 0 0 0; */
    display: grid;
    grid-template-areas: "content";
    place-items: center;
}

.custom-section-break__hed {
    background-color: var(--custom-bg-color);
    grid-area: content;
    font-family: "Forevs", "Times New Roman", serif;
    font-weight: 200;
    color: var(--custom-sb-text-color);
    line-height: 0.8;
    margin: 0 auto;
    text-align: center;
    text-transform: uppercase;
    text-wrap: balance;
    word-wrap: break-word;

    border-bottom: 1px solid var(--custom-border-color);
    border-top: 1px solid var(--custom-border-color);
    z-index: 10;
}

@media screen and (width < 60em) {
    .custom-section-break__hed {
        font-size: 3.5rem;
        padding: 3rem 0;
    }
    .custom-section-break__hed--small {
        font-size: 2.5rem;
    }
}

@media screen and (width >= 60em) {
    .custom-section-break__hed {
        font-size: 6rem;
        padding: 6rem 6rem;
    }
}

.custom-section-break__art {
    grid-area: content;
    height: auto;
    margin: 0 auto;
    mix-blend-mode: darken;
    opacity: 0.25;
    z-index: 11;
}

@media screen and (width >= 60em) {

    .custom-section-break__art {
        width: var(--col-size--06);
    }
}

                                             html.force-dark-mode .custom-section-break__art { mix-blend-mode: lighten; }
@media (prefers-color-scheme: dark) { html:not(.force-light-mode) .custom-section-break__art { mix-blend-mode: lighten; } }



/* HORIZONTAL SCROLLERS */

.hs-scroller__wrapper {
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    align-items: left;
    position: sticky;
    top: 0;
    overflow-x: hidden;
    width: 100vw;
}

.hs-scroller__items {
    display: flex;
    align-items: center;
    gap: 2rem;
    /*transition: transform 0.01s;*/
    will-change: transform;
}

.hs-scroller__item img {
    width: auto;
    height: 90vmin;
}

.hs-scroller__item:first-of-type figure {
    margin-left: var(--spacing1);
}

.hs-scroller__item:last-of-type figure {
    margin-right: var(--spacing1);
}

.hs-scroller + .attribution {
    margin-left: var(--grid-margins);
    margin-right: var(--grid-margins);
}

/*
.article-body>.full .lead-in,
.article-body>.full .attribution {
    margin-left: var(--spacing1);
    margin-right: var(--spacing1);
} */

/* .attribution {
    margin-top: 1rem;
    text-align: center;
} */

@media screen and (min-width: 48em) {
    .hs-scroller__item:first-of-type figure {
        margin-left: var(--spacing3);
    }

    .hs-scroller__item:last-of-type figure {
        margin-right: var(--spacing3);
    }

    /*
    .article-body>.full .lead-in,
    .article-body>.full .attribution {
        margin-left: var(--spacing3);
        margin-right: var(--spacing3);
    }
    */
}