/* ARTWORK NOTES
--------------------------------------------
St. Paul Catholic Church, Lyons KS — 2026 Studius redesign
Reference: Replit mockup (St. Paul's) — navy header, video hero + Mass Times,
mission band, Facebook / News & Events / sponsors row, calendar band,
three photo quicklinks, sponsor row, three-column footer.
Isolated file: loaded only by the rt_studius Base/#Outline/#Home/#Grid/#Sponsors
asset rows. The live Clarity site keeps /content/override.css.
Palette lives in Base Outline Page Settings (primary navy, secondary orange,
tertiary crimson). Fonts: Fraunces (titles) + DM Sans (body).
--------------------------------------------
*/

/************ SITE TOKENS ************/
/* Reference content width (80rem) for the redesign's capped sections */
html body :is(#g-navigation, #g-container-main, #g-expanded, #g-extension, #g-bottom, #g-footer, #g-copyright) {
    --site-container-max-width: 80rem;
}

html body {
    --stp-ink-rgb: 34, 37, 42;
    --stp-muted-rgb: 112, 99, 92;
    --stp-line-rgb: 226, 232, 240;
    --stp-ink: rgba(var(--stp-ink-rgb), 1);
    --stp-muted: rgba(var(--stp-muted-rgb), 1);
    --stp-line: rgba(var(--stp-line-rgb), 1);
    --stp-content-width: 80rem;
    --stp-radius-card: .75rem;
    --stp-shadow-card: 0 1px 3px rgba(var(--default-black-rgb), .08), 0 1px 2px rgba(var(--default-black-rgb), .04);

    /* Reference headings are Fraunces bold without small caps */
    --h1-font-variant-caps: normal;
    --h2-font-variant-caps: normal;
    --h3-font-variant-caps: normal;
    --h4-font-variant-caps: normal;
    --h5-font-variant-caps: normal;
    --h6-font-variant-caps: normal;

    --side-menu-bg: var(--primary-color);
    --side-menu-bg-hover: var(--secondary-color);
    --side-menu-font-family: var(--body-font-family);
    --side-menu-font-weight: 400;
}

html body.site,
html body #g-page-surround,
html body #g-container-top,
html body #g-container-main,
html body #g-container-footer {
    background-color: var(--default-white);
}

html body.site {
    color: var(--stp-ink);
    font-family: var(--body-font-family);
}

/* Trailing editor paragraph left in TinyMCE-safe utility articles */
:is(.stp-mass-times, .stp-mission, .stp-footer, .s-widget-wrapper) ~ p {
    display: none;
}

/************ NAVIGATION (all pages) ************/
html body #g-navigation {
    --main-menu-text-color: rgba(var(--default-white-rgb), .9);
    --main-menu-text-color-hover: var(--secondary-color);
    --main-menu-bg: var(--primary-color);
    --main-menu-bg-color: var(--primary-color);
    --navigation-menu-item-padding: .5rem .375rem;
    --navigation-toplevel-menu-item-font-size: .75rem;
    --navigation-toplevel-menu-item-font-weight: 500;
    --navigation-toplevel-menu-item-letter-spacing: .08em;
    --navigation-toplevel-menu-item-text-transform: uppercase;
    --navigation-toplevel-menu-item-variant-caps: normal;
    position: relative;
    z-index: 50;
    overflow: visible;
    background: var(--primary-color);
    box-shadow: 0 5px 16px rgba(var(--default-black-rgb), .25);
}

html body #g-navigation > .g-container {
    box-sizing: border-box;
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: 0 1rem !important;
}

html body #g-navigation > .g-container > .g-grid {
    align-items: center;
    min-height: 6rem;
    padding: 0;
}

/* Let the round logo overhang the hero, as in the reference */
html body #g-container-top,
html body #g-navigation,
html body #g-navigation > .g-container,
html body #g-navigation > .g-container > .g-grid,
html body #g-navigation .stp-navigation,
html body #g-navigation .stp-navigation :is(.g-content, .g-content-array, .g-grid, .g-block, .g-array-item, .g-array-item-text) {
    overflow: visible;
}

.stp-navigation > .g-content,
.stp-navigation .g-content-array,
.stp-navigation .g-content-array > .g-grid,
.stp-navigation .g-content-array > .g-grid > .g-block > .g-content,
.stp-navigation .g-array-item,
.stp-navigation .g-array-item-text {
    margin: 0;
    padding: 0;
}

.stp-site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: min(2vw, 2rem);
    min-height: 6rem;
}

.stp-header-brand {
    flex: 0 0 auto;
    align-self: flex-start;
    height: 6rem;
}

.stp-header-logo {
    display: block;
    position: relative;
    z-index: 2;
    line-height: 0;
    transition: opacity .2s ease;
}

.stp-header-logo img {
    display: block;
    width: auto;
    height: 8rem;
    max-width: none;
}

.stp-header-logo:hover,
.stp-header-logo:focus-visible {
    opacity: .88;
}

.stp-header-logo:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 4px;
    border-radius: .25rem;
}

.stp-menu-wrapper {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
}

.stp-menu-wrapper .g-main-nav .g-toplevel {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0 min(1vw, 1rem);
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li {
    margin: 0;
    background: transparent;
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container {
    padding: .5rem .25rem;
    color: rgba(var(--default-white-rgb), .9);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: color .2s ease;
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container .g-menu-parent-indicator {
    display: none;
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container::before,
.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container::after,
.stp-menu-wrapper .g-main-nav .g-toplevel > li::before,
.stp-menu-wrapper .g-main-nav .g-toplevel > li::after {
    display: none;
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li:hover > .g-menu-item-container,
.stp-menu-wrapper .g-main-nav .g-toplevel > li.g-selected > .g-menu-item-container,
.stp-menu-wrapper .g-main-nav .g-toplevel > li.active > .g-menu-item-container,
.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container:focus-visible {
    background: transparent;
    color: var(--secondary-color);
}

.stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 2px;
}

html body #g-navigation.crawl-space .stp-menu-wrapper .g-main-nav .g-toplevel > li.active > .g-menu-item-container {
    border-bottom-color: transparent;
}

/* Dropdowns */
.stp-menu-wrapper .g-main-nav .g-dropdown {
    background: var(--default-white);
    border: 1px solid var(--stp-line);
    border-top: 3px solid var(--secondary-color);
    border-radius: 0 0 .5rem .5rem;
    box-shadow: 0 12px 24px rgba(var(--default-black-rgb), .15);
}

.stp-menu-wrapper .g-main-nav .g-sublevel > li {
    background: transparent;
}

.stp-menu-wrapper .g-main-nav .g-sublevel > li > .g-menu-item-container {
    padding: .625rem 1rem;
    color: var(--primary-color);
    font-family: var(--body-font-family);
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: normal;
    text-transform: none;
}

.stp-menu-wrapper .g-main-nav .g-sublevel > li > .g-menu-item-container .g-menu-item-title {
    font-size: inherit;
}

.stp-menu-wrapper .g-main-nav .g-sublevel > li:hover > .g-menu-item-container,
.stp-menu-wrapper .g-main-nav .g-sublevel > li.active > .g-menu-item-container,
.stp-menu-wrapper .g-main-nav .g-sublevel > li > .g-menu-item-container:focus-visible {
    background: rgba(var(--secondary-color-rgb), .1);
    color: var(--secondary-color);
}

/* Social + search */
html body #g-navigation .nav-social-icons > .g-content {
    margin: 0;
    padding: 0;
}

html body #g-navigation .nav-social-icons .g-social-items {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    padding-left: 1rem;
    border-left: 1px solid rgba(var(--default-white-rgb), .25);
}

html body #g-navigation .nav-social-icons .g-social-items a {
    display: inline-grid;
    place-items: center;
    width: 1.5rem;
    height: 1.5rem;
    margin: 0;
    padding: 0;
    background: transparent;
    color: var(--default-white);
    font-size: 1rem;
    transition: color .2s ease;
}

