/* Inner-page featured-image header and breadcrumbs. */
.gt-page-header {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    width: 100%;
    overflow: hidden;
    background: var(--gt-dark, #001715);
}

.gt-page-header--image {
    aspect-ratio: 2.35 / 1;
}

.gt-page-header--image::before {
    display: block;
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background-color: #000;
    opacity: .4;
    pointer-events: none;
}

.gt-page-header__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--gt-page-header-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    transition: opacity .7s var(--ease-snappy-polished);
}

body.gt-is-ready .gt-page-header__media,
.gt-page-header.is-media-ready .gt-page-header__media {
    opacity: 1;
}

.gt-page-header__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: clamp(36px, 5vw, 72px);
}

.gt-page-header__title {
    max-width: 16ch;
    margin: 0;
    color: #fff;
    font-size: clamp(2.5rem, 2rem + 2.6vw, 4.75rem);
    line-height: 1.03;
    font-weight: 700;
    letter-spacing: -0.02em;
    text-wrap: balance;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .3);
}

.gt-page-header--plain {
    min-height: 0;
    background: #eef3e9;
    background: color-mix(in srgb, var(--gt-green, #33cc33) 6%, var(--gt-cream, #f8f5ee));
}

.gt-page-header--plain .gt-page-header__inner {
    padding-top: clamp(64px, 8vw, 112px);
    padding-bottom: clamp(48px, 6vw, 84px);
}

.gt-page-header--plain .gt-page-header__title {
    max-width: 20ch;
    color: var(--gt-text, #000);
    text-shadow: none;
}

.gt-page-header:focus {
    outline: none;
}

.gt-breadcrumbs {
    width: 100%;
    padding: 16px clamp(28px, 5vw, 72px);
    background: #fffdf8;
    border-bottom: 1px solid rgba(0, 23, 21, .1);
}

.gt-breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
    line-height: 1.5;
}

.gt-breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.gt-breadcrumbs__item:not(:last-child)::after {
    content: "›";
    margin-left: 8px;
    color: rgba(0, 23, 21, .55);
    font-size: 18px;
    line-height: 1;
}

.gt-breadcrumbs a {
    color: var(--gt-text, #000);
    text-decoration-thickness: 1px;
    text-underline-offset: .2em;
}

.gt-breadcrumbs a:hover,
.gt-breadcrumbs a:focus-visible {
    color: var(--gt-green-dark, #0c6d24);
}

.gt-breadcrumbs [aria-current="page"] {
    color: rgba(0, 23, 21, .7);
}

.gt-page-content {
    padding-top: clamp(42px, 6vw, 80px);
    padding-bottom: clamp(56px, 7vw, 96px);
}

@media (max-width: 760px) {
    .gt-page-header--image {
        aspect-ratio: auto;
        min-height: 300px;
    }

    .gt-page-header__inner {
        padding: 36px 28px;
    }

    .gt-page-header--plain .gt-page-header__inner {
        padding: 56px 28px 42px;
    }

    .gt-breadcrumbs {
        padding-inline: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gt-page-header__media {
        opacity: 1;
        transition: none;
    }
}