html body #g-navigation .nav-social-icons .g-social-items a:hover,
html body #g-navigation .nav-social-icons .g-social-items a:focus-visible {
    color: var(--secondary-color);
}

html body #g-navigation .nav-social-icons .g-social-items a:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 2px;
    border-radius: .25rem;
}

/************ HOMEPAGE — HERO VIDEO + MASS TIMES ************/
html body.site-home #g-slideshow {
    position: relative;
    z-index: 1;
    background: var(--primary-color);
    border-bottom: 2px solid var(--default-white);
}

html body.site-home #g-slideshow > .g-container {
    max-width: none;
    width: 100%;
    padding: 0 !important;
}

html body.site-home #g-slideshow > .g-container > .g-grid {
    align-items: stretch;
}

.stp-hero-video-block > .g-content,
.stp-mass-times-block > .g-content {
    height: 100%;
    margin: 0;
    padding: 0;
}

.stp-hero-video {
    position: relative;
    height: var(--slideshow-height, 600px);
    overflow: hidden;
    background: var(--primary-color);
}

.stp-hero-video-media {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stp-hero-shade {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(to top, rgba(var(--default-black-rgb), .4), transparent 50%, rgba(var(--default-black-rgb), .1)),
        rgba(var(--default-black-rgb), .3);
}

/* Mass Times panel */
.stp-mass-times-block {
    background: var(--default-white);
}

.stp-mass-times-block .g-content-array,
.stp-mass-times-block .g-content-array > .g-grid,
.stp-mass-times-block .g-content-array > .g-grid > .g-block > .g-content,
.stp-mass-times-block .g-array-item,
.stp-mass-times-block .g-array-item-text {
    height: 100%;
    margin: 0;
    padding: 0;
}

.stp-mass-times {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: var(--slideshow-height, 600px);
    overflow-y: auto;
    background: var(--default-white);
    color: var(--stp-ink);
}

.stp-mass-times .stp-mass-times-title {
    font-variant-caps: normal;
    margin: 0;
    border: 0;
    padding: 1rem 1.5rem;
    background: var(--secondary-color);
    color: var(--default-white);
    font-family: var(--title-font-family);
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .025em;
}

.stp-mass-times-body {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
}

.stp-mass-group h3 {
    font-variant-caps: normal;
    margin: 0 0 .5rem;
    padding: 0 0 .25rem;
    border-bottom: 1px solid rgba(var(--secondary-color-rgb), .2);
    color: var(--secondary-color);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.33;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.stp-mass-group p {
    margin: 0 0 .25rem;
    color: var(--stp-ink);
    font-family: var(--body-font-family);
    font-size: 1rem;
    line-height: 1.375;
}

.stp-mass-group p strong {
    font-weight: 500;
}

/************ HOMEPAGE — MISSION ************/
html body.site-home #g-header {
    background: var(--primary-color);
    margin-bottom: min(4vw, 4rem);
}

html body.site-home #g-header > .g-container {
    max-width: none;
    padding: min(4vw, 4rem) 1rem !important;
}

.stp-mission-block .g-content-array,
.stp-mission-block .g-content-array > .g-grid,
.stp-mission-block .g-content-array > .g-grid > .g-block > .g-content,
.stp-mission-block .g-array-item,
.stp-mission-block .g-array-item-text {
    margin: 0;
    padding: 0;
}

.stp-mission {
    text-align: center;
}

.stp-mission .stp-eyebrow {
    margin: 0 0 1rem;
    color: var(--secondary-color);
    font-family: var(--body-font-family);
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.43;
    letter-spacing: .3em;
    text-transform: uppercase;
}

.stp-mission .stp-mission-statement {
    font-variant-caps: normal;
    text-transform: none;
    border: 0;
    max-width: 64rem;
    margin: 0 auto;
    padding: 0 1rem;
    color: var(--default-white);
    font-family: var(--title-font-family);
    font-size: clamp(1.5rem, 3.4vw, 3rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: normal;
    text-wrap: balance;
}

/* Decorative divider: lines + orange cross badge */
.stp-mission::after {
    content: '';
    display: block;
    width: 15rem;
    height: 2.25rem;
    margin: 2rem auto 0;
    background:
        linear-gradient(var(--default-white), var(--default-white)) center / 2px 1.25rem no-repeat,
        linear-gradient(var(--default-white), var(--default-white)) center / .875rem 2px no-repeat,
        radial-gradient(circle at center, var(--secondary-color) 0 1.125rem, rgba(var(--secondary-color-rgb), .14) 1.125rem 1.45rem, transparent 1.45rem),
        linear-gradient(to right, transparent, rgba(var(--secondary-color-rgb), .7)) left center / 6rem 1px no-repeat,
        linear-gradient(to left, transparent, rgba(var(--secondary-color-rgb), .7)) right center / 6rem 1px no-repeat;
}

/************ HOMEPAGE — FACEBOOK / NEWS / SPONSORS ROW ************/
html body.site-home #g-container-main > .g-container {
    box-sizing: border-box;
    max-width: var(--stp-content-width);
    margin: 0 auto min(6vw, 6rem);
    padding: 0 min(4vw, 4rem) !important;
}

html body.site-home #g-container-main > .g-container > .g-grid {
    align-items: flex-start;
}

html body.site-home :is(#g-sidebar, #g-mainbar, #g-aside) {
    padding: 0 1rem;
}

html body.site-home :is(#g-sidebar, #g-mainbar, #g-aside) > .g-grid > .g-block > .g-content {
    margin: 0;
    padding: 0;
}

/* Facebook card (Elfsight placeholder) */
.stp-facebook-block .g-content-array,
.stp-facebook-block .g-content-array > .g-grid,
.stp-facebook-block .g-content-array > .g-grid > .g-block > .g-content,
.stp-facebook-block .g-array-item,
.stp-facebook-block .g-array-item-text {
    margin: 0;
    padding: 0;
}

.stp-facebook-widget {
    overflow: hidden;
    min-height: 20rem;
    background: var(--default-white);
    border: 1px solid var(--stp-line);
    border-radius: var(--stp-radius-card);
    box-shadow: var(--stp-shadow-card);
}

.stp-facebook-widget .stp-facebook-feed {
    max-height: 41rem;
    overflow-y: auto;
}

.stp-feed-loading {
    margin: 0;
    padding: 1.5rem;
    color: var(--stp-muted);
    font-size: .875rem;
    text-align: center;
}

/* News & Events header */
.stp-news-header-block {
    margin: 0;
}

.stp-news-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--stp-line);
}

.stp-news-header .g-title {
    font-variant-caps: normal;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--primary-color);
    font-family: var(--body-font-family);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.33;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.stp-news-header .g-title::before,
.stp-news-header .g-title::after {
    display: none;
}

.stp-news-header .button.stp-view-all,
.stp-calendar-widget .button.stp-calendar-button {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    max-width: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    border: 0;
    background: var(--secondary-color);
    color: var(--default-white);
    font-family: var(--body-font-family);
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(var(--default-black-rgb), .1);
    transition: background-color .2s ease, box-shadow .2s ease;
}

.stp-news-header .button.stp-view-all {
    padding: .5rem 1rem;
    border-radius: 999px;
    font-size: .625rem;
    line-height: 1.5;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.stp-news-header .button.stp-view-all:hover,
.stp-news-header .button.stp-view-all:focus-visible,
.stp-calendar-widget .button.stp-calendar-button:hover,
.stp-calendar-widget .button.stp-calendar-button:focus-visible {
    background: var(--primary-color);
    color: var(--default-white);
    box-shadow: 0 4px 12px rgba(var(--default-black-rgb), .2);
}

.stp-news-header .button.stp-view-all:focus-visible,
.stp-calendar-widget .button.stp-calendar-button:focus-visible {
    outline: 2px solid var(--default-white);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px var(--secondary-color);
}

/* News list */
.stp-news-block .g-content-array,
.stp-news-block .g-content-array > .g-grid,
.stp-news-block .g-content-array > .g-grid > .g-block > .g-content {
    margin: 0;
    padding: 0;
}

.stp-news-block .g-array-item {
    position: relative;
    display: grid;
    grid-template-columns: 5rem minmax(0, 1fr);
    grid-template-areas:
        "image title"
        "image text";
    align-items: start;
    column-gap: 1.25rem;
    row-gap: .25rem;
    margin: 0;
    padding: 1.25rem 0;
    border-bottom: 1px solid var(--stp-line);
}

.stp-news-block .g-array-item-image {
    grid-area: image;
    align-self: center;
    width: 5rem;
    height: 5rem;
    margin: 0;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--stp-line);
}

.stp-news-block .g-array-item-image a {
    display: block;
    width: 100%;
    height: 100%;
}

.stp-news-block .g-array-item-image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    transition: transform .3s ease;
}

.stp-news-block .g-array-item-title {
    grid-area: title;
    align-self: end;
    margin: 0;
}

.stp-news-block .g-array-item-title .g-item-title {
    font-variant-caps: normal;
    margin: 0;
    border: 0;
    padding: 0;
    color: var(--stp-ink);
    font-family: var(--title-font-family);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
}

.stp-news-block .g-array-item-title .g-item-title a {
    color: inherit;
    text-decoration: none;
    transition: color .2s ease;
}

/* Full-card target: stretch the title link over the whole news row */
.stp-news-block .g-array-item-title .g-item-title a::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: .5rem;
}

.stp-news-block .g-array-item-text {
    grid-area: text;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--stp-muted);
    font-family: var(--body-font-family);
    font-size: .75rem;
    line-height: 1.625;
}

/* The news block carries #grid-addpic (shared default-image script); match its ID-level CDN rules */
html body #g-mainbar #grid-addpic.stp-news-block .g-array-item-text {
    font-size: .75rem;
    line-height: 1.625;
    color: var(--stp-muted);
}

html body #g-mainbar #grid-addpic.stp-news-block .g-item-title {
    font-size: 1rem;
    line-height: 1.25;
}

.stp-news-block .g-array-item:hover .g-item-title a,
.stp-news-block .g-array-item:focus-within .g-item-title a {
    color: var(--secondary-color);
}

.stp-news-block .g-array-item:focus-within {
    outline: 2px solid var(--secondary-color);
    outline-offset: 4px;
    border-radius: .5rem;
}

.stp-news-block .g-array-item .g-item-title a:focus-visible {
    outline: 0;
}

@media (hover: hover) and (pointer: fine) {
    .stp-news-block .g-array-item:hover .g-array-item-image img {
        transform: scale(1.06);
    }
}

/* Sponsors column */
.stp-home-ads .side-ads .moduletable,
.stp-home-ads .side-ads .table-container {
    margin: 0;
}

.stp-home-ads .side-ads table,
.stp-home-ads .side-ads tbody {
    display: block;
    width: 100%;
}

.stp-home-ads .side-ads tbody {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.stp-home-ads .side-ads tr,
.stp-home-ads .side-ads td {
    display: block;
    padding: 0 !important;
}

.stp-home-ads .side-ads a {
    display: block;
    line-height: 0;
    border-radius: .375rem;
    transition: box-shadow .2s ease;
}

.stp-home-ads .side-ads img {
    display: block;
    width: 10.3125rem;
    max-width: 100%;
    height: auto;
    border-radius: .375rem;
    box-shadow: var(--stp-shadow-card);
}

.stp-home-ads .side-ads a:hover,
.stp-home-ads .side-ads a:focus-visible {
    box-shadow: 0 6px 16px rgba(var(--default-black-rgb), .18);
}

.stp-home-ads .side-ads a:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 3px;
}

.stp-sponsors-link {
    margin: 1.25rem 0 0;
    text-align: center;
}

.stp-sponsors-link a {
    color: var(--secondary-color);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 700;
    text-decoration: none;
}

.stp-sponsors-link a::after {
    content: '\f061';
    margin-left: .375rem;
    font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: .7em;
}

.stp-sponsors-link a:hover,
.stp-sponsors-link a:focus-visible {
    color: var(--primary-color);
    text-decoration: underline;
}

/************ HOMEPAGE — CALENDAR ************/
html body.site-home #g-expanded {
    position: relative;
    background: url('/images/pub/redesign-2026/bg-calendar.jpg') 50% 50% / cover no-repeat fixed;
}

html body.site-home #g-expanded::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(var(--primary-color-rgb), .8);
    pointer-events: none;
}

html body.site-home #g-expanded > .g-container {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: min(5vw, 5rem) min(4vw, 4rem) min(8vw, 8rem) !important;
}

.stp-calendar-block > .g-content,
.stp-calendar-block .g-content-array,
.stp-calendar-block .g-content-array > .g-grid,
.stp-calendar-block .g-content-array > .g-grid > .g-block > .g-content,
.stp-calendar-block .g-array-item,
.stp-calendar-block .g-array-item-text {
    margin: 0;
    padding: 0;
    background: transparent;
}

.stp-calendar-widget,
.stp-calendar-widget .s-widget-title-wrapper,
.stp-calendar-widget .s-widget-title,
.stp-calendar-widget .s-widget-feed {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.stp-calendar-widget .s-widget-title .g-title {
    font-variant-caps: normal;
    margin: 0 0 2.5rem;
    padding: 0;
    border: 0;
    color: var(--secondary-color);
    font-family: var(--body-font-family);
    font-size: 1.875rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .25em;
    text-align: center;
    text-transform: uppercase;
}

.stp-calendar-widget .s-widget-title .g-title::before,
.stp-calendar-widget .s-widget-title .g-title::after {
    display: none;
}

.stp-calendar-feed .stp-feed-loading {
    color: rgba(var(--default-white-rgb), .8);
}

.stp-calendar-feed .gcaltohtml {
    display: flex;
    flex-wrap: nowrap;
    justify-content: safe center;
    gap: 1rem;
    margin: 0;
    padding: .5rem .25rem;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

.stp-calendar-feed .gcaltohtml::-webkit-scrollbar {
    display: none;
}

.stp-calendar-feed .cc-date-event-container {
    box-sizing: border-box;
    flex: 0 0 13.625rem;
    min-height: 15.3125rem;
    padding: 1rem;
    background: var(--default-white);
    border: 1px solid var(--stp-line);
    border-radius: var(--stp-radius-card);
    box-shadow: 0 5px 14px rgba(var(--default-black-rgb), .22);
    scroll-snap-align: start;
}

.stp-calendar-feed .cc-dateblockformat {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "month weekday"
        "day weekday";
    align-items: start;
    gap: 0 .5rem;
    margin: 0;
    padding: 0 0 .75rem;
    border-bottom: 1px solid var(--stp-line);
    border-radius: 0;
    background: transparent;
    color: var(--tertiary-color);
    text-transform: none;
}

.stp-calendar-feed .cc-day-month-year-wrapper {
    display: contents;
}

.stp-calendar-feed .cc-monthyearformat {
    grid-area: month;
    margin: 0;
    color: var(--tertiary-color);
    font-family: var(--title-font-family);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: normal;
    text-transform: uppercase;
}

.stp-calendar-feed .cc-daynumberformat {
    grid-area: day;
    color: var(--tertiary-color);
    font-family: var(--title-font-family);
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2;
}

.stp-calendar-feed .cc-dayformat {
    grid-area: weekday;
    justify-self: end;
    padding-top: .25rem;
    color: rgba(var(--stp-ink-rgb), .9);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.33;
    letter-spacing: normal;
    text-transform: none;
}

.stp-calendar-feed .cc-eventblock {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0;
    padding: 1rem 0 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

.stp-calendar-feed .event {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
    margin: 0;
}

.stp-calendar-feed .event .cc-title {
    order: -1;
    color: var(--stp-ink);
    font-family: var(--body-font-family);
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25;
}

.stp-calendar-feed .event .cc-timeofday {
    padding: 0;
    background: transparent;
    border-radius: 0;
    color: rgba(var(--stp-ink-rgb), .6);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 400;
    line-height: 1.33;
    white-space: normal;
}

.stp-calendar-feed .event :is(.cc-location, .cc-description) {
    color: rgba(var(--stp-ink-rgb), .6);
    font-size: .75rem;
}

.stp-calendar-widget .s-widget-link {
    margin-top: 2.5rem;
    text-align: center;
}

.stp-calendar-widget .button.stp-calendar-button {
    padding: .75rem 2rem;
    border-radius: .625rem;
    font-size: .875rem;
    line-height: 1.43;
    letter-spacing: normal;
    text-transform: none;
}

/************ HOMEPAGE — QUICKLINKS ************/
html body.site-home #g-extension > .g-container {
    box-sizing: border-box;
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: 2rem 1rem !important;
}

.stp-quicklinks > .g-content {
    margin: 0;
    padding: 0;
}

.stp-quicklinks .g-blockcontent-subcontent {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin: 0;
}

.stp-quicklinks .g-blockcontent-subcontent-block {
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
}

.stp-quicklinks .g-blockcontent-subcontent-block-content {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--default-white);
    border: 2px solid rgba(var(--default-white-rgb), .5);
    border-radius: 1rem;
    box-shadow: 0 10px 15px -3px rgba(var(--default-black-rgb), .1), 0 4px 6px -4px rgba(var(--default-black-rgb), .1);
    transition: box-shadow .3s ease, transform .3s ease;
}

.stp-quicklinks .g-blockcontent-subcontent-img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform .5s ease;
}

.stp-quicklinks .g-blockcontent-subcontent-title {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.stp-quicklinks .g-blockcontent-buttons {
    position: static;
    z-index: 1;
    margin: 0;
    padding: 0;
}

.stp-quicklinks .g-blockcontent-buttons .button.stp-ql-button {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0;
    padding: .75rem;
    border: 0;
    border-radius: 0;
    background: var(--primary-color);
    color: var(--default-white);
    font-family: var(--body-font-family);
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .1em;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: none;
    transform: none;
    transition: background-color .3s ease;
}

/* Full-card target: stretch the existing button link over the card */
.stp-quicklinks .g-blockcontent-buttons .button.stp-ql-button::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 2;
}

.stp-quicklinks .g-blockcontent-subcontent-block-content:hover .button.stp-ql-button,
.stp-quicklinks .g-blockcontent-subcontent-block-content:focus-within .button.stp-ql-button {
    background: var(--secondary-color);
}

.stp-quicklinks .g-blockcontent-subcontent-block-content:focus-within {
    outline: 3px solid var(--secondary-color);
    outline-offset: 3px;
}

.stp-quicklinks .button.stp-ql-button:focus-visible {
    outline: 0;
}

@media (hover: hover) and (pointer: fine) {
    .stp-quicklinks .g-blockcontent-subcontent-block-content:hover {
        transform: translateY(-4px);
        box-shadow: 0 25px 50px -12px rgba(var(--default-black-rgb), .25);
    }
    .stp-quicklinks .g-blockcontent-subcontent-block-content:hover .g-blockcontent-subcontent-img {
        transform: scale(1.05);
    }
}

/************ SPONSOR ROW (Bottom — all pages) ************/
html body #g-bottom {
    background: var(--default-white);
}

html body #g-bottom > .g-container {
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: 1.5rem 1rem !important;
}

html body #g-bottom .table-container {
    display: flex;
    justify-content: center;
}

html body #g-bottom table,
html body #g-bottom tbody {
    display: block;
}

html body #g-bottom tr {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

html body #g-bottom td {
    display: block;
    padding: 0 !important;
}

html body #g-bottom td a {
    display: block;
    line-height: 0;
    transition: opacity .2s ease;
}

html body #g-bottom td img {
    display: block;
    width: auto;
    height: 4.5625rem;
    max-width: 100%;
}

html body #g-bottom td a:hover,
html body #g-bottom td a:focus-visible {
    opacity: .85;
}

html body #g-bottom td a:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 3px;
}

/************ FOOTER (all pages) ************/
html body #g-footer {
    background: var(--primary-color);
    border-top: 6px solid var(--secondary-color);
    color: var(--default-white);
}

html body #g-footer > .g-container {
    box-sizing: border-box;
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: 2.5rem 1rem !important;
}

.stp-footer-block > .g-content,
.stp-footer-block .g-content-array,
.stp-footer-block .g-content-array > .g-grid,
.stp-footer-block .g-content-array > .g-grid > .g-block > .g-content,
.stp-footer-block .g-array-item,
.stp-footer-block .g-array-item-text {
    margin: 0;
    padding: 0;
}

.stp-footer {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem 4rem;
    padding: 0 min(1vw, 1rem);
}

.stp-footer p {
    margin: 0 0 .5rem;
    color: rgba(var(--default-white-rgb), .75);
    font-family: var(--body-font-family);
    font-size: .875rem;
    line-height: 1.6;
}

.stp-footer a {
    color: rgba(var(--default-white-rgb), .75);
    text-decoration: none;
    transition: color .2s ease;
}

.stp-footer a:hover,
.stp-footer a:focus-visible {
    color: var(--secondary-color);
    text-decoration: underline;
}

.stp-footer a:focus-visible {
    outline: 2px solid var(--secondary-color);
    outline-offset: 2px;
}

.stp-footer h2 {
    font-variant-caps: normal;
    margin: 0 0 1rem;
    padding: 0;
    border: 0;
    color: var(--default-white);
    font-family: var(--body-font-family);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.33;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.stp-footer h2::before,
.stp-footer h2::after {
    display: none;
}

.stp-footer .stp-footer-logo {
    margin: 0 0 1.25rem;
}

.stp-footer .stp-footer-logo a {
    display: inline-block;
    color: var(--default-white);
    text-decoration: none;
}

.stp-footer .stp-footer-logo a:hover .stp-footer-name,
.stp-footer .stp-footer-logo a:focus-visible .stp-footer-name {
    color: var(--secondary-color);
}

.stp-footer-name {
    display: block;
    color: var(--default-white);
    font-family: var(--title-font-family);
    font-size: 1.875rem;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: color .2s ease;
}

.stp-footer-sub {
    display: block;
    margin-top: .25rem;
    color: rgba(var(--default-white-rgb), .8);
    font-family: var(--title-font-family);
    font-size: .75rem;
    line-height: 1.33;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.stp-footer-sub em {
    font-style: italic;
    letter-spacing: normal;
    text-transform: none;
}

.stp-footer .stp-footer-tagline {
    max-width: 20rem;
    color: rgba(var(--default-white-rgb), .7);
}

.stp-footer .stp-icon {
    position: relative;
    padding-left: 1.75rem;
}

.stp-footer .stp-icon::before {
    position: absolute;
    left: 0;
    top: .1em;
    width: 1.125rem;
    color: var(--secondary-color);
    font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
    font-size: 1rem;
    font-weight: 900;
    text-align: center;
}

.stp-footer .stp-icon-map::before { content: '\f3c5'; }
.stp-footer .stp-icon-phone::before { content: '\f095'; }
.stp-footer .stp-icon-email::before { content: '\f0e0'; }
.stp-footer .stp-icon-clock::before { content: '\f017'; font-weight: 400; }

/************ COPYRIGHT (all pages) ************/
html body #g-copyright {
    background: var(--primary-color);
    border-top: 1px solid rgba(var(--default-white-rgb), .1);
}

html body #g-copyright > .g-container {
    max-width: var(--stp-content-width);
    margin: 0 auto;
    padding: 1rem !important;
}

html body #g-copyright .adminfootericon {
    text-align: center;
    text-shadow: none !important;
}

html body #g-copyright .adminfootericon a {
    color: rgba(var(--default-white-rgb), .75) !important;
    text-decoration: none;
}

html body #g-copyright .adminfootericon a:hover,
html body #g-copyright .adminfootericon a:focus-visible {
    color: var(--secondary-color) !important;
}

/************ LAPTOP ************/
@media only screen and (min-width: 50.99rem) and (max-width: 90rem) {
    html body #g-navigation {
        --navigation-menu-item-padding: .5rem .3rem;
        --navigation-toplevel-menu-item-font-size: .6875rem;
        --navigation-toplevel-menu-item-letter-spacing: .05em;
    }
    .stp-menu-wrapper .g-main-nav .g-toplevel {
        gap: 0;
    }
    .stp-header-logo img {
        height: 7rem;
    }
}

/************ TABLET ************/
@media only screen and (min-width: 50.99rem) and (max-width: 75rem) {
    .stp-header-logo img {
        height: 5.5rem;
    }
    html body.site-home #g-container-main > .g-container {
        padding: 0 1rem !important;
    }
}

/************ MOBILE ************/
@media only screen and (max-width: 50.99rem) {
    html body #g-navigation > .g-container > .g-grid,
    .stp-site-header {
        min-height: 6rem;
    }
    /* Native Gantry mobile relocation hides the inner article block: keep branding visible */
    html body #g-navigation .stp-navigation .g-content-array .g-block.hidden {
        display: block !important;
        visibility: visible !important;
    }
    html body #g-navigation .stp-navigation {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }
    html body #g-navigation .nav-social-icons,
    .stp-menu-wrapper {
        display: none;
    }
    .stp-header-brand {
        height: 6rem;
    }
    .stp-header-logo img {
        height: 7rem;
        max-width: calc(100vw - 6rem);
        object-fit: contain;
        object-position: left top;
    }
    /* Native Gantry offcanvas toggle sits at the right of the header, as in the reference */
    html body #g-page-surround > .g-offcanvas-toggle {
        left: auto;
        right: 1rem;
        top: 1.375rem;
        display: grid;
        place-items: center;
        width: 2.75rem;
        height: 2.75rem;
        color: var(--default-white);
        font-size: 1.5rem;
    }

    /* Hero */
    html body.site-home #g-slideshow > .g-container > .g-grid {
        flex-direction: column;
    }
    html body.site-home #g-slideshow .stp-hero-video-block,
    html body.site-home #g-slideshow .stp-mass-times-block {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
    }
    .stp-hero-video {
        height: var(--slideshow-height-mobile, 50vh);
    }
    .stp-mass-times {
        max-height: none;
    }

    /* Mission */
    html body.site-home #g-header > .g-container {
        padding: 3.5rem 1rem !important;
    }
    .stp-mission .stp-mission-statement {
        font-size: 1.25rem;
    }

    /* Main row stacks: Facebook, News, sponsors */
    html body.site-home #g-container-main > .g-container {
        padding: 0 1rem !important;
    }
    html body.site-home #g-container-main > .g-container > .g-grid {
        flex-direction: column;
        gap: 2rem;
    }
    html body.site-home :is(#g-sidebar, #g-mainbar, #g-aside) {
        padding: 0;
    }
    html body.site-home #g-container-main > .g-container > .g-grid > .g-block {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
    }
    .stp-news-header .g-title {
        font-size: 1.5rem;
        white-space: nowrap;
    }

    /* Calendar */
    html body.site-home #g-expanded {
        background-attachment: scroll;
    }
    html body.site-home #g-expanded > .g-container {
        padding: 4rem 1rem 7rem !important;
    }
    .stp-calendar-widget .s-widget-title .g-title {
        font-size: 1.5rem;
    }
    .stp-calendar-feed .gcaltohtml {
        justify-content: flex-start;
    }

    /* Quicklinks */
    .stp-quicklinks .g-blockcontent-subcontent {
        grid-template-columns: minmax(0, 1fr);
        max-width: 22rem;
        margin: 0 auto;
    }

    /* Footer */
    .stp-footer {
        grid-template-columns: minmax(0, 1fr);
        gap: 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .stp-news-block .g-array-item-image img,
    .stp-quicklinks .g-blockcontent-subcontent-block-content,
    .stp-quicklinks .g-blockcontent-subcontent-img,
    .stp-menu-wrapper .g-main-nav .g-toplevel > li > .g-menu-item-container,
    .stp-news-header .button.stp-view-all,
    .stp-calendar-widget .button.stp-calendar-button {
        transition: none;
    }
    .stp-quicklinks .g-blockcontent-subcontent-block-content:hover,
    .stp-news-block .g-array-item:hover .g-array-item-image img,
    .stp-quicklinks .g-blockcontent-subcontent-block-content:hover .g-blockcontent-subcontent-img {
        transform: none;
    }
}

/************ MOBILE MENU (saved Emaus drawer, adapted: St. Paul logo, orange accents, /home-st) ************/
@media only screen and (max-width: 50.99rem) {
    /* Safari browser tint and overscroll use the page canvas background. */
    @media (display-mode: browser) {
        body.site,
        body.site #g-page-surround {
            background-color: var(--primary-color);
        }
    }
    body #g-offcanvas {
        box-sizing: border-box;
        top: 0;
        bottom: 0;
        width: min(21rem, calc(100vw - 4.5rem));
        height: 100%;
        height: 100dvh;
        padding: 0 0 calc(1.25rem + env(safe-area-inset-bottom, 0px));
        background: linear-gradient(160deg, rgba(var(--default-white-rgb), .055), transparent 60%), var(--primary-color);
        border: 0;
        border-right: 1px solid rgba(var(--default-white-rgb), .12);
        box-shadow: .75rem 0 2rem rgba(var(--default-black-rgb), .25);
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: rgba(var(--default-white-rgb), .2) transparent;
    }
    .g-offcanvas-open body.g-offcanvas-left #g-page-surround {
        left: 0 !important;
        transform: translate3d(min(21rem, calc(100vw - 4.5rem)), 0, 0) !important;
    }
    body #g-offcanvas::before {
        content: '';
        position: static;
        display: block;
        height: 3.5rem;
        margin: 1.25rem 1.25rem .75rem;
        background: url('/images/pub/redesign-2026/logo-header-white.png') left center / auto 3.5rem no-repeat;
    }
    body #g-offcanvas > .g-grid > .g-block > .g-content {
        margin: 0;
        padding: 0;
    }
    body #g-offcanvas #g-mobilemenu-container {
        margin: 0;
        font-family: var(--body-font-family);
        font-weight: 500;
    }
    body #g-offcanvas #g-mobilemenu-container .g-toplevel {
        padding: .25rem 1rem 1rem !important;
    }
    body #g-offcanvas #g-mobilemenu-container .g-toplevel > li:not(li:last-child),
    body #g-offcanvas #g-mobilemenu-container .g-sublevel > li {
        border: 0;
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li > .g-menu-item-container {
        box-sizing: border-box;
        display: flex;
        align-items: center;
        min-height: 3.25rem;
        margin: 0 0 .5rem;
        padding: .875rem 1rem;
        border: 1px solid transparent;
        border-radius: 1rem;
        background: rgba(var(--default-white-rgb), .035);
        color: var(--default-white);
        font: 500 1rem/1.4 var(--body-font-family);
        letter-spacing: normal;
        transition: background-color .2s ease, border-color .2s ease, transform .25s ease;
    }
    body #g-offcanvas #g-mobilemenu-container .g-toplevel li > .g-menu-item-container > .g-menu-item-content {
        min-width: 0;
        padding: 0;
        color: inherit;
        line-height: 1.4;
        word-break: normal;
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li > .g-menu-item-container .g-menu-item-content > .g-menu-item-title {
        color: inherit;
        font-size: 1rem;
        font-weight: 500;
        line-height: 1.4;
    }
    body #g-offcanvas #g-mobilemenu-container .g-parent > .g-menu-item-container {
        padding-right: 3.5rem;
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li:hover,
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li.active,
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li.g-selected {
        background: transparent;
    }
    body #g-offcanvas #g-mobilemenu-container .g-slide-out > li > .g-menu-item-container {
        opacity: 0;
        pointer-events: none;
    }
    body #g-offcanvas #g-mobilemenu-container li.active > .g-menu-item-container,
    body #g-offcanvas #g-mobilemenu-container li.g-selected > .g-menu-item-container {
        background: rgba(var(--secondary-color-rgb), .18);
        border-color: rgba(var(--secondary-color-rgb), .45);
        color: var(--secondary-color);
    }
    body #g-offcanvas #g-mobilemenu-container .g-menu-item-container:hover {
        background: rgba(var(--default-white-rgb), .09);
        border-color: rgba(var(--default-white-rgb), .16);
    }
    body #g-offcanvas #g-mobilemenu-container .g-menu-item-container:focus-visible,
    body #g-offcanvas .g-social a:focus-visible {
        outline: 2px solid var(--secondary-color);
        outline-offset: 2px;
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li.g-parent > .g-menu-item-container > .g-menu-parent-indicator {
        position: absolute;
        display: grid;
        place-items: center;
        top: 50%;
        right: .5rem;
        width: 2.75rem;
        height: 2.75rem;
        margin: 0;
        padding: 0;
        transform: translateY(-50%);
        border: 0;
        border-radius: .75rem;
        background: rgba(var(--default-white-rgb), .065);
        color: inherit;
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li.g-parent > .g-menu-item-container > .g-menu-parent-indicator:hover {
        background: rgba(var(--default-white-rgb), .12);
        color: var(--default-white);
    }
    body #g-offcanvas #g-mobilemenu-container .g-toplevel > li > .g-menu-item-container .g-menu-parent-indicator::after {
        width: auto;
        color: inherit;
        font-size: .875rem;
    }
    body #g-offcanvas #g-mobilemenu-container .g-toplevel .g-dropdown {
        background: var(--primary-color);
        border: 0;
        transition: transform .25s ease;
    }
    body #g-offcanvas #g-mobilemenu-container ul .g-dropdown-column {
        width: 100%;
    }
    body #g-offcanvas #g-mobilemenu-container .g-sublevel {
        padding: .25rem 1rem 1rem !important;
    }
    body #g-offcanvas #g-mobilemenu-container .g-sublevel > .g-go-back > .g-menu-item-container {
        margin-bottom: 1rem;
        background: transparent;
        border-color: rgba(var(--default-white-rgb), .16);
        color: var(--secondary-color);
    }
    body #g-offcanvas #g-mobilemenu-container :is(.g-toplevel, .g-sublevel) > li > .g-menu-item-container:has(.g-social) {
        width: fit-content;
        min-height: 0;
        margin-top: .875rem;
        padding: 0;
        border: 0;
        background: transparent;
    }
    body #g-offcanvas .g-social .g-social-items a {
        display: grid;
        place-items: center;
        width: 3rem;
        height: 3rem;
        margin: 0;
        padding: 0;
        border: 1px solid rgba(var(--default-white-rgb), .16);
        border-radius: 50%;
        background: var(--secondary-color);
        color: var(--default-white);
        font-size: 1.25rem;
    }
    body #g-offcanvas .g-social .g-social-items a span {
        margin: 0;
    }
    body .g-offcanvas-toggle {
        width: 2.75rem;
        height: 2.75rem;
        background: rgba(var(--default-white-rgb), .08);
        color: var(--default-white);
        border: 1px solid rgba(var(--default-white-rgb), .16);
        border-radius: .875rem;
        box-shadow: none;
    }
    .g-offcanvas-open body #g-mobile-fixed-nav {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
    .g-offcanvas-open body #g-mobile-fixed-nav * {
        pointer-events: none !important;
    }
    @media (prefers-reduced-motion: reduce) {
        body #g-offcanvas #g-mobilemenu-container .g-menu-item-container,
        body #g-offcanvas #g-mobilemenu-container .g-toplevel .g-dropdown {
            transition: none;
        }
    }
}

/************ PWA GLASS QUICKLINKS ************/
#g-mobile-fixed-nav .pwa-quicklinks-toggle[hidden] {
    display: none;
}
@media only screen and (max-width: 50.99rem) and (display-mode: standalone) {
    body #g-mobile-fixed-nav {
        box-sizing: border-box;
        position: fixed;
        left: .75rem;
        right: .75rem;
        bottom: calc(.75rem + env(safe-area-inset-bottom, 0px));
        width: auto;
        max-width: 34rem;
        height: auto;
        margin: 0 auto;
        padding: .5rem;
        transform: none;
        background: rgba(var(--primary-color-rgb), .94);
        color: var(--default-white);
        border: 1px solid rgba(var(--default-white-rgb), .3);
        border-radius: 2rem;
        box-shadow: 0 .75rem 2rem rgba(var(--default-black-rgb), .28), inset 0 1px 0 rgba(var(--default-white-rgb), .35), inset 0 -1px 0 rgba(var(--default-white-rgb), .08);
        -webkit-backdrop-filter: blur(24px) saturate(160%);
        backdrop-filter: blur(24px) saturate(160%);
    }
    @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
        body #g-mobile-fixed-nav {
            background: linear-gradient(135deg, rgba(var(--default-white-rgb), .16), rgba(var(--default-white-rgb), .025) 55%, rgba(var(--secondary-color-rgb), .1)), rgba(var(--primary-color-rgb), .62);
        }
    }
    #g-mobile-fixed-nav .mobile-fixed-nav {
        height: auto;
        overflow: visible;
    }
    body #g-mobile-fixed-nav.pwa-quicklinks-ready {
        left: auto;
        right: max(.75rem, calc((100% - 34rem) / 2));
        width: min(34rem, calc(100% - 1.5rem));
        height: var(--pwa-dock-height, calc(5rem + 2px));
        margin: 0;
        overflow: hidden;
        transition: width .45s cubic-bezier(.22, 1, .36, 1);
    }
    #g-mobile-fixed-nav.pwa-quicklinks-ready .mobile-fixed-nav {
        position: absolute;
        top: .5rem;
        left: .5rem;
        width: var(--pwa-panel-width, calc(min(34rem, 100vw - 1.5rem) - 1rem - 2px));
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        transition: opacity .22s ease .12s, transform .35s cubic-bezier(.22, 1, .36, 1), visibility 0s;
    }
    body #g-mobile-fixed-nav.is-collapsed {
        width: var(--pwa-dock-height, calc(5rem + 2px));
    }
    #g-mobile-fixed-nav.is-collapsed .mobile-fixed-nav {
        opacity: 0;
        visibility: hidden;
        transform: translateX(1rem);
        pointer-events: none;
        transition-delay: 0s, 0s, .22s;
    }
    #g-mobile-fixed-nav .pwa-quicklinks-toggle {
        box-sizing: border-box;
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: .5rem;
        border: 0;
        border-radius: inherit;
        background: transparent;
        color: var(--default-white);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .2s ease, visibility 0s .2s;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
    #g-mobile-fixed-nav.is-collapsed .pwa-quicklinks-toggle {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition-delay: .12s, 0s;
    }
    body #g-offcanvas {
        top: 40pt;
        height: calc(100% - 40pt);
        height: calc(100dvh - 40pt);
        padding-top: .75rem;
    }
    body #g-offcanvas::before {
        display: none;
    }
    #g-mobile-fixed-nav .pwa-quicklinks-toggle svg {
        fill: currentColor;
    }
    #g-mobile-fixed-nav .pwa-quicklinks-toggle:focus-visible {
        outline: 2px solid var(--secondary-color);
        outline-offset: -5px;
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent {
        gap: .25rem;
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block {
        min-width: 0;
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content {
        box-sizing: border-box;
        position: relative;
        min-height: 4rem;
        gap: .35rem;
        padding: .5rem .125rem;
        background: transparent;
        border: 1px solid transparent;
        border-radius: 1.5rem;
        transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-title-icon {
        color: var(--default-white);
        font-size: 1.25rem;
        line-height: 1;
        text-shadow: 0 1px 4px rgba(var(--default-black-rgb), .25);
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-title,
    #g-mobile-fixed-nav .g-blockcontent-subcontent-title-text {
        margin: 0;
        padding: 0;
        border: 0;
        color: var(--default-white);
        font-family: var(--body-font-family);
        font-size: clamp(.625rem, 2.8vw, .75rem);
        font-weight: 600;
        line-height: 1.25;
        text-transform: none;
        font-variant-caps: normal;
        letter-spacing: normal;
    }
    #g-mobile-fixed-nav .g-blockcontent-buttons,
    #g-mobile-fixed-nav .g-blockcontent-buttons a {
        border-radius: 1.5rem;
    }
    .site-home #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a[href='/home-st']),
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a[aria-current='page']) {
        background: rgba(var(--default-white-rgb), .14);
        border-color: rgba(var(--default-white-rgb), .18);
    }
    .site-home #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a[href='/home-st']) .g-blockcontent-subcontent-title-icon,
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a[aria-current='page']) .g-blockcontent-subcontent-title-icon {
        color: var(--secondary-color);
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:focus-within {
        border-color: var(--secondary-color);
        outline: 2px solid var(--secondary-color);
        outline-offset: 1px;
    }
    #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a:active) {
        background: rgba(var(--default-white-rgb), .2);
        transform: scale(.97);
    }
    body #g-container-footer {
        padding-bottom: calc(6.5rem + env(safe-area-inset-bottom, 0px)) !important;
    }
    @media (hover: hover) and (pointer: fine) {
        #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:hover {
            background: rgba(var(--default-white-rgb), .18);
            border-color: rgba(var(--default-white-rgb), .2);
        }
    }
    @media (prefers-reduced-motion: reduce) {
        body #g-mobile-fixed-nav.pwa-quicklinks-ready,
        #g-mobile-fixed-nav.pwa-quicklinks-ready .mobile-fixed-nav,
        #g-mobile-fixed-nav .pwa-quicklinks-toggle {
            transition: none;
        }
        #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content {
            transition: none;
        }
        #g-mobile-fixed-nav .g-blockcontent-subcontent-block-content:has(a:active) {
            transform: none;
        }
    }
    @media (prefers-reduced-transparency: reduce) {
        body #g-mobile-fixed-nav {
            background: var(--primary-color);
            -webkit-backdrop-filter: none;
            backdrop-filter: none;
        }
    }
}


/************ PWA HEADER LOGO (standalone header from pwa.css) ************/
#g-top-nav .stp-pwa-logo-module {
    display: flex;
    align-items: center;
    height: 100%;
}

#g-top-nav .stp-pwa-logo {
    display: block;
    line-height: 0;
}

#g-top-nav .stp-pwa-logo img {
    display: block;
    width: auto;
    height: 30pt;
    max-width: 60vw;
    object-fit: contain;
}

/************ SMALL TABLET (reference keeps three quicklinks from 40rem) ************/
@media only screen and (min-width: 40rem) and (max-width: 50.99rem) {
    .stp-mission .stp-mission-statement {
        font-size: 2.25rem;
    }
    .stp-quicklinks .g-blockcontent-subcontent {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        max-width: none;
    }
    .stp-quicklinks .g-blockcontent-buttons .button.stp-ql-button {
        font-size: .75rem;
    }
}

/************ AUDIT 2026-10-12 — REFERENCE GEOMETRY ************/
/* The shared withmaxwidth rule consumes this token and otherwise caps the hero. */
.site-home #g-slideshow {
    --site-container-max-width: none;
}
/* Gantry's flush utility sets important zero margins on these exact wrappers. */
.site-home #g-header {
    margin-bottom: 0 !important;
    border-bottom: 4rem solid var(--default-white);
}
.site-home #g-container-main > .g-container {
    margin-bottom: 0 !important;
}
html body.site-home #g-container-main {
    padding-bottom: 6rem !important;
}
html body.site-home #g-extension > .g-container {
    padding: 4rem 1rem !important;
}
/* Preserve the native menu; fit the nine reference labels on one desktop row. */
@media only screen and (min-width: 90.01rem) {
    .stp-site-header {
        gap: 1rem;
    }
    .stp-menu-wrapper .g-main-nav .g-toplevel {
        column-gap: .5rem;
    }
}

/************ LYONS AUDIT 2026-10-14 ************/
html body {
    --stp-audit-accent: #D98026;
}
html body #g-navigation .stp-header-logo img {
    height: 5.75rem;
}
html body #g-navigation .stp-header-brand {
    align-self: center;
    display: flex;
    align-items: center;
}
html body #g-navigation .stp-menu-wrapper {
    padding-right: 1rem;
}
html body #g-navigation.stp-fixed-navigation {
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    z-index: 100;
}
.stp-navigation-spacer {
    height: var(--stp-navigation-height, 6rem);
}
html body #g-page-surround > .g-offcanvas-toggle {
    position: fixed;
    z-index: 101;
}
html body #g-mainbar :is(.item-page, .g-array-item-text) a:not(.button):not(.btn) {
    color: var(--stp-audit-accent);
}
html body #g-mainbar :is(.item-page, .g-array-item-text) a:not(.button):not(.btn):hover,
html body #g-mainbar :is(.item-page, .g-array-item-text) a:not(.button):not(.btn):focus-visible {
    text-decoration: underline;
}
html body #g-mainbar .item-page a.button {
    background: var(--stp-audit-accent);
    color: var(--primary-color);
}
html body #g-mainbar .item-page a.button:hover,
html body #g-mainbar .item-page a.button:focus-visible {
    background: var(--primary-color);
    color: var(--default-white);
}
html body .accordian-wrapper .g-array-item-title::after {
    color: var(--stp-audit-accent);
}
@media only screen and (min-width: 51rem) {
    html body.site-home #g-container-main > .g-container > .g-grid > .g-block:has(> #g-sidebar) {
        flex: 0 0 30%;
        width: 30%;
    }
    html body.site-home #g-container-main > .g-container > .g-grid > .g-block:has(> #g-mainbar) {
        flex: 0 0 45%;
        width: 45%;
    }
}
@media only screen and (max-width: 50.99rem) {
    html body.site-home #g-container-main > .g-container > .g-grid > .g-block:has(> #g-mainbar) {
        order: -1;
    }
    html body .accordian-wrapper-mobile {
        margin: 0 .625rem;
    }
    html body .accordian-wrapper-mobile .g-array-item-title {
        padding: 0 3rem 0 0;
        border-radius: .5rem;
    }
    html body .accordian-wrapper-mobile .g-array-item-title .g-item-title {
        min-width: 0;
        padding: 1rem;
        font-size: 1rem;
        line-height: 1.45;
    }
    html body .accordian-wrapper-mobile .g-array-item-title .g-item-title a {
        font-size: inherit;
        line-height: inherit;
        color: var(--default-white);
        overflow-wrap: anywhere;
    }
    html body .accordian-wrapper-mobile .g-array-item-title::after {
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
        width: 1rem;
    }
    html body .accordian-wrapper-mobile .g-array-item-text {
        padding: 1rem !important;
        line-height: 1.55;
    }
    html body .accordian-wrapper-mobile .g-array-item-title:focus-within {
        outline: 2px solid var(--stp-audit-accent);
        outline-offset: 2px;
    }
    #g-offcanvas .stp-mobile-social {
        display: block;
        padding: 1rem 1.25rem;
    }
    #g-offcanvas .stp-mobile-social .g-social-items {
        display: flex;
        gap: .75rem;
    }
}
@media (display-mode: standalone) and (max-width: 50.99rem) {
    .stp-navigation-spacer {
        display: none;
    }
}

/* Accordion closed panels must retain zero height; padding belongs on their content. */
@media only screen and (max-width: 50.99rem) {
    html body .accordian-wrapper-mobile .g-array-item-text {
        padding: 0 !important;
    }
    html body .accordian-wrapper-mobile .g-array-item-text > * {
        margin: 1rem !important;
    }
    html body .accordian-wrapper-mobile .g-content-array > .g-grid {
        margin: 0;
    }
    html body .accordian-wrapper-mobile .g-content-array > .g-grid > .g-block > .g-content {
        margin: 0 0 1rem !important;
        padding: 0 !important;
    }
    html body .accordian-wrapper-mobile .g-array-item {
        border-radius: .5rem;
        overflow: hidden;
    }
}

/* Studius article accent button and contact form spacing */
body.site-sub #g-mainbar .item-page a.button.button-orange {
    background: #D98026;
    color: #082B60;
}
body.site-sub #g-mainbar .item-page a.button.button-orange:hover,
body.site-sub #g-mainbar .item-page a.button.button-orange:focus-visible {
    background: #082B60;
    color: #fff;
}
body.site-sub #contact-form #contact-control-group {
    clear: both;
    margin-top: 1.5rem;
}
body.site-sub #contact-form .g-recaptcha {
    max-width: 100%;
}

/* TinyMCE Formats can apply the orange link class on its own. */
body.site-sub #g-mainbar .item-page a.button-orange { display:inline-block; background:#D98026; color:#082B60; font-family:var(--body-font-family); font-weight:700; border-radius:.5rem; padding:.75rem 1.125rem; text-decoration:none; }
body.site-sub #g-mainbar .item-page a.button-orange:hover, body.site-sub #g-mainbar .item-page a.button-orange:focus-visible { background:#082B60; color:#fff; }