/*
 * Nickel & Oak Lounge — theme styles
 *
 * Layout primitives come from YOOtheme/UIkit (uk-container, uk-grid, uk-section).
 * Visual treatments live here under .nol-*. Tokens are CSS custom properties so
 * a future palette/typography refresh is one file.
 *
 * Color values are eyeballed from JPG comps. Replace with Zach's exact palette
 * when delivered.
 */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Open+Sans:wght@400;500;600;700&display=swap');
/* FLAG: Gotham substitute (Montserrat) pending license resolution */
/* Force border-box for all NOL elements so height/max-height include padding */
.nol-body, .nol-body *, .nol-body *::before, .nol-body *::after { box-sizing: border-box; }

@font-face {
    font-family: 'Labor Union';
    src: url('../fonts/LaborUnion-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ----------------------------------------------------------------------
 * Tokens
 * ---------------------------------------------------------------------- */
:root {
    /* Brand colors from /Users/michael/Projects/nol/DESIGN.md */
    --nol-blue-900: #002B51;
    --nol-teal-800: #005967;
    --nol-blue-700: #013A65;
    --nol-burgundy-800: #871725;
    --nol-red-500: #E55042;
    --nol-gold-500: #F6B03A;
    --nol-cream-100: #F0E9CE;
    --nol-white: #FFFFFF;
    --nol-ink: #161616;
    --nol-muted: #5E5A52;
    --nol-border-dark: rgba(0,43,81,0.22);
    --nol-border-light: rgba(240,233,206,0.28);

    /* Recurring off-palette hexes, tokenized in place (values unchanged). */
    --nol-shell-peach: #F5E3C6;
    --nol-red-600: #c94438;
    --nol-gold-pale: #F8D99B;
    --nol-cta-maroon: #6f100b;
    --nol-featurette-navy: #18224f;
    --nol-footer-navy: #20264a;

    /* Compatibility aliases for the NOL builder module selectors. */
    --nol-navy: var(--nol-blue-900);
    --nol-navy-deep: #001f3b;
    --nol-mustard: var(--nol-gold-500);
    --nol-mustard-dk: #D89416;
    --nol-cream: var(--nol-cream-100);
    --nol-cream-soft: #F6F0D8;
    --nol-burgundy: var(--nol-burgundy-800);
    --nol-text: var(--nol-blue-900);
    --nol-teal: var(--nol-teal-800);
    --nol-blue-deep: var(--nol-blue-700);
    --nol-text-muted: rgba(22, 22, 22, 0.72);
    --nol-on-navy: var(--nol-cream-100);
    --nol-on-mustard: var(--nol-blue-900);
    --nol-border: var(--nol-border-dark);

    /* Typography */
    --nol-font-display: 'Labor Union', Impact, Haettenschweiler, 'Arial Narrow', sans-serif;
    --nol-font-support: 'Montserrat', Arial, sans-serif;
    --nol-font-body: 'Montserrat', Arial, sans-serif; /* per Michael 2026-07-06: Montserrat everywhere the display font isn't, until changed */

    /* Type scale from DESIGN.md */
    --nol-display: clamp(48px, 8vw, 112px);
    --nol-h1: clamp(40px, 6vw, 76px);
    --nol-h2: clamp(30px, 4vw, 52px);
    --nol-h3: clamp(22px, 2.4vw, 32px);
    --nol-h4: 24px;
    --nol-body-lg: 18px;
    --nol-body: 16px;
    --nol-small: 14px;
    --nol-eyebrow: 12px;

    /* Spacing tokens, 4px grid */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-14: 56px;
    --space-18: 72px;
    --space-24: 96px;
    --space-32: 128px;

    --nol-pad-section-sm: clamp(var(--space-10), 5vw, var(--space-14));
    --nol-pad-section-md: clamp(var(--space-14), 7vw, var(--space-24));
    --nol-pad-section-lg: clamp(var(--space-18), 9vw, var(--space-32));
    --nol-gap-sm: var(--space-3);
    --nol-gap-md: var(--space-6);
    --nol-gap-lg: var(--space-10);

    /* Other */
    --nol-radius: 0;
    --nol-border-gold: 4px solid var(--nol-gold-500);
}

/* ----------------------------------------------------------------------
 * Base typography
 * ---------------------------------------------------------------------- */
.nol-display {
    font-family: var(--nol-font-display);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--nol-text);
}

.nol-h1 { font-size: var(--nol-h1); }
.nol-h2 { font-size: var(--nol-h2); letter-spacing: 0.01em; }
.nol-h3 { font-size: var(--nol-h3); }
.nol-h4 { font-size: var(--nol-h4); }

.nol-body {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    line-height: 1.4;
    color: var(--nol-text);
}

/* Rich-text body output from YOOtheme `editor` fields. The editor emits its own
   <p>/<ul>/<a>, so typography is keyed to the container's children rather than a
   single .nol-body paragraph. Base values mirror .nol-body exactly; per-element
   __body classes (defined later in this file) override color/margin/max-width. */
.nol-rich {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    line-height: 1.4;
    color: var(--nol-text);
}
.nol-rich p { margin: 0 0 1em; }
/* WYSIWYG headings inside rich text use the support face (per Michael:
   the display font was leaking into content headings) and scale sanely. */
.nol-rich h1, .nol-rich h2, .nol-rich h3, .nol-rich h4, .nol-rich h5, .nol-rich h6 {
    font-family: var(--nol-font-support);
    font-weight: 600;
    line-height: 1.18;
    letter-spacing: 0.01em;
    color: inherit;
    margin: 1.35em 0 0.5em;
}
.nol-rich h1 { font-size: clamp(1.8rem, 2.6vw, 2.3rem); }
.nol-rich h2 { font-size: clamp(1.55rem, 2.2vw, 1.95rem); }
.nol-rich h3 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); }
.nol-rich h4 { font-size: 1.15rem; }
.nol-rich h1:first-child, .nol-rich h2:first-child, .nol-rich h3:first-child { margin-top: 0; }
.nol-rich > :last-child { margin-bottom: 0; }
.nol-rich a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}
.nol-rich a:hover { text-decoration: none; }
.nol-rich strong, .nol-rich b { font-weight: 600; }
.nol-rich em, .nol-rich i { font-style: italic; }
.nol-rich ul, .nol-rich ol { margin: 0 0 1em; padding-left: 1.25em; }
.nol-rich ul { list-style: disc; }
.nol-rich ol { list-style: decimal; }
.nol-rich li { margin: 0 0 0.3em; }

.nol-eyebrow {
    font-family: var(--nol-font-display);
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--nol-text-muted);
    margin: 0 0 0.4rem;
}

.nol-text-on-dark {
    color: var(--nol-white);
}

.nol-text-on-dark .nol-eyebrow {
    color: rgba(255, 255, 255, 0.75);
}

/* ----------------------------------------------------------------------
 * Buttons
 * ---------------------------------------------------------------------- */
.nol-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--nol-font-support);
    font-size: 1.2rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    /* Slightly less bottom padding pulls the all-caps label down to optical center
       (caps leave empty descender space below them). */
    padding: 0.6rem 1rem 0.42rem;
    min-width: 182px;
    text-align: center;
    border: 2px solid transparent;
    border-radius: var(--nol-radius);
    text-decoration: none;
    cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
    line-height: 1.1;
}
/* Never underline button text (overrides any parent-theme a:hover underline). */
.nol-button:hover,
.nol-button:focus { text-decoration: none; }

.nol-button--primary {
    background-color: var(--nol-gold-500);
    color: var(--nol-on-mustard);
    border-color: var(--nol-gold-500);
}
.nol-button--primary:hover {
    background-color: var(--nol-mustard-dk);
    border-color: var(--nol-mustard-dk);
    color: var(--nol-on-mustard);
}

.nol-button--dark {
    background-color: var(--nol-blue-900);
    color: var(--nol-gold-500);
    border-color: var(--nol-blue-900);
}
.nol-button--dark:hover {
    background-color: var(--nol-navy-deep);
    border-color: var(--nol-navy-deep);
    color: var(--nol-gold-500);
}

.nol-button--outline {
    background-color: transparent;
    color: var(--nol-blue-900);
    border-color: var(--nol-blue-900);
}
.nol-button--outline:hover {
    background-color: var(--nol-blue-900);
    color: var(--nol-on-navy);
}

/* Real coral modifier — replaces the body.home !important brute-forcing that
   previously forced .nol-button--primary (mustard) to coral for the hero and
   stage CTAs. Base .nol-button--primary stays mustard per DESIGN.md (gold is
   a highlight, never a primary button field); use this class wherever a CTA
   needs the red-orange primary-CTA color instead. */
.nol-button--coral {
    background-color: var(--nol-red-500);
    border-color: var(--nol-red-500);
    color: var(--nol-white);
}
.nol-button--coral:hover {
    background-color: var(--nol-red-600);
    border-color: var(--nol-red-600);
    color: var(--nol-white);
}

/* ----------------------------------------------------------------------
 * Section backgrounds
 * ---------------------------------------------------------------------- */
.nol-section            { padding: var(--nol-pad-section-md) 0; }
.nol-section--sm        { padding: var(--nol-pad-section-sm) 0; }
.nol-section--lg        { padding: var(--nol-pad-section-lg) 0; }
.nol-section--no-pad    { padding: 0; }

/* Force our top-level page-block sections to true full-viewport width,
   escaping any YOOtheme uk-container / uk-grid column padding wrappers. */
.nol-hero,
.nol-split-section,
.nol-section,
.nol-newsletter,
.nol-full-bleed-image,
.nol-contact-cta,
.nol-featurette-yellow,
.nol-featurette-yellow-panel,
.nol-wide-image,
.nol-menu-intro,
.nol-menu-image-embed,
.nol-spacer,
.nol-map-embed {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: none;
}

/* Section anchor — invisible target for #anchor links, with scroll offset for
   the fixed header so the section's content (not the header overlap) lands at
   the top of the viewport. Paired with the optional "Section ID / Anchor"
   field on every block; see inc/section-hooks.php. */
.nol-anchor {
    display: block;
    position: relative;
    top: -90px;       /* approx header height; tweak in tandem with header */
    height: 0;
    visibility: hidden;
}

/* Kill YOOtheme's uk-section / uk-row / uk-column padding around our blocks.
   Each YOOtheme section here is just a transparent wrapper — our nol-* block
   inside controls all spacing. */
.uk-section.uk-section-remove-vertical,
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-hero),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-split-section),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-section),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-full-bleed-image),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-contact-cta),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > [class*="nol-featurette"]),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > [class*="nol-wide-image"]),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > [class*="nol-menu"]),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-spacer),
.uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-map-embed) {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* The uk-grid row container around our blocks shouldn't add top margin either. */
.uk-section .uk-grid.uk-margin {
    margin-top: 0 !important;
}

.nol-bg-white   { background-color: var(--nol-white); }
.nol-bg-cream   { background-color: var(--nol-cream-100); }
.nol-bg-cream-soft { background-color: var(--nol-cream-soft); }
.nol-bg-mustard { background-color: var(--nol-gold-500); }
.nol-bg-navy    { background-color: var(--nol-blue-900); color: var(--nol-on-navy); }
.nol-bg-blue-deep { background-color: var(--nol-blue-deep); color: var(--nol-white); }

/* Per-block "Hide on mobile" toggle (set in a block's Layout/Style tab). The
   class is emitted on the section; we hide the whole YOOtheme section wrapper
   so it leaves no empty band. */
@media (max-width: 768px) {
    .nol-hide-mobile,
    .uk-section:has(> .uk-container > .uk-grid > .uk-width-1-1 > .nol-hide-mobile) {
        display: none !important;
    }
}

/* Spacer — pure vertical gap, optionally carrying a band color. */
.nol-spacer      { height: 4rem; }
.nol-spacer--sm  { height: 2rem; }
.nol-spacer--lg  { height: 6rem; }
.nol-spacer--xl  { height: 9rem; }

/* ----------------------------------------------------------------------
 * Image treatments
 * ---------------------------------------------------------------------- */
.nol-img {
    display: block;
    max-width: 100%;
    height: auto;
}

.nol-img--border-gold {
    border: var(--nol-border-gold);
}

.nol-img--cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ----------------------------------------------------------------------
 * Featurette common (used by featurette_white, featurette_yellow, featurette_yellow_panel)
 * ---------------------------------------------------------------------- */
.nol-featurette {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--nol-gap-md);
    align-items: center;
}

@media (min-width: 768px) {
    .nol-featurette { grid-template-columns: 1fr 1fr; }
    .nol-featurette--reverse > .nol-featurette__media { order: -1; }
}

.nol-featurette__copy {
    padding: var(--nol-gap-md) 0;
}

.nol-featurette__copy .nol-h2,
.nol-featurette__copy .nol-h3 {
    margin: 0 0 var(--nol-gap-md);
}

.nol-featurette__copy .nol-rich {
    margin: 0 0 var(--nol-gap-lg);
}

/* White featurettes (Home: Food & Drink, Host Your Event): smaller headline +
   tighter pairing with the eyebrow that follows it. */
.nol-section.nol-bg-white .nol-featurette__copy .nol-h2 {
    font-size: clamp(1.5rem, 2.6vw, 2rem);
    margin: 0 0 0.35rem;
}
.nol-section.nol-bg-white .nol-featurette__copy .nol-eyebrow {
    margin: 0 0 0.4rem;
}

/* White featurette image is set inside a patterned "frame box": a light-yellow
   pad carrying the gold line-art tile, the photo inset on top so the pattern
   reads as a decorative border around it. Replaces the old solid gold border. */
.nol-section.nol-bg-white .nol-featurette__media,
.nol-featurette__media--frame {
    position: relative;
    padding: 22px;
    background-color: var(--nol-cream-100);
}
.nol-section.nol-bg-white .nol-featurette__media::before,
.nol-featurette__media--frame::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('../images/patterns/pattern-blue.png');
    background-repeat: repeat;
    background-position: center;
    background-size: 200px auto;
    opacity: 0.6;
    pointer-events: none;
}
/* Gold pattern frame option (Open variant, frame_pattern = Gold). */
.nol-featurette__media--frame-gold::before {
    background-image: url('../images/patterns/pattern-gold.png');
}
.nol-section.nol-bg-white .nol-featurette__media img,
.nol-featurette__media--frame img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
    /* the frame supplies the border; drop any per-image gold border */
    border: 0;
}

.nol-featurette__copy--centered {
    text-align: center;
}

.nol-featurette__copy--centered > * {
    margin-left: auto;
    margin-right: auto;
    max-width: 32rem;
}
/* Button: a centered block so it lines up with the centered text above it
   (an inline-flex button doesn't reliably center under centered copy). */
.nol-featurette__copy--centered .nol-button {
    display: flex;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
/* Stage section CTA button: sizing only — coral now comes from .nol-button--coral */
body.home .nol-featurette-white-1 .nol-button--primary {
    padding: 0.75rem 3rem !important;
    font-size: 1.1rem !important;
    align-self: flex-start !important;
}

.nol-featurette__copy--panel {
    background-color: var(--nol-white);
    padding: var(--nol-pad-section-sm) var(--nol-gap-lg);
}

/* ----------------------------------------------------------------------
 * Containers
 * ---------------------------------------------------------------------- */
.nol-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.nol-container--narrow {
    max-width: 720px;
}

.nol-container--wide {
    max-width: 1480px;
}

/* ----------------------------------------------------------------------
 * Reset for body when child theme overrides parent header
 * ---------------------------------------------------------------------- */
body.nol-body {
    margin: 0;
    font-family: var(--nol-font-body);
    color: var(--nol-text);
    background: var(--nol-white);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

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

.nol-skip-link {
    position: absolute; left: -9999px;
    background: var(--nol-gold-500); color: var(--nol-blue-900);
    padding: 0.5rem 1rem;
    text-decoration: none; font-weight: 600;
    z-index: 9999;
}
.nol-skip-link:focus { left: 1rem; top: 1rem; }

.nol-main { display: block; }

/* ----------------------------------------------------------------------
 * Header — single bar, logo left spans both rows, utility top-right, nav below
 * ---------------------------------------------------------------------- */
.nol-header {
    background-color: var(--nol-blue-900);
    color: var(--nol-white);
    position: static;
    z-index: 100;
}

/* Homepage: header overlays the hero gradient (transparent, absolute). */
body.home .nol-header {
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
body.home .nol-main { padding-top: 0; }

/* Top hat — MOBILE ONLY. Hidden on desktop, where the utility lives in the
   header inner (top-right) exactly as before. Shown ≤900px so Hours & Location
   + social stay locked to the top on one line instead of dropping below logo. */
.nol-header__tophat { display: none; }
.nol-header__tophat-inner {
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Zach 7/8 correction: address right-aligns while resizing */
    text-align: right;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 1rem;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}
.nol-header__tophat .nol-header__social a { width: 22px; height: 22px; }
.nol-header__tophat .nol-header__social svg { width: 22px !important; height: 22px !important; }

/* Desktop header (original): logo left spans both rows, utility top-right,
   nav below the utility. */
.nol-header__inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 1.5rem;
    row-gap: 0.25rem;
    align-items: center;
    padding: 2rem 0 0.75rem;
}

.nol-header__logo {
    grid-row: 1 / span 2;
    grid-column: 1;
    align-self: center;
    color: inherit;
    text-decoration: none;
    display: block;
}
.nol-header__logo img {
    display: block;
    /* Scales down a touch on narrower desktops so the nav never overflows onto
       the logo in the ~1025–1050px transition zone above the hamburger. */
    height: clamp(82px, 7.5vw, 110px);
    width: auto;
}

.nol-header__utility {
    grid-row: 1;
    grid-column: 2 / span 2;
    justify-self: end;
    align-self: end;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.5rem;
    margin: 0;
    padding: 0;
}

.nol-header__utility-link {
    /* Flex-center at ALL widths so the map pin never baseline-hangs -
       this link renders in both the mobile tophat and the desktop utility. */
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    line-height: 1;
    color: var(--nol-gold-500);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 500;
    font-family: var(--nol-font-display);
    font-size: 0.95rem;
    white-space: nowrap;
}
.nol-header__utility-link:hover { color: var(--nol-white); }

.nol-header__social {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin: 0;
    padding: 0;
}
.nol-header__social li { list-style: none; margin: 0; padding: 0; }
.nol-header__social a {
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
}
.nol-header__social svg { width: 47px !important; height: 47px !important; }
.nol-header__social a:hover { color: var(--nol-gold-500); }

.nol-header__nav-toggle {
    display: none;
    background: none;
    border: 0;
    width: 36px;
    height: 36px;
    cursor: pointer;
    padding: 0;
    color: inherit;
    grid-row: 1 / span 2;
    grid-column: 3;
    align-self: center;
}
.nol-header__nav-toggle-bar {
    display: block;
    width: 22px;
    height: 2px;
    background: currentColor;
    margin: 5px auto;
}

/* Close (X) button lives inside the nav overlay — hidden until the mobile
   overlay is shown. Scroll is locked on the body while the menu is open. */
.nol-header__nav-close { display: none; }
body.nol-nav-open { overflow: hidden; }

.nol-header__nav {
    grid-row: 2;
    grid-column: 2 / span 2;
    justify-self: end;
    align-self: start;
    padding: 0;
    margin: 0;
}

.nol-nav {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: clamp(0.85rem, 1.5vw, 1.75rem);
    list-style: none;
    margin: 0;
    padding: 0;
}

.nol-nav__item { list-style: none; }
.nol-nav .menu-item a,
.nol-nav__link {
    color: var(--nol-white);
    position: relative;
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    /* Scales down as the desktop viewport narrows so items always fit one line. */
    font-size: clamp(0.78rem, 1vw, 0.9rem);
    font-weight: 500;
    font-family: var(--nol-font-display);
    white-space: nowrap;
    padding: 0.25rem 0;
    border-bottom: 0;
    transition: color 180ms ease;
}
.nol-nav > .menu-item > a::after,
.nol-nav > .nol-nav__item > .nol-nav__link::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.24rem;
    height: 3px;
    background: var(--nol-gold-500);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 220ms ease;
}
.nol-nav .sub-menu a::after {
    display: none;
}
.nol-nav .menu-item a:hover,
.nol-nav .menu-item.current-menu-item a,
.nol-nav__link:hover,
.nol-nav__link.is-active {
    color: var(--nol-gold-500);
}
.nol-nav > .menu-item:hover > a::after,
.nol-nav > .menu-item:focus-within > a::after,
.nol-nav > .menu-item.current-menu-item > a::after,
.nol-nav > .nol-nav__item:hover > .nol-nav__link::after,
.nol-nav > .nol-nav__item:focus-within > .nol-nav__link::after,
.nol-nav > .nol-nav__item > .nol-nav__link.is-active::after {
    transform: scaleX(1);
}

.nol-nav .menu-item-has-children {
    position: relative;
}

.nol-nav .sub-menu {
    position: absolute;
    top: calc(100% + 0.6rem);
    left: 0;
    z-index: 20;
    display: none;
    min-width: 250px;
    margin: 0;
    padding: 1.25rem 0;
    list-style: none;
    background: var(--nol-white);
    border-top: 6px solid var(--nol-gold-500);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.18);
}

.nol-nav .menu-item-has-children:hover > .sub-menu,
.nol-nav .menu-item-has-children:focus-within > .sub-menu {
    display: block;
}

.nol-nav .sub-menu li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nol-nav .sub-menu a {
    display: block;
    padding: 0.65rem 1.8rem;
    color: var(--nol-blue-900);
    text-decoration: none !important;
    font-family: var(--nol-font-body);
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    border: 0;
}

.nol-nav .sub-menu a:hover,
.nol-nav .sub-menu a:focus {
    color: var(--nol-red-500);
}

/* Bourbon Club is white like the other items; it only goes gold on hover
   (handled by the shared .menu-item a:hover rule above). The PSD showed it gold
   only to demo the hover state. */

@media (max-width: 1024px) {
    /* Switch to the hamburger before the nav would ever wrap. Show the mobile
       top hat; hide the desktop utility; logo left + hamburger right. */
    .nol-header__tophat { display: block; }
    .nol-header__inner .nol-header__utility { display: none; }
    .nol-header__inner { grid-template-columns: 1fr auto; }
    .nol-header__logo { grid-row: 1; grid-column: 1; }
    .nol-header__logo img { height: 76px; }
    .nol-header__nav-toggle { display: block; grid-row: 1; grid-column: 2; }
    /* The overlay is always rendered (full-screen, navy) but faded out and
       non-interactive until .is-open. display can't animate, so we fade
       opacity + visibility instead. */
    .nol-header__nav {
        display: flex;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100vh;
        height: 100dvh;
        z-index: 1000;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: var(--nol-blue-900);
        padding: 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 280ms ease, visibility 0s linear 280ms;
    }
    .nol-header__nav.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity 280ms ease, visibility 0s linear 0s;
    }
    .nol-header__nav-close {
        display: block;
        position: absolute;
        top: 1rem;
        right: 1.25rem;
        background: none;
        border: 0;
        color: var(--nol-white);
        font-size: 2.75rem;
        line-height: 1;
        cursor: pointer;
        padding: 0.25rem 0.6rem;
    }
    .nol-header__nav .nol-nav {
        flex-direction: column;
        align-items: center;
        gap: 1.75rem;
    }
    .nol-header__nav .nol-nav .menu-item a,
    .nol-header__nav .nol-nav__link {
        font-size: 1.4rem;
    }
    .nol-header__nav .nol-nav .sub-menu {
        position: static;
        display: block;
        width: 100%;
        min-width: 0;
        margin: 0.55rem 0 0;
        padding: 0.45rem 0 0 1rem;
        background: transparent;
        border-top: 1px solid rgba(240, 233, 206, 0.32);
        box-shadow: none;
    }
    .nol-header__nav .nol-nav .sub-menu a {
        color: var(--nol-cream-100);
        font-size: 0.92rem;
        line-height: 1.25;
        letter-spacing: 0.08em;
        padding: 0.55rem 0;
    }
}

/* ----------------------------------------------------------------------
 * Footer
 * ---------------------------------------------------------------------- */
.nol-footer {
    position: relative;
    background-color: var(--nol-blue-900);
    color: var(--nol-white);
    padding: var(--nol-pad-section-sm) 0 var(--nol-gap-md);
    font-size: 1rem;
}
/* Navy line-art pattern tiled over the navy field, kept subtle (~40%) so it
   never overwhelms the footer copy. */
.nol-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('../images/patterns/pattern-blue.png');
    background-repeat: repeat;
    background-position: center top;
    background-size: 360px auto;
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}
.nol-footer > .nol-container {
    position: relative;
    z-index: 1;
}

.nol-footer__heading {
    font-family: var(--nol-font-display);
    font-size: clamp(1.3rem, 3.2vw, 1.85rem);
    font-weight: 400; /* per Michael: weight down; display face has no true bold anyway */
    margin: 0 0 0.2rem;
    color: var(--nol-white);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.nol-footer__heading--full {
    margin: 0 0 var(--nol-gap-lg);
    padding-bottom: var(--nol-gap-md);
    border-bottom: 1px solid rgba(255, 255, 255, 1);
}

.nol-footer__label {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: clamp(0.82rem, 2.2vw, 0.95rem);
    font-weight: 500;
    margin: 0 0 0.35rem;
    color: rgba(255, 255, 255, 0.85);
}
.nol-footer__label--mustard { color: var(--nol-gold-500); }

.nol-footer__line {
    margin: 0 0 0.25rem;
    color: var(--nol-white);
    line-height: 1.45;
    font-size: clamp(0.88rem, 2.2vw, 1rem);
}
.nol-footer__line--muted {
    color: rgba(255, 255, 255, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.85rem;
}
.nol-footer__line--accent { color: var(--nol-gold-500); font-size: 0.9rem; margin-top: 0.5rem; }

.nol-footer__address { display: block; text-decoration: none; color: inherit; }
.nol-footer__address .nol-footer__line { display: block; margin: 0 0 0.25rem; }
.nol-footer__address:hover { color: var(--nol-gold-500); }

.nol-footer__group { margin-bottom: var(--nol-gap-sm); }

.nol-footer__top,
.nol-footer__mid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--nol-gap-md);
    padding-bottom: var(--nol-gap-md);
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    margin-bottom: var(--nol-gap-md);
}

.nol-footer__mid { grid-template-columns: 2fr 1fr; padding-top: var(--nol-gap-md); }

.nol-footer__col--mark { display: flex; align-items: center; justify-content: flex-end; }

.nol-footer__wordmark {
    text-decoration: none;
    color: var(--nol-white);
    display: inline-block;
}
.nol-footer__wordmark img {
    display: block;
    /* Scale by width with height auto so it never stretches vertically when a
       global img{max-width:100%} caps the width. */
    width: clamp(180px, 18vw, 240px);
    height: auto;
    max-width: 100%;
}

.nol-footer__tagline {
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 var(--nol-gap-md);
    max-width: 28rem;
    line-height: 1.45;
}

.nol-footer__col--social { text-align: right; }
.nol-footer__col--social .nol-footer__label {
    color: var(--nol-white);
    font-size: 1.05rem;
    margin: 0 0 0.75rem;
}

.nol-footer__social {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin: 0.5rem 0 0;
    padding: 0;
}
.nol-footer__social li { list-style: none; margin: 0; padding: 0; }
.nol-footer__social a {
    color: var(--nol-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
}
.nol-footer__social svg { width: 38px !important; height: 38px !important; }
.nol-footer__social a:hover { color: var(--nol-gold-500); }

.nol-footer__col--social .nol-footer__social {
    justify-content: flex-end;
}

.nol-footer__signup-button {
    margin-top: 0.25rem;
    margin-bottom: var(--nol-gap-md);
}

.nol-footer__monogram {
    text-align: center;
    margin: 2.75rem 0;
}
.nol-footer__monogram-mark {
    display: inline-block;
    height: 150px;
    width: auto;
}

.nol-footer__menu {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--nol-gap-md);
    display: flex;
    justify-content: center;
    /* Tighter vertical gap when the items wrap on mobile; same horizontal gap. */
    gap: 0.4rem 2rem;
    flex-wrap: wrap;
}
.nol-footer__menu a {
    color: var(--nol-gold-500);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: clamp(0.9rem, 2.4vw, 1.1rem);
    font-weight: 500;
    font-family: var(--nol-font-display);
}
.nol-footer__menu a:hover { color: var(--nol-white); }

.nol-footer__legal {
    text-align: center;
    margin-bottom: var(--nol-gap-md);
}
.nol-footer__legal .nol-footer__line { margin: 0; }
/* Address is the larger uppercase line; copyright sits smaller + bolder below. */
.nol-footer__legal-address {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: clamp(0.92rem, 2.6vw, 1.05rem);
    font-weight: 500;
    color: var(--nol-white);
    margin: 0 0 0.35rem;
}
.nol-footer__legal-copy {
    font-size: clamp(0.72rem, 2vw, 0.8rem);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}
.nol-footer__legal-copy a {
    color: inherit;
    text-decoration: none;
}
.nol-footer__legal-copy a:hover {
    color: var(--nol-gold-500);
}
.nol-footer__credit {
    white-space: nowrap;
}

.nol-footer__brands {
    display: flex;
    justify-content: center;
    gap: 3rem;
    padding-top: var(--nol-gap-md);
    border-top: 1px solid rgba(255, 255, 255, 1);
}
/* Each brand breaks onto two lines with a tight line-height: first word gold,
   second word white. */
.nol-footer__brand {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-family: var(--nol-font-display);
    font-size: clamp(0.9rem, 2.6vw, 1.05rem);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 0.92;
}
.nol-footer__brand-word--1 { color: var(--nol-gold-500); }
.nol-footer__brand-word--2 { color: var(--nol-white); }

@media (max-width: 768px) {
    .nol-footer__top,
    .nol-footer__mid { grid-template-columns: 1fr; }
    .nol-footer__col--mark { justify-content: flex-start; }
    .nol-footer__wordmark { align-items: flex-start; }
    .nol-footer__col--social { text-align: left; }
    .nol-footer__col--social .nol-footer__social { justify-content: flex-start; }
    /* Headings + marks already clamp-scale; monogram trimmed on phones. */
    .nol-footer__monogram-mark { height: clamp(96px, 26vw, 150px); }
    /* Sub-brands stack instead of sitting side by side (which overflowed). */
    .nol-footer__brands { flex-direction: column; gap: 1.1rem; }
}


/* ----------------------------------------------------------------------
 * Hero
 * ---------------------------------------------------------------------- */
.nol-hero {
    position: relative;
    overflow: hidden;
    color: var(--nol-white);
    /* Bold diagonal gradient: vivid steel-blue top-left → very dark navy bottom-right */
    background-color: var(--nol-blue-900);
    display: flex;
    align-items: center;
}
.nol-hero--short  { min-height: 56vh; }
.nol-hero--medium { min-height: 72vh; }
.nol-hero--tall   { min-height: 88vh; }

/* Home hero: fixed minimum height per 6/1 review.
   Align content toward bottom to match design comp positioning (~65% down). */
body.home .nol-hero { min-height: 1220px; align-items: flex-end; }
body.home .nol-hero .nol-hero__container { padding-bottom: 1rem; padding-top: 2rem; }

/* Deep-navy background field: pinned to the bottom, full width, overflows the
   top behind everything. Covers the hero so there are never gaps. */
.nol-hero__bg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    z-index: 0;
}
/* Background video: same plane as the navy field, painted above it by DOM
   order so the image acts as poster/fallback underneath. Hidden for users
   who prefer reduced motion (the image shows instead). */
.nol-hero__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
    z-index: 0;
}
@media (prefers-reduced-motion: reduce) {
    .nol-hero__video { display: none; }
}

/* Glass cutout: pinned to the bottom, full width (left:0/right:0), top overflows
   the section behind the copy. Sits on top of the navy field. */
.nol-hero__image {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    /* Cap the glass width so it doesn't balloon on wide desktops; pin it right. */
    /* Scales with the viewport past ~1200px and caps at 1500px so it grows on
       wide desktops but never balloons. Never exceeds the viewport width. */
    background-size: min(100%, clamp(1000px, 82vw, 1500px)) auto;
    background-position: right bottom;
    background-repeat: no-repeat;
    z-index: 1;
}
/* Overlay only needs to guard the copy column on the left, not the vivid glass
   on the right. */
.nol-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    /* Layer 1: left-side darkening for copy readability (horizontal) */
    /* Layer 2: top-to-bottom warm gradient for nav + text legibility (vertical) */
    background:
        linear-gradient(90deg, rgba(10, 8, 5, 0.6) 0%, rgba(10, 8, 5, 0.25) 40%, rgba(10, 8, 5, 0) 60%),
        linear-gradient(180deg, rgba(10, 8, 5, 0.7) 0%, rgba(10, 8, 5, 0.1) 15%, rgba(10, 8, 5, 0) 30%, rgba(10, 8, 5, 0) 55%, rgba(20, 14, 10, 0.25) 80%, rgba(32, 38, 72, 0.5) 100%)
    !important;
}

@media (max-width: 767px) {
    /* Hide the glass cutout on mobile (it was only screened back, not adding much). */
    .nol-hero__image { display: none; }
    .nol-hero__overlay {
        background: linear-gradient(180deg, rgba(10,8,5,0.6) 0%, rgba(10,8,5,0.1) 25%, rgba(10,8,5,0) 50%, rgba(20,14,10,0.3) 85%, rgba(32,38,72,0.5) 100%) !important;
    }
    /* Drop the big top padding so the (absolute) header sits tighter to the top. */
    .nol-header__inner { padding-top: 0.4rem; }
    /* Taller hero so the overlay header and the hero copy never collide. */
    body.home .nol-hero { min-height: 90vh; }
    /* Pin the hero copy to the bottom on mobile (centered on desktop). */
    .nol-hero { align-items: flex-end; }
    .nol-hero__container { padding-top: 2rem; padding-bottom: 2.5rem; }
}
.nol-hero__container {
    position: relative;
    z-index: 3;
    width: 100%;
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.nol-hero__copy {
    max-width: 32rem;
    color: var(--nol-white);
}
.nol-hero--text-center .nol-hero__copy { margin: 0 auto; text-align: center; }
.nol-hero--text-right  .nol-hero__copy { margin-left: auto; text-align: right; }

.nol-hero__headline {
    color: var(--nol-white);
    margin: 0 0 0.4rem;
    font-size: clamp(1.85rem, 3.5vw, 2.75rem);
    line-height: 1;
    letter-spacing: 0.06em;
    font-weight: 600;
}
.nol-hero__subheadline {
    color: var(--nol-white);
    margin: 0 0 0.5rem;
    font-size: clamp(0.95rem, 1.35vw, 1.15rem);
    letter-spacing: 0.06em;
    font-weight: 500;
}
.nol-hero__body {
    color: var(--nol-white);
    opacity: 0.92;
    margin: 0 0 2rem;
    font-size: var(--nol-body);
    line-height: 1.4;
    max-width: 28rem;
    font-family: var(--nol-font-body);
    text-transform: none;
    letter-spacing: normal;
}
.nol-hero--text-center .nol-hero__body { margin-left: auto; margin-right: auto; }
.nol-hero--text-right  .nol-hero__body { margin-left: auto; }

.nol-hero__cta { display: inline-flex; }
body.home .nol-hero .nol-hero__cta.nol-button--primary {
    background-color: var(--nol-red-500);
    border-color: var(--nol-red-500);
    color: var(--nol-white);
    padding: 2.5rem 4rem !important;
    font-size: 1.6rem !important;
    min-width: 700px !important;
    height: 137px !important;
    box-sizing: border-box !important;
    line-height: 1.3 !important;
    margin-top: 4.5rem !important;
    text-align: center !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
    margin-left: 6rem !important;
}
body.home .nol-hero .nol-hero__cta.nol-button--primary:hover {
    background-color: var(--nol-red-600);
    border-color: var(--nol-red-600);
    color: var(--nol-white);
}

/* ----------------------------------------------------------------------
 * Bond Split — full-bleed image + colored panel + spanning title
 * ---------------------------------------------------------------------- */
.nol-split-section {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
    overflow: hidden;
}

.nol-split-section__media {
    grid-column: 1;
    grid-row: 1 / -1;
    background-size: cover;
    background-position: center;
    min-height: 600px;
}

/* Background slab only — the copy lives in __panel-inner, a sibling grid item
   confined to row 2 so it can never rise into the title row above. */
.nol-split-section__panel {
    grid-column: 2;
    grid-row: 1 / -1;
    position: relative;
    overflow: hidden;
}

.nol-split-section--image-right .nol-split-section__media { grid-column: 2; }
.nol-split-section--image-right .nol-split-section__panel,
.nol-split-section--image-right .nol-split-section__panel-inner { grid-column: 1; }

.nol-split-section__panel--mustard { background-color: var(--nol-gold-500); color: var(--nol-on-mustard); }
.nol-split-section__panel--navy    { background-color: var(--nol-blue-900);    color: var(--nol-white); }
.nol-split-section__panel--cream   { background-color: var(--nol-cream-100);   color: var(--nol-text); }

.nol-split-section__media--solid-blue-deep {
    background-color: var(--nol-blue-deep) !important;
    background-image: none !important;
    filter: none !important;
}
.nol-split-section--image-left .nol-split-section__media {
    /* filter: brightness(0.35) contrast(1.1); */
    /* Disabled intentionally: this rule was previously dead (an orphaned
       comment-tail line above swallowed the selector, syntax-invalidating
       the whole rule). Live appearance currently has no darkening filter
       applied here, so the filter is kept commented out to avoid changing
       the live look. Re-enable only with explicit design sign-off. */
}

.nol-split-section__panel-inner--mustard { color: var(--nol-on-mustard); }
.nol-split-section__panel-inner--navy    { color: var(--nol-white); }
.nol-split-section__panel-inner--cream   { color: var(--nol-text); }

/* Gold line-art pattern tiled over the gold panel, kept subtle (~40%) so it
   reads as texture behind the copy, not noise. */
.nol-split-section--pattern .nol-split-section__panel--mustard::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('../images/patterns/pattern-gold.png');
    background-repeat: repeat;
    background-position: center;
    background-size: 340px auto;
    opacity: 1;
    pointer-events: none;
}

.nol-split-section__panel-inner {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-self: center;
    position: relative;
    z-index: 1;
    max-width: 28rem;
    padding: 0 3rem 4rem;
    text-align: center;
}

/* Spanning title overlays the top of the module: it sits in grid row 1, which
   the media + panel backgrounds also span, so its rendered height (whatever
   image or text it holds, at any viewport) always reserves the top zone. The
   40px bottom margin is the guaranteed minimum gap to the panel copy below. */
.nol-split-section__title {
    grid-column: 1 / -1;
    grid-row: 1;
    z-index: 3;
    margin: 2rem 1.5rem 40px;
    color: var(--nol-white);
    font-size: clamp(2.4rem, 7vw, 6rem);
    line-height: 1;
    text-align: center;
    text-shadow: 0 2px 12px rgba(0,0,0,0.55);
    pointer-events: none;
}
/* Logotype version of the spanning title (white wordmark PNG), spanning the
   full module width up to the 1.5rem side margins. Width is relative to the
   grid area, so the side margins must be subtracted to avoid overflow. */
.nol-split-section__title-img {
    display: block;
    width: calc(100% - 3rem);
    height: auto;
    max-width: none;
    filter: drop-shadow(0 2px 12px rgba(0,0,0,0.45));
}

.nol-split-section__subhead {
    margin: 0 0 0.5rem;
    font-size: clamp(1.7rem, 2.5vw, 2.2rem);
    letter-spacing: 0.06em;
    font-weight: 600;
}

.nol-split-section__body {
    margin: 0 0 1.25rem;
}

@media (max-width: 768px) {
    .nol-split-section {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
    }
    .nol-split-section__title {
        grid-column: 1;
        grid-row: 1;
        margin: 1.5rem 1.5rem 1rem;
        color: var(--nol-text);
        text-shadow: none;
    }
    /* Stack: title, photo, panel — regardless of image side. The panel slab
       and its copy share row 3 (slab behind, copy on top). */
    .nol-split-section .nol-split-section__media,
    .nol-split-section .nol-split-section__panel,
    .nol-split-section .nol-split-section__panel-inner { grid-column: 1; }
    .nol-split-section .nol-split-section__media { grid-row: 2; }
    .nol-split-section .nol-split-section__panel { grid-row: 3; }
    .nol-split-section .nol-split-section__panel-inner {
        grid-row: 3;
        align-self: center;
        padding: 2.5rem 1.5rem;
    }
}

/* ----------------------------------------------------------------------
 * Wide Image (cream-band framed image)
 * ---------------------------------------------------------------------- */
.nol-wide-image__media { display: block; line-height: 0; }
.nol-wide-image__media img { display: block; width: 100%; height: auto; }
.nol-wide-image__media--framed img {
    padding: 8px;
    background: var(--nol-white);
    box-shadow: 0 2px 14px rgba(9,32,63,0.08);
}
.nol-wide-image__media--21-9 img { aspect-ratio: 21 / 9; object-fit: cover; }
.nol-wide-image__media--16-9 img { aspect-ratio: 16 / 9; object-fit: cover; }
.nol-wide-image__media--4-3  img { aspect-ratio: 4 / 3;  object-fit: cover; }

/* ----------------------------------------------------------------------
 * Full-Bleed Image (edge-to-edge image)
 * ---------------------------------------------------------------------- */
.nol-full-bleed-image { display: block; line-height: 0; }
.nol-full-bleed-image__img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}
.nol-full-bleed-image--21-9 .nol-full-bleed-image__img { aspect-ratio: 21 / 9; }
.nol-full-bleed-image--16-9 .nol-full-bleed-image__img { aspect-ratio: 16 / 9; }
.nol-full-bleed-image--4-3  .nol-full-bleed-image__img { aspect-ratio: 4 / 3; }

/* On phones, banner images keep a substantial height and crop to fill (cover)
   instead of collapsing to a thin aspect-ratio strip with empty bands around it.
   Ref: header scaling on sorrycharlies.com/history. */
@media (max-width: 768px) {
    .nol-wide-image__media img,
    .nol-full-bleed-image__img {
        aspect-ratio: auto;
        height: clamp(260px, 48vh, 420px);
        object-fit: cover;
    }
    /* Map matches the banner scaling on the other child pages. */
    .nol-map-embed__frame {
        aspect-ratio: auto;
        height: clamp(260px, 48vh, 420px);
    }
}

/* ----------------------------------------------------------------------
 * Featurette — Yellow (Type 3 — mustard bg, text on yellow, image right/left)
 * ---------------------------------------------------------------------- */
.nol-featurette-yellow { color: var(--nol-on-mustard); }
.nol-featurette-yellow__headline { color: var(--nol-on-mustard); margin: 0 0 var(--nol-gap-sm); }
.nol-featurette-yellow__subhead  { color: rgba(9,32,63,0.7); }
.nol-featurette-yellow__body     { color: var(--nol-on-mustard); margin: 0 0 var(--nol-gap-md); }
.nol-featurette-yellow .nol-featurette__media img {
    display: block;
    width: 100%;
    height: auto;
}

/* ----------------------------------------------------------------------
 * Featurette — Yellow + White Panel (Type 2)
 * ---------------------------------------------------------------------- */
.nol-featurette-yellow-panel .nol-featurette__copy--panel {
    color: var(--nol-text);
}
.nol-featurette-yellow-panel .nol-featurette__copy--panel .nol-h2 { margin: 0 0 var(--nol-gap-sm); }

/* Subhead (optional eyebrow between headline and body) */
.nol-featurette-yellow-panel__subhead {
    color: var(--nol-blue-900);
    opacity: 0.7;
    margin: 0 0 var(--nol-gap-md);
}

/* Image frame — subtle cream "postcard" border (panel variant only). */
.nol-featurette-yellow-panel--panel .nol-featurette__media img {
    display: block;
    width: 100%;
    height: auto;
    padding: 8px;
    background: var(--nol-cream-soft);
    box-shadow: 0 2px 16px rgba(9, 32, 63, 0.12);
}
/* Match the standard body style (.nol-body, line-height 1.4) used in Food & Drink. */
.nol-featurette-yellow-panel__body { margin: 0 0 var(--nol-gap-lg); }

/* Open variant (General-Content comp): cream band continuous with the image
   band above, copy sits on the cream with no white panel, smaller title, and
   the image carries the shared patterned frame. */
.nol-featurette-yellow-panel--open .nol-featurette__copy--open {
    padding: var(--nol-gap-md) 0;
    color: var(--nol-text);
}
.nol-featurette-yellow-panel--open .nol-h2 {
    font-size: clamp(1.4rem, 2.8vw, 2.1rem);
    margin: 0 0 var(--nol-gap-md);
}

/* Card variant (Menus portal): each row is a white card pairing a text panel
   with a flush, full-bleed cover image, floating on the beige band with a
   little vertical breathing room between cards. */
.nol-featurette-yellow-panel--card.nol-section {
    padding-top: var(--nol-gap-md);
    padding-bottom: var(--nol-gap-md);
}
.nol-featurette--card {
    gap: 0;
    align-items: stretch;
    background: var(--nol-white);
    box-shadow: 0 2px 18px rgba(9, 32, 63, 0.10);
    overflow: hidden;
}
.nol-featurette--card .nol-featurette__copy--card {
    padding: 3rem 2.85rem 3rem 3.85rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.nol-featurette-yellow-panel--card .nol-h2 {
    margin: 0 0 0.4rem;
    font-size: clamp(1.6rem, 2.4vw, 2.1rem);
}
/* Tighter rhythm: subhead close to the body, body close to the button. */
.nol-featurette-yellow-panel--card .nol-featurette-yellow-panel__subhead {
    margin: 0 0 0.3rem;
}
.nol-featurette-yellow-panel--card .nol-featurette-yellow-panel__body {
    margin: 0 0 1.25rem;
}
/* Button sizes to its content (not full panel width) and sits left. */
.nol-featurette--card .nol-button {
    align-self: flex-start;
}
/* Image is absolutely positioned so it never dictates the card height — the
   text panel sets the height and the photo crops (cover) to fill its half. */
.nol-featurette--card .nol-featurette__media--cover {
    position: relative;
    min-height: 260px;
    overflow: hidden;
}
.nol-featurette--card .nol-featurette__media--cover img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 767px) {
    .nol-featurette--card .nol-featurette__media--cover { min-height: 220px; }
    /* Even padding on phones (vs the desktop asymmetric 3/2.85/3/3.85) + smaller title. */
    .nol-featurette--card .nol-featurette__copy--card { padding: 1.75rem; }
    .nol-featurette-yellow-panel--card .nol-h2 { font-size: 1.4rem; }
}

/* ----------------------------------------------------------------------
 * Menu Intro (cream band title + body intro)
 * ---------------------------------------------------------------------- */
.nol-menu-intro__inner--center { text-align: center; }
.nol-menu-intro__inner--left   { text-align: left; }
.nol-menu-intro h1.nol-display { margin: 0 0 var(--nol-gap-md); }
.nol-menu-intro .nol-rich { margin: 0; }

/* ----------------------------------------------------------------------
 * Menu Image Embed (JPEG of a menu, centered)
 * ---------------------------------------------------------------------- */
/* Single-menu pages: keep the menu image tight under its intro. The intro keeps
   its top padding (header clearance) but its bottom and the menu's vertical
   padding are pulled in so the big menu image doesn't float in empty cream. */
.nol-menu-intro {
    padding-bottom: 1.5rem;
}
.nol-menu-image-embed.nol-section {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

/* Menu card width is editor-controlled (Narrow / Standard / Full); it centers
   in the band regardless. Standard (~900px) is the default. */
.nol-menu-image-embed__media {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    background: var(--nol-white);
    padding: 12px;
    box-shadow: 0 2px 20px rgba(9,32,63,0.10);
}
.nol-menu-image-embed__media--narrow { max-width: 720px; }
.nol-menu-image-embed__media--full   { max-width: 100%; }
.nol-menu-image-embed__media img {
    display: block;
    width: 100%;
    height: auto;
}

/* ----------------------------------------------------------------------
 * Map Embed (Google Maps iframe in cream band)
 * ---------------------------------------------------------------------- */
.nol-map-embed__frame {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: var(--nol-cream-soft);
    box-shadow: 0 2px 14px rgba(9,32,63,0.08);
}
.nol-map-embed__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.nol-map-embed__frame--21-9 { aspect-ratio: 21 / 9; }
.nol-map-embed__frame--16-9 { aspect-ratio: 16 / 9; }
.nol-map-embed__frame--4-3  { aspect-ratio: 4 / 3; }
.nol-map-embed__frame--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1rem;
    color: var(--nol-text-muted);
    font-family: var(--nol-font-body);
}

/* ----------------------------------------------------------------------
 * Contact CTA (mustard band w/ text + button)
 * ---------------------------------------------------------------------- */
.nol-contact-cta__inner {
    display: flex;
    align-items: center;
    gap: var(--nol-gap-md);
}
.nol-contact-cta--inline .nol-contact-cta__inner {
    flex-direction: row;
    justify-content: space-between;
}
.nol-contact-cta--stacked .nol-contact-cta__inner {
    flex-direction: column;
    text-align: center;
}
.nol-contact-cta__copy { flex: 1; }
.nol-contact-cta__headline { margin: 0 0 0.5rem; color: var(--nol-on-mustard); letter-spacing: 0.06em; }
.nol-contact-cta__body     { margin: 0; color: var(--nol-on-mustard); opacity: 0.92; max-width: 36rem; }
.nol-contact-cta__action   { flex-shrink: 0; }

/* Gold line-art tiled across the band (tone-on-tone on the gold bg), copy above it. */
.nol-contact-cta--pattern-overlay { position: relative; }
.nol-contact-cta--pattern-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('../images/patterns/pattern-gold.png');
    background-repeat: repeat;
    background-position: center;
    background-size: 340px auto;
    opacity: 1;
    pointer-events: none;
}
.nol-contact-cta--pattern-overlay > .nol-container { position: relative; z-index: 1; }

/* Send-an-email button: navy with white text per the Contact comp. */
.nol-contact-cta .nol-button--dark,
.nol-contact-cta .nol-button--dark:hover {
    color: var(--nol-white);
}

.nol-bg-navy .nol-contact-cta__headline,
.nol-bg-navy .nol-contact-cta__body { color: var(--nol-white); }
.nol-bg-cream .nol-contact-cta__headline,
.nol-bg-cream .nol-contact-cta__body,
.nol-bg-white .nol-contact-cta__headline,
.nol-bg-white .nol-contact-cta__body { color: var(--nol-text); }

@media (max-width: 768px) {
    /* Always stack + center on mobile (the extra .nol-contact-cta beats the
       --inline rule's specificity); center the button instead of stretching it. */
    .nol-contact-cta .nol-contact-cta__inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1.25rem;
    }
    .nol-contact-cta__action { display: flex; justify-content: center; }
}


/* Bar/split section on homepage — match design comp height (600px) */
body.home .nol-split-section.nol-split-section-1 {
    height: 600px !important;
    min-height: 600px !important;
    overflow: hidden;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__media {
    min-height: 600px !important;
    max-height: 600px !important;
    height: 100% !important;
    background-image: url('../images/home-bar-cocktail.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    filter: brightness(0.7) contrast(1.05) hue-rotate(15deg) saturate(0.7) !important;
    position: relative;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__media::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(135deg, rgba(1,58,101,0.5), rgba(0,32,72,0.45)) !important;
    z-index: 0 !important;
    pointer-events: none !important;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
    font-size: clamp(2.4rem, 7vw, 6rem);
    margin: 2rem 1.5rem 40px;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
    padding: 0 3rem 4rem;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__subhead {
    font-size: clamp(1.7rem, 2.5vw, 2.2rem);
}

/* Force minimum CTA height to match design comp proportions */
/* Events section — matches design comp: deep blue header with gold heading,
   then burgundy for event cards. Constrained to 930px to match design height. */
body.home .nol-featured-events.nol-bg-burgundy {
    background:
        linear-gradient(180deg,
            var(--nol-blue-700) 0%,
            var(--nol-blue-700) 14%,
            var(--nol-blue-900) 18%,
            var(--nol-blue-900) 92%,
            var(--nol-burgundy-800) 97%,
            var(--nol-burgundy-800) 100%
        ) !important;
    height: 930px !important;
    padding: 0 !important;
    overflow: hidden;
}
body.home .nol-featured-events.nol-bg-burgundy > .nol-container {
    max-width: 1480px !important;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 2.5rem;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-featured-events__heading {
    color: var(--nol-gold-500) !important;
    font-size: clamp(1.8rem, 3.5vw, 3rem) !important;
    margin-bottom: 1.25rem;
    flex-shrink: 0;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-featured-events__grid {
    flex: 1;
    align-items: stretch;
    grid-template-rows: 1fr !important;
    gap: 3px !important;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-event-card {
    background: var(--nol-cream-100);
    display: flex;
    flex-direction: column;
    border: none;
    border-radius: 0;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-event-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-event-card__media {
    height: 240px;
    max-height: 240px;
    aspect-ratio: auto;
    overflow: hidden;
    flex-shrink: 0;
}
body.home .nol-featured-events.nol-bg-burgundy .nol-event-card__media img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    filter: sepia(0.5) saturate(1.5) hue-rotate(-20deg) brightness(0.8) contrast(1.15);
}
body.home .nol-featured-events.nol-bg-burgundy .nol-event-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 1rem 1.25rem;
    background: var(--nol-cream-100);
}
body.home .nol-featured-events.nol-bg-burgundy .nol-featured-events__cta {
    flex-shrink: 0;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    text-align: center;
}
/* Events section CTA button: subtle cream outline on burgundy */
body.home .nol-bg-burgundy .nol-featured-events__cta .nol-button--primary {
    background-color: transparent !important;
    color: var(--nol-cream-100) !important;
    border: 1px solid var(--nol-cream-100) !important;
    font-weight: 600;
    padding: 0.5rem 2rem !important;
}

/* CTA section base: the homepage split supplies its own media column, so keep
   this field solid and let split-specific rules control imagery. */
body.home .nol-contact-cta--inline.nol-bg-coral {
    background-color: var(--nol-red-500) !important;
    background-image: none !important;
    position: relative;
    height: 675px !important;
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 0 !important;
}
body.home .nol-contact-cta--inline.nol-bg-coral::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(229, 80, 66, 1.0) 0%,
        rgba(229, 80, 66, 0.92) 25%,
        rgba(229, 80, 66, 0.50) 60%,
        rgba(229, 80, 66, 0.22) 100%
    );
    z-index: 0;
}
body.home .nol-contact-cta--inline.nol-bg-coral > .nol-container {
    position: relative;
    z-index: 1;
    width: 100%;
}
body.home .nol-contact-cta--inline.nol-bg-coral .nol-contact-cta__inner {
    width: 100%;
}

/* ======================================================================
 * Newsletter Band (Behind the Curtain) — T7
 * ====================================================================== */
.nol-newsletter {
    padding: var(--space-8) 0;
    text-align: center;
}
body.home .nol-newsletter.nol-newsletter--mustard,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard {
    height: 190px !important;
    display: flex;
    align-items: center;
    padding: 0 !important;
    overflow: hidden;
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
    padding: 0.5rem 1rem;
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading {
    font-size: 1.4rem;
    margin-bottom: 0.25rem;
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline {
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__form,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__form {
    gap: 0.5rem;
}
.nol-newsletter--mustard { background-color: var(--nol-gold-500); color: var(--nol-on-mustard); }
.nol-newsletter--navy { background-color: var(--nol-blue-900); color: var(--nol-on-navy); }
.nol-newsletter--cream { background-color: var(--nol-cream-100); color: var(--nol-text); }

.nol-newsletter__inner {
    max-width: 640px;
    margin: 0 auto;
    padding: 0 var(--space-6);
}

.nol-newsletter__heading {
    font-size: clamp(1.5rem, 2.2vw, 2rem);
    line-height: 1.2;
    margin-bottom: var(--space-2);
}

.nol-newsletter__tagline {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    line-height: 1.4;
    margin-bottom: var(--space-4);
    opacity: 0.9;
}

.nol-newsletter__form {
    display: flex;
    gap: var(--space-3);
    align-items: stretch;
    justify-content: center;
    max-width: 480px;
    margin: 0 auto;
}

.nol-newsletter__input {
    flex: 1;
    padding: 0.6rem 1rem;
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    border: 2px solid var(--nol-blue-900);
    background: var(--nol-white);
    color: var(--nol-text);
    border-radius: 0;
    outline: none;
}

.nol-newsletter--navy .nol-newsletter__input {
    border-color: var(--nol-cream-100);
}

.nol-newsletter--navy .nol-button--primary {
    background-color: var(--nol-gold-500);
    color: var(--nol-blue-900);
}

@media (max-width: 480px) {
    .nol-newsletter__form {
        flex-direction: column;
    }
}


.nol-bg-burgundy { background-color: var(--nol-burgundy-800); color: var(--nol-cream-100); }
.nol-bg-burgundy .nol-h2,
.nol-bg-burgundy .nol-display { color: var(--nol-cream-100); }
.nol-bg-burgundy .nol-event-card__title { color: var(--nol-blue-900); }
.nol-bg-burgundy .nol-event-card__more { color: var(--nol-red-500); }
.nol-bg-burgundy .nol-pill--genre {
    background-color: rgba(255,255,255,0.15);
    color: var(--nol-cream-100);
}
.nol-bg-burgundy .nol-featured-events__heading { color: var(--nol-gold-500); }
.nol-bg-burgundy .nol-featured-events__empty { color: var(--nol-cream-100); }
.nol-bg-burgundy .nol-featured-events__cta .nol-button--primary {
    background-color: var(--nol-gold-500);
    color: var(--nol-blue-900);
}
.nol-bg-burgundy .nol-event-card__date { color: var(--nol-gold-500); }
.nol-bg-burgundy .nol-event-card__excerpt { color: var(--nol-text); }


/* ======================================================================
 * Coral background for CTA split — T11
 * ====================================================================== */
.nol-bg-coral { background-color: var(--nol-red-500); }
.nol-bg-coral .nol-contact-cta__headline,
.nol-bg-coral .nol-contact-cta__body { color: var(--nol-white); }
.nol-bg-coral .nol-button--dark {
    background-color: var(--nol-blue-900);
    color: var(--nol-white);
    border-color: var(--nol-blue-900);
}

/* ======================================================================
 * Header calendar button — T6
 * ====================================================================== */
.nol-header__calendar-btn {
    margin-left: var(--space-4);
    font-size: 0.9rem;
    padding: 0.5rem 1rem 0.38rem;
    min-width: 120px;
}

@media (max-width: 1024px) {
    .nol-header__calendar-btn {
        display: block;
        margin-left: 0;
        margin-top: var(--space-4);
        width: 100%;
    }
}

/* ======================================================================
 * Footer contact button — T6
 * ====================================================================== */
.nol-footer__contact-btn {
    margin-top: var(--space-4);
}

/* ======================================================================
 * Pattern parallax — T10
 * ====================================================================== */
.nol-full-bleed-image--parallax {
    position: relative;
    overflow: hidden;
}
.nol-full-bleed-image--parallax .nol-full-bleed-image__bg {
    position: absolute;
    inset: -15%;
    background-size: cover;
    background-position: center;
    will-change: transform;
    z-index: 0;
}

@media (prefers-reduced-motion: reduce) {
    .nol-full-bleed-image--parallax .nol-full-bleed-image__bg {
        position: relative;
        inset: auto;
        transform: none !important;
        will-change: auto;
    }
}

@media (max-width: 768px) {
    /* Disable parallax on mobile: use static background */
    .nol-full-bleed-image--parallax {
        position: relative;
    }
    .nol-full-bleed-image--parallax .nol-full-bleed-image__bg {
        position: absolute;
        inset: 0;
        transform: none !important;
    }
}

/* ======================================================================
 * YouTube social icon size tuning — T6
 * ====================================================================== */
.nol-header__social svg,
.nol-footer__social svg {
    max-width: 32px;
    max-height: 32px;
    width: auto;
    height: auto;
    opacity: 0.85;
    transition: opacity 200ms ease;
}
.nol-header__social a:hover svg,
.nol-footer__social a:hover svg {
    opacity: 1;
}

/* ======================================================================
 * Featured Events module — T19
 * ====================================================================== */
.nol-featured-events {
    padding: var(--nol-pad-section-md) 0;
}
.nol-featured-events__heading {
    text-align: center;
    font-size: var(--nol-h2);
    font-weight: 400; /* display face only ships regular; stop synthetic h2 bolding */
    line-height: 1.2;
    margin-bottom: var(--space-8);
}
.nol-featured-events__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
@media (max-width: 900px) {
    .nol-featured-events__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .nol-featured-events__grid { grid-template-columns: 1fr; }
}
.nol-event-card {
    background: var(--nol-white);
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: box-shadow 200ms ease, transform 200ms ease;
}
.nol-event-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    transform: translateY(-2px);
}
.nol-event-card__link {
    display: block;
    text-decoration: none;
    color: inherit;
}
.nol-event-card__media {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--nol-blue-900);
}
.nol-event-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.nol-event-card__body {
    padding: 0.85rem var(--space-4) var(--space-4);
}
.nol-event-card__genres {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: 4px;
}
.nol-pill--genre {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.2rem 0.6rem;
    background: var(--nol-gold-500);
    color: var(--nol-blue-900);
    border-radius: 0;
}
.nol-event-card__title {
    font-family: var(--nol-font-display);
    font-size: 1.15rem;
    line-height: 1.3;
    margin-bottom: var(--space-1);
    color: var(--nol-blue-900);
}
.nol-event-card__date {
    display: block;
    font-family: var(--nol-font-body);
    font-size: 0.9rem;
    color: var(--nol-teal-800);
    font-weight: 600;
    margin-bottom: var(--space-2);
}
.nol-event-card__excerpt {
    font-size: var(--nol-body);
    color: var(--nol-text);
    margin-bottom: var(--space-2);
}
.nol-event-card__more {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--nol-teal-800);
    border-bottom: 2px solid var(--nol-gold-500);
    padding-bottom: 1px;
}
.nol-event-card__more svg {
    width: 0.85em;
    height: 0.85em;
    flex: 0 0 auto;
}
.nol-featured-events__cta {
    text-align: center;
    margin-top: var(--space-8);
}
.nol-featured-events__empty {
    text-align: center;
    font-size: var(--nol-body-lg);
    opacity: 0.7;
    padding: var(--space-8) 0;
}

/* Featured events on navy bg */
.nol-bg-navy .nol-event-card { background: rgba(255,255,255,0.05); }
.nol-bg-navy .nol-event-card__title { color: var(--nol-cream-100); }
.nol-bg-navy .nol-event-card__excerpt { color: var(--nol-cream-100); }
.nol-bg-navy .nol-event-card__date { color: var(--nol-gold-500); }

/* ======================================================================
 * Featurette navy variant — T9
 * ====================================================================== */
.nol-bg-navy .nol-featurette__cta {
    background-color: var(--nol-gold-500);
    color: var(--nol-blue-900);
    border-color: var(--nol-gold-500);
}
.nol-bg-navy .nol-featurette__copy--centered .nol-h2 {
    color: var(--nol-cream-100);
}

/* Featurette callout (bold inline stat) */
.nol-featurette__callout {
    font-size: clamp(18px, 2.5vw, 28px);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--nol-gold-500);
    margin: 1.5rem 0 1rem;
    line-height: 1.3;
}

/* ======================================================================
 * Split section teal panel — T9
 * ====================================================================== */
.nol-split-section__panel--teal { background-color: var(--nol-teal-800); }

/* Split section deep blue panel (bar program) */
.nol-split-section__panel--blue-deep { background-color: var(--nol-blue-deep); }
.nol-split-section__panel-inner--blue-deep { color: var(--nol-white); }
.nol-split-section__panel-inner--blue-deep .nol-split-section__subhead { color: var(--nol-cream-100); }
.nol-split-section__panel-inner--blue-deep .nol-split-section__body { color: rgba(255,255,255,0.88); }
.nol-split-section__panel-inner--blue-deep .nol-button--dark {
    background-color: var(--nol-white);
    color: var(--nol-blue-deep);
}
.nol-split-section__panel-inner--teal { color: var(--nol-white); }
.nol-split-section__panel-inner--teal .nol-split-section__subhead { color: var(--nol-cream-100); }

/* ======================================================================
 * Active Event pages — Music Calendar list, single event, month grid
 * (archive-nol_event / single-nol_event / page-calendar-month).
 *
 * Cream shell + navy display language per the design comps
 * NOL_EVENT_CALENDAR_LIST and NOL_EVENT_ARCHIVE_DETAIL. All selectors are
 * page-scoped under the three wrapper classes so shared tokens, header,
 * and footer are untouched.
 * ====================================================================== */

/* Warm cream shell shared by all three active-event templates (comp peach). */
.nol-events-list,
.nol-single-event,
.nol-calendar {
    background-color: var(--nol-shell-peach);
}

/* --- shared cross-links + ticket badges --- */
.nol-events-list__view-toggle,
.nol-calendar__list-toggle {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--nol-blue-900);
    text-decoration: none;
    white-space: nowrap;
}
.nol-events-list__view-toggle:hover,
.nol-calendar__list-toggle:hover { color: var(--nol-teal-800); }

.nol-ticket-badge {
    display: inline-block;
    padding: 0.32rem 0.7rem;
    font-family: var(--nol-font-display);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-radius: 0;
}
.nol-ticket-badge--sold-out { background: var(--nol-burgundy-800); color: var(--nol-white); }
.nol-ticket-badge--available { background: var(--nol-teal-800); color: var(--nol-white); }

/* ----------------------------------------------------------------------
 * Events list (archive-nol_event)
 * ---------------------------------------------------------------------- */
.nol-events-list__intro { padding: var(--nol-pad-section-md) 0 0; }
.nol-events-list__title {
    color: var(--nol-blue-900);
    font-size: var(--nol-h1);
    line-height: 1.05;
    margin: 0;
}
.nol-events-list__subtitle {
    color: var(--nol-teal-800);
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    margin-top: var(--space-2);
}
.nol-events-list__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: var(--space-8);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid rgba(0,43,81,0.25);
}
.nol-events-list__filter { display: flex; align-items: center; }
.nol-events-list__filter-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    border: 2px solid var(--nol-blue-900);
    border-radius: 999px;
    padding-right: 2rem;
    background: transparent;
}
.nol-events-list__filter-pill::after {
    content: "";
    position: absolute;
    right: 1rem;
    width: 7px; height: 7px;
    margin-top: -3px;
    border-right: 2px solid var(--nol-blue-900);
    border-bottom: 2px solid var(--nol-blue-900);
    transform: rotate(45deg);
    pointer-events: none;
}
.nol-events-list__filter-pill select {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background: transparent;
    color: var(--nol-blue-900);
    font-family: var(--nol-font-support);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.98rem;
    font-weight: 600;
    padding: 0.6rem 1.9rem 0.5rem 1.15rem;
    cursor: pointer;
    border-radius: 999px;
}
.nol-events-list__filter-pill select:focus-visible {
    outline: 2px solid var(--nol-teal-800);
    outline-offset: 2px;
}

.nol-events-list__body { padding: var(--space-8) 0 var(--nol-pad-section-md); }
.nol-events-list__rows { list-style: none; margin: 0; padding: 0; }

.nol-events-list__month {
    display: block;
    text-align: center; /* Zach 7/7: centered month, no third rule */
    margin: var(--space-10) 0 var(--space-2);
}
.nol-events-list__rows > .nol-events-list__month:first-child { margin-top: 0; }
.nol-events-list__month-label {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--nol-blue-900);
    white-space: nowrap;
}
/* Right-extending rule removed per Zach 7/7 - the row border-tops provide
   the balanced rules above and below the centered month label. */

.nol-event-row {
    display: grid;
    grid-template-columns: 4.5rem 1fr 300px;
    gap: var(--space-6);
    align-items: start;
    padding: var(--space-6) 0;
    border-top: 1px solid rgba(0,43,81,0.18);
}
.nol-event-row--no-media { grid-template-columns: 4.5rem 1fr; }
.nol-event-row--sold-out { opacity: 0.72; }

.nol-event-row__when { line-height: 1; padding-top: 0.15rem; }
.nol-event-row__weekday {
    display: block;
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.8rem;
    color: var(--nol-teal-800);
    margin-bottom: 0.2rem;
}
.nol-event-row__day {
    display: block;
    font-family: var(--nol-font-display);
    font-size: 2.6rem;
    font-weight: 600;
    color: var(--nol-blue-900);
    line-height: 0.9;
}
.nol-event-row__info { min-width: 0; }
.nol-event-row__date {
    font-family: var(--nol-font-body);
    font-size: 0.85rem;
    color: var(--nol-teal-800);
    font-weight: 600;
    margin: 0 0 var(--space-1);
}
.nol-event-row__title {
    font-family: var(--nol-font-support);
    font-weight: 700;
    /* Title Case per NOL_EVENT_CALENDAR_LIST comp — render titles as stored,
       no forced uppercase. */
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
    line-height: 1.05;
    margin: 0 0 var(--space-2);
}
.nol-event-row__title a { color: var(--nol-blue-900); text-decoration: none; }
.nol-event-row__title a:hover { color: var(--nol-teal-800); }
.nol-event-row__desc {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    line-height: 1.55;
    color: var(--nol-text);
    max-width: 46ch;
}
.nol-event-row__genres {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-3);
}
.nol-event-row__cta { margin-top: var(--space-4); }
.nol-event-row__tickets {
    display: inline-block;
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--nol-blue-900);
    text-decoration: none;
    border-bottom: 2px solid var(--nol-gold-500);
    padding-bottom: 2px;
    transition: color 160ms ease, border-color 160ms ease;
}
.nol-event-row__tickets:hover { color: var(--nol-teal-800); border-color: var(--nol-teal-800); }
.nol-event-row__tickets--more { border-color: rgba(0,43,81,0.3); }
.nol-event-row__soldout {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--nol-burgundy-800);
}
.nol-event-row__media {
    display: block;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: var(--nol-blue-900);
    position: relative;
}
/* Zach 7/7 "blue bars": blurred cover copy of the same artwork fills the
   letterbox behind the contained poster - crops nothing, looks intentional. */
.nol-event-row__media::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--nol-media-img);
    background-size: cover;
    background-position: center;
    filter: blur(18px) brightness(0.92);
    transform: scale(1.15);
}
/* contain (not cover) on the navy field: Eventbrite serves a fixed 450x200
   focal crop, so cover would trim text-heavy posters (e.g. Fat Tuesday) at the
   sides. contain shows the full poster on an intentional navy matte. */
.nol-event-row__media img { width: 100%; height: 100%; object-fit: contain; display: block; position: relative; z-index: 1; }

.nol-events-list__empty { text-align: center; padding: var(--space-18) 0; }
.nol-events-list__empty p {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    color: var(--nol-text);
    opacity: 0.75;
    margin: 0 0 var(--space-6);
}

.nol-events-list__pagination {
    margin-top: var(--space-14);
    padding-top: var(--space-6);
    border-top: 1px solid rgba(0,43,81,0.45);
}
.nol-events-list__pagination ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(0.75rem, 2vw, 1.4rem);
    list-style: none;
    margin: 0;
    padding: 0;
}
.nol-events-list__pagination li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.nol-events-list__pagination a,
.nol-events-list__pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    color: var(--nol-blue-900);
    font-family: var(--nol-font-display);
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
    text-transform: uppercase;
}
.nol-events-list__pagination .current {
    border: 1px solid var(--nol-blue-900);
    color: var(--nol-blue-900);
}
.nol-events-list__pagination a:hover {
    color: var(--nol-red-500);
}
/* Collapsed-pages indicator: render a clean ellipsis. The display font's
   glyph + the forced min-width box/tracking made it read as an odd dash. */
.nol-events-list__pagination .dots {
    min-width: 0;
    font-family: var(--nol-font-body);
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

/* ----------------------------------------------------------------------
 * Single event (single-nol_event)
 * ---------------------------------------------------------------------- */
.nol-single-event__intro { padding: var(--nol-pad-section-md) 0 0; }
.nol-single-event__back {
    display: inline-block;
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--nol-teal-800);
    text-decoration: none;
    margin-bottom: var(--space-6);
}
.nol-single-event__back:hover { color: var(--nol-blue-900); }
.nol-single-event__genres {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}
.nol-single-event__title {
    color: var(--nol-blue-900);
    font-size: var(--nol-h1);
    line-height: 1.02;
    margin: 0;
}
.nol-single-event__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: var(--space-4);
}
.nol-single-event__meta-date {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    color: var(--nol-teal-800);
    font-weight: 600;
}
.nol-single-event__rule {
    border: none;
    border-top: 3px solid var(--nol-blue-900);
    margin: var(--space-6) 0 0;
}
.nol-single-event__body { padding: clamp(3.25rem, 5vw, 4.5rem) 0; }
.nol-single-event__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
    gap: clamp(3rem, 6vw, 5rem);
    align-items: start;
}
@media (min-width: 901px) {
    .nol-single-event__layout--short-copy {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }
    .nol-single-event__layout--short-copy .nol-single-event__main {
        max-width: 72ch;
    }
    .nol-single-event__layout--short-copy .nol-single-event__sidebar {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
        gap: clamp(1.5rem, 3vw, 2.5rem);
        align-items: stretch;
    }
    .nol-single-event__layout--short-copy .nol-single-event__poster {
        min-height: 280px;
        margin-bottom: 0;
        aspect-ratio: auto;
    }
    .nol-single-event__layout--short-copy .nol-single-event__card {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}
@media (max-width: 900px) {
    .nol-single-event__layout { grid-template-columns: 1fr; gap: var(--space-10); }
}
.nol-single-event__main {
    max-width: 64ch;
}
.nol-single-event__content {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    line-height: 1.68;
    color: var(--nol-text);
}
.nol-single-event__sidebar {
    align-self: start;
    width: 100%;
}
.nol-single-event__poster {
    overflow: hidden;
    margin-bottom: var(--space-6);
    aspect-ratio: 4 / 3;
    background: var(--nol-blue-900);
}
.nol-single-event__poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.nol-single-event__card {
    background: var(--nol-white);
    border-top: 6px solid var(--nol-gold-500);
    padding: clamp(1.4rem, 2vw, 2rem);
}
.nol-single-event__detail-row {
    display: flex;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-3) 0;
    border-bottom: 1px solid rgba(0,43,81,0.14);
}
.nol-single-event__detail-row:last-of-type { border-bottom: none; }
.nol-single-event__detail-label {
    font-family: var(--nol-font-display);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--nol-teal-800);
    white-space: nowrap;
}
.nol-single-event__detail-value {
    font-family: var(--nol-font-body);
    font-size: 0.95rem;
    color: var(--nol-blue-900);
    text-align: right;
}
.nol-single-event__actions { margin-top: var(--space-6); }
.nol-button--full { display: block; width: 100%; text-align: center; }
.nol-button--disabled { opacity: 0.55; pointer-events: none; }

/* ----------------------------------------------------------------------
 * Month calendar (page-calendar-month)
 * ---------------------------------------------------------------------- */
.nol-calendar__head { padding: var(--nol-pad-section-md) 0 0; }
.nol-calendar__title {
    color: var(--nol-blue-900);
    font-size: var(--nol-h1);
    margin: 0 0 var(--space-6);
}
.nol-calendar__toolbar {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}
.nol-calendar__nav-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px; height: 42px;
    border: 2px solid var(--nol-blue-900);
    color: var(--nol-blue-900);
    background: transparent;
    text-decoration: none;
    font-size: 1.1rem;
    transition: background-color 160ms ease, color 160ms ease;
}
.nol-calendar__nav-btn:hover { background: var(--nol-blue-900); color: var(--nol-cream-100); }
.nol-calendar__today-btn {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--nol-blue-900);
    border: 2px solid var(--nol-blue-900);
    padding: 0.55rem 1rem 0.42rem;
    text-decoration: none;
    transition: background-color 160ms ease, color 160ms ease;
}
.nol-calendar__today-btn:hover,
.nol-calendar__today-btn.is-current { background: var(--nol-blue-900); color: var(--nol-cream-100); }
.nol-calendar__month-label {
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 1.3rem;
    color: var(--nol-blue-900);
}
.nol-calendar__list-toggle { margin-left: auto; }
.nol-calendar__rule {
    border: none;
    border-top: 3px solid var(--nol-blue-900);
    margin: var(--space-6) 0 0;
}
.nol-calendar__body { padding: var(--nol-pad-section-md) 0; }
.nol-calendar__weekdays {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    margin-bottom: var(--space-2);
}
.nol-calendar__weekday {
    font-family: var(--nol-font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--nol-blue-900);
    padding: var(--space-2);
}
.nol-calendar__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1px;
    background: rgba(0,43,81,0.2);
    border: 1px solid rgba(0,43,81,0.2);
}
.nol-calendar__cell {
    background: var(--nol-white);
    min-width: 0;
    min-height: 165px; /* Zach 7/7: closer to square at desktop */
    padding: var(--space-2);
    position: relative;
}
.nol-calendar__cell--empty { background: rgba(0,43,81,0.04); }
.nol-calendar__cell--has-events { background: var(--nol-cream-soft); }
.nol-calendar__day-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px; height: 24px;
    font-family: var(--nol-font-display);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--nol-blue-900);
}
.nol-calendar__cell--today .nol-calendar__day-num {
    background: var(--nol-gold-500);
    color: var(--nol-blue-900);
    border-radius: 50%;
}
.nol-calendar__chips {
    margin-top: var(--space-1);
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.nol-calendar__chip {
    display: flex;
    flex-direction: column; /* Zach 7/7: the Who above the When */
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    padding: 4px 6px;
    background: var(--nol-blue-900);
    color: var(--nol-cream-100);
    text-decoration: none;
    font-family: var(--nol-font-body);
    font-size: 0.68rem;
    line-height: 1.3;
    overflow-wrap: anywhere; /* full titles, wrapped, never truncated */
    transition: background 160ms ease;
}
.nol-calendar__chip:hover { background: var(--nol-teal-800); }
.nol-calendar__chip--sold-out { background: var(--nol-burgundy-800); }
.nol-calendar__chip-title { font-weight: 700; }
.nol-calendar__chip-time { font-weight: 400; font-size: 0.62rem; opacity: 0.85; order: 2; }
.nol-calendar__empty {
    text-align: center;
    padding: var(--space-10) 0;
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    color: var(--nol-text);
    opacity: 0.85;
}
.nol-calendar__empty a { color: var(--nol-teal-800); }
.nol-calendar__list-link { text-align: center; margin-top: var(--space-10); }

/* ----------------------------------------------------------------------
 * Active-events responsive
 * ---------------------------------------------------------------------- */
@media (max-width: 768px) {
    .nol-event-row,
    .nol-event-row--no-media {
        grid-template-columns: 3.2rem 1fr;
        gap: var(--space-4);
    }
    .nol-event-row__media {
        grid-column: 1 / -1;
        aspect-ratio: 16 / 9;
    }
    .nol-event-row__day { font-size: 2.1rem; }
    .nol-calendar__weekday {
        padding: 0.35rem 0.2rem;
        text-align: center;
    }
    .nol-calendar__cell {
        min-height: 64px;
        padding: 0.35rem 0.25rem;
        overflow: hidden;
    }
    .nol-calendar__day-num {
        min-width: 20px;
        height: 20px;
        font-size: 0.72rem;
    }
    .nol-calendar__chips {
        gap: 3px;
    }
    .nol-calendar__chip {
        width: 100%;
        padding: 3px 2px;
        font-size: 0.58rem;
        line-height: 1.1;
        text-align: center;
    }
    .nol-calendar__chip-time { display: none; }
    .nol-calendar__chip-title { display: block; font-size: 0.6rem; }
    .nol-calendar__list-toggle { margin-left: 0; }
}
@media (max-width: 480px) {
    .nol-event-row,
    .nol-event-row--no-media { grid-template-columns: 1fr; }
    .nol-event-row__when {
        display: flex;
        align-items: baseline;
        gap: var(--space-2);
        padding-top: 0;
    }
    .nol-event-row__weekday { margin-bottom: 0; }
    .nol-event-row__day { font-size: 1.6rem; line-height: 1; }
}

/* Featured events on coral bg */
.nol-bg-coral .nol-featured-events__heading { color: var(--nol-white); }
.nol-bg-coral .nol-event-card { background: var(--nol-white); }
.nol-bg-coral .nol-event-card__title { color: var(--nol-blue-900); }
.nol-bg-coral .nol-event-card__body { color: var(--nol-text); }
.nol-bg-coral .nol-featured-events__cta .nol-button--primary {
    background-color: var(--nol-blue-900);
    color: var(--nol-white);
}

/* Featured events on cream bg */
.nol-bg-cream .nol-featured-events__heading { color: var(--nol-blue-900); }
.nol-bg-cream .nol-event-card { background: var(--nol-white); }
.nol-bg-cream .nol-event-card__title { color: var(--nol-blue-900); }
.nol-bg-cream .nol-event-card__excerpt { color: var(--nol-text); }
.nol-bg-cream .nol-event-card__date { color: var(--nol-blue-deep); }
.nol-bg-cream .nol-event-card__body { color: var(--nol-text); }
.nol-bg-cream .nol-event-card__more { color: var(--nol-blue-deep); }
.nol-bg-cream .nol-event-card__more:hover { color: var(--nol-blue-900); text-decoration: underline; }
.nol-bg-cream .nol-pill--genre {
    background-color: var(--nol-blue-900);
    color: var(--nol-cream-100);
}
.nol-bg-cream .nol-event-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.nol-bg-cream .nol-featured-events__cta .nol-button--primary {
    background-color: var(--nol-blue-900);
    color: var(--nol-white);
}

/* ----------------------------------------------------------------------
 * Homepage stage section — navy background text styling
 * Design comp: navy bg with cream text, image left, copy right
 * ---------------------------------------------------------------------- */
body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette__copy--centered .nol-h2 {
    color: var(--nol-cream-100);
}
body.home .nol-featurette-white-1.nol-bg-navy .nol-eyebrow {
    color: rgba(255, 255, 255, 0.75);
}
body.home .nol-featurette-white-1.nol-bg-navy .nol-rich {
    color: rgba(245, 244, 224, 0.85);
}
body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette__callout {
    color: var(--nol-gold-500);
}

body.home .nol-header {
    color: var(--nol-white);
}
body.home .nol-header__inner,
body.nol-cream-shell .nol-header__inner {
    grid-template-columns: 340px 1fr auto;
    column-gap: 2rem;
    padding: 2.2rem 0 0.75rem;
}
body.home .nol-header__logo img,
body.nol-cream-shell .nol-header__logo img {
    width: 352px;
    height: auto;
    max-width: 100%;
}
body.home .nol-header__logo img {
    filter: brightness(0) invert(1);
}
body.home .nol-header__utility,
body.nol-cream-shell .nol-header__utility {
    margin-bottom: 1rem; /* Zach 7/7: more air after the address */
}
body.home .nol-header__utility-link,
body.nol-cream-shell .nol-header__utility-link {
    font-family: var(--nol-font-body);
    font-size: 0.92rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-transform: none;
}
body.home .nol-header__utility-link {
    color: var(--nol-white);
}
body.home .nol-nav,
body.nol-cream-shell .nol-nav {
    gap: clamp(1.3rem, 2.1vw, 2.5rem);
}
body.home .nol-nav .menu-item,
body.home .nol-nav__item,
body.nol-cream-shell .nol-nav .menu-item,
body.nol-cream-shell .nol-nav__item {
    position: relative;
}
body.home .nol-nav .menu-item a,
body.home .nol-nav__link,
body.nol-cream-shell .nol-nav .menu-item a,
body.nol-cream-shell .nol-nav__link {
    font-family: var(--nol-font-body);
    font-size: clamp(1.02rem, 1.2vw, 1.24rem);
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
}
body.home .nol-nav .sub-menu,
body.nol-cream-shell .nol-nav .sub-menu {
    position: absolute;
    top: calc(100% + 0.6rem);
    left: 0;
    z-index: 20;
    display: none;
    min-width: 250px;
    margin: 0;
    padding: 1.45rem 0;
    list-style: none;
    background: var(--nol-white);
    border-top: 6px solid var(--nol-gold-500);
}
body.home .nol-nav .menu-item:hover > .sub-menu,
body.home .nol-nav .menu-item:focus-within > .sub-menu,
body.home .nol-nav__item:hover > .sub-menu,
body.home .nol-nav__item:focus-within > .sub-menu,
body.nol-cream-shell .nol-nav .menu-item:hover > .sub-menu,
body.nol-cream-shell .nol-nav .menu-item:focus-within > .sub-menu,
body.nol-cream-shell .nol-nav__item:hover > .sub-menu,
body.nol-cream-shell .nol-nav__item:focus-within > .sub-menu {
    display: block;
}
body.home .nol-nav .sub-menu a,
body.nol-cream-shell .nol-nav .sub-menu a {
    display: block;
    padding: 0.65rem 1.8rem;
    color: var(--nol-blue-900);
    text-decoration: none !important;
    font-family: var(--nol-font-body);
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    border: 0;
}
body.home .nol-header__calendar-btn,
body.nol-cream-shell .nol-header__calendar-btn {
    margin-left: 1.5rem;
    min-width: 0;
    padding: 0.55rem 1.15rem 0.45rem;
    background: var(--nol-red-500);
    border-color: var(--nol-red-500);
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1.3rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

body.home .nol-hero {
    height: 1220px;
    min-height: 1220px;
    align-items: center;
}
body.home .nol-hero .nol-hero__bg {
    background-position: center top;
}
body.home .nol-hero .nol-hero__overlay {
    /* Warm, readable room per NOL_HOME_REVISED comp: a soft central scrim keeps
       the centered white copy legible while the amber-lit room shows through.
       Modest top scrim for the light nav; a cool-dark base blends into the navy
       stage section below. (The hero's overlay_opacity prop is intentionally
       overridden here — the home hero needs a multi-stop scrim the single-value
       prop can't express.) */
    background:
        radial-gradient(120% 78% at 50% 46%, rgba(20,10,4,0.44) 0%, rgba(20,10,4,0.13) 40%, rgba(20,10,4,0) 66%),
        linear-gradient(180deg, rgba(14,9,5,0.58) 0%, rgba(14,9,5,0.18) 16%, rgba(18,10,4,0) 40%, rgba(18,10,4,0) 66%, rgba(12,11,22,0.52) 100%) !important;
}
body.home .nol-hero .nol-hero__container {
    padding-top: 0;
    padding-bottom: 0;
}
body.home .nol-hero .nol-hero__copy {
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
}
body.home .nol-hero__headline {
    font-size: clamp(3rem, 4.2vw, 4.35rem);
    font-weight: 400; /* Labor Union has no bold; kill the synthetic bold the base 600 was inducing */
    line-height: 0.98;
    letter-spacing: 0.035em;
    margin: 0 0 0.8rem;
}
body.home .nol-hero__body {
    max-width: 690px;
    margin: 0 auto 1.7rem;
    font-size: 1.2rem;
    line-height: 1.42;
}
body.home .nol-hero .nol-hero__cta.nol-button--primary {
    min-width: 410px !important;
    height: 63px !important;
    margin: 0 !important;
    padding: 0.95rem 2rem 0.78rem !important;
    background-color: var(--nol-red-500);
    border-color: var(--nol-red-500);
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.03em !important;
}

body.home .nol-featurette-white-1 {
    position: relative;
    height: auto;
    /* content + padding controls the height now (was a fixed height that
       made padding a no-op); extra bottom breathing room per Michael */
    padding: 4.75rem 0 5.5rem !important;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-color: var(--nol-blue-900);
}
body.home .nol-featurette-white-1::before {
    content: "";
    position: absolute;
    inset: -14% 0;
    /* Acoustic-weave texture ripped from NOL_BUILD_HOME.psd (Pattern Fill 2),
       pre-tinted brand navy - matches the comp's stage band. Oversized + a
       transform var so JS can parallax it (transform-only per DESIGN.md). */
    background-image: url('../images/pattern-weave-navy.jpg');
    background-repeat: repeat;
    background-position: center;
    background-size: 800px auto;
    opacity: 1;
    transform: translateY(var(--nol-plx, 0px));
    will-change: transform;
}
body.home .nol-featurette-white-1::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    box-shadow: inset 0 26px 34px -18px rgba(0,0,0,0.5), inset 0 -26px 34px -18px rgba(0,0,0,0.5);
}
body.home .nol-featurette-white-1 > .nol-container {
    position: relative;
    z-index: 1;
}
body.home .nol-featurette--home-stage {
    display: block;
}
body.home .nol-featurette--home-stage .nol-featurette__copy {
    padding: 0 !important;
}
body.home .nol-featurette--home-stage .nol-h2 {
    max-width: 760px;
    color: var(--nol-white) !important;
    font-size: clamp(2.4rem, 4.1vw, 4rem) !important;
    line-height: 0.98;
    margin-bottom: 1rem !important;
}
body.home .nol-featurette--home-stage .nol-rich {
    max-width: 980px;
    color: rgba(255,255,255,0.9) !important;
    font-size: 1.08rem !important;
    line-height: 1.52 !important;
    margin-bottom: 3.6rem !important;
}
/* Higher-specificity winners for the stage copy block - these were part of a
   deleted "section height overrides" banner that looked superseded by the
   rules above, but actually outrank them (4 classes vs 3) and were the real
   computed values live. Restored after QA caught the regression. */
body.home .nol-featurette-white-1 .nol-featurette__copy .nol-h2 {
    margin: 0 0 var(--space-3) !important;
    font-size: clamp(1.5rem, 2.4vw, 2.1rem) !important;
    font-weight: 400 !important;
}
body.home .nol-featurette-white-1 .nol-featurette__copy .nol-rich {
    margin: 0 0 var(--space-4) !important;
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
}
body.home .nol-featurette--home-stage .nol-featurette__callout {
    max-width: none;
    color: var(--nol-white);
    font-size: clamp(1.55rem, 2.3vw, 2.45rem) !important;
    font-weight: 400 !important;
    line-height: 1.1;
    margin-bottom: 20px !important; /* callout -> button gap per Michael */
}
body.home .nol-featurette-white-1 .nol-button--primary {
    min-width: 405px;
    height: 61px;
    padding: 0.92rem 2rem 0.76rem !important;
    font-family: var(--nol-font-body);
    font-size: 1rem !important;
    font-weight: 500;
}

/* Bar program per Michael 2026-07-06: not a left/right split - one full-width
   section with the cocktail-glass artwork (ripped from NOL_BUILD_HOME.psd,
   "Cocktail BG" layer) as the full-bleed background; copy sits on the right
   half where the artwork leaves open blue field. */
body.home .nol-split-section.nol-split-section-1 {
    height: 600px !important;
    min-height: 600px !important;
    display: block;
    background: var(--nol-blue-700) url('../images/home-bar-cocktail-full.jpg') center / cover no-repeat;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__media {
    display: none !important;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel {
    display: none !important;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
    height: 100%;
    max-width: none;
    margin-left: 50%;
    width: 47%;
    padding: 0 7.5rem 0 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
    grid-column: auto;
    grid-row: auto;
    margin: 0 0 1.2rem;
    color: var(--nol-white);
    font-size: clamp(2.5rem, 4.2vw, 4.15rem);
    line-height: 1.08;
    letter-spacing: 0.025em;
    text-shadow: none;
    pointer-events: auto;
}
body.home .nol-split-section.nol-split-section-1 .nol-split-section__body {
    color: rgba(255,255,255,0.92);
    font-size: 1.1rem;
    line-height: 1.46;
    margin-bottom: 3.7rem;
}
body.home .nol-split-section.nol-split-section-1 .nol-button--dark {
    min-width: 200px;
    height: 63px;
    background: var(--nol-gold-500);
    border-color: var(--nol-gold-500);
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1rem;
    font-weight: 500;
}

body.home .nol-featured-events.nol-bg-cream {
    height: 650px;
    padding: 52px clamp(48px, 4vw, 64px) 64px !important;
    display: block;
    overflow: hidden;
}
body.home .nol-featured-events.nol-bg-cream > .nol-container {
    max-width: 1410px;
    width: 100%;
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
    color: var(--nol-white);
    font-size: clamp(2.5rem, 4vw, 4.1rem) !important;
    line-height: 1;
    margin: 0 0 3rem !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3rem !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card {
    min-height: 395px;
    background: var(--nol-cream-100);
    border: 0;
    box-shadow: none;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card:hover {
    box-shadow: none;
    transform: none;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__link {
    display: block;
    height: 100%;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__date {
    display: none;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
    padding: 3.6rem 3rem 2.8rem !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
    gap: 0.8rem;
    margin-bottom: 2.3rem;
}
body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
    min-width: 150px;
    padding: 0.78rem 1.2rem;
    border-radius: 999px;
    background: var(--nol-gold-pale);
    color: var(--nol-blue-900);
    font-family: var(--nol-font-body);
    font-size: 0.95rem;
    font-weight: 400;
    text-align: center;
    text-transform: none;
    letter-spacing: 0;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
    color: var(--nol-blue-900);
    font-family: var(--nol-font-body);
    font-size: clamp(1.75rem, 2.2vw, 2.35rem) !important;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    margin-top: 0 !important;
    margin-bottom: 1.4rem !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
    color: var(--nol-blue-900);
    font-size: 1.08rem !important;
    line-height: 1.48;
    margin-top: 0 !important;
    margin-bottom: 2.7rem !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
    color: var(--nol-blue-900);
    border: 0;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta {
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 2;
    margin-top: 2.2rem; /* Zach 7/7: red See the Calendar below the cards */
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button {
    box-sizing: border-box;
    flex: 0 0 auto;
    min-width: 405px;
    height: auto;
    padding: 0.92rem 2rem 0.76rem !important;
    font-family: var(--nol-font-body);
    font-size: 1rem !important;
    font-weight: 500;
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button--primary,
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button--coral {
    background-color: var(--nol-red-500) !important;
    border-color: var(--nol-red-500) !important;
    color: var(--nol-white) !important;
}
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button--primary:hover,
body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button--coral:hover {
    background-color: var(--nol-red-600) !important;
    border-color: var(--nol-red-600) !important;
    color: var(--nol-white) !important;
}

body.home .nol-contact-cta--home-split.nol-bg-coral {
    position: relative;
    height: 675px !important;
    padding: 0 !important;
    display: grid;
    grid-template-columns: 45% 55%;
    align-items: stretch;
    background: var(--nol-red-500) !important;
    overflow: hidden;
}
body.home .nol-contact-cta--home-split.nol-bg-coral::before {
    display: none;
}
body.home .nol-contact-cta--home-split .nol-contact-cta__media {
    grid-column: 2;
    grid-row: 1;
    background-size: cover;
    background-position: center;
}
body.home .nol-contact-cta--home-split > .nol-container {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    max-width: none;
    padding: 0 2.5rem;
    display: flex;
    align-items: center;
}
body.home .nol-contact-cta--home-split .nol-contact-cta__inner {
    display: block;
    width: 100%;
    text-align: center;
}
body.home .nol-contact-cta--home-split .nol-contact-cta__headline {
    color: var(--nol-white);
    font-size: clamp(2.65rem, 3.7vw, 4.05rem);
    font-weight: 400; /* stop synthetic bolding of the display face */
    line-height: 1.12;
    margin: 0 auto 1.1rem; /* sized so the panel breaks it "A Distinctive Setting / for Gatherings" (2 lines) at 1440 */
}
body.home .nol-contact-cta--home-split .nol-contact-cta__body {
    max-width: 650px;
    margin: 0 auto 2.8rem;
    color: var(--nol-white);
    font-size: 1.2rem;
    line-height: 1.48;
}
body.home .nol-contact-cta--home-split .nol-contact-cta__action {
    display: flex;
    justify-content: center;
}
body.home .nol-contact-cta--home-split .nol-button--dark {
    min-width: 0;
    height: 60px;
    padding: 0.85rem 2.4rem 0.7rem;
    background: var(--nol-cta-maroon);
    border-color: var(--nol-cta-maroon);
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1.05rem;
    font-weight: 500;
}

body.home .nol-newsletter.nol-newsletter--mustard,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard {
    height: 190px !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    background: var(--nol-gold-500);
}
/* Per Michael 2026-07-06: title spans over both columns; the left-aligned
   tagline sits directly next to the button on the row below. */
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
    max-width: 1000px;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 3rem;
    align-items: center;
    padding: 0;
    text-align: left;
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading {
    grid-column: 1 / -1;
    grid-row: 1;
    text-align: center;
    font-size: clamp(2rem, 3vw, 3rem);
    font-weight: 400;
    line-height: 1;
    margin: 0 0 calc(0.7rem + 20px); /* Zach 7/7 */
    color: var(--nol-blue-900);
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline {
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    color: var(--nol-blue-900);
    font-size: 1.1rem;
    line-height: 1.4;
    max-width: 38ch; /* Zach 7/7: break the two lines at similar lengths */
}
body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button,
body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button {
    grid-column: 2;
    grid-row: 2;
    min-width: 330px;
    height: 62px;
    border: 5px solid var(--nol-blue-900);
    color: var(--nol-blue-900);
    background: transparent;
    font-family: var(--nol-font-body);
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

body.home .nol-footer {
    height: 580px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    background: var(--nol-blue-900);
}
body.home .nol-footer::before {
    display: none;
}
body.home .nol-footer > .nol-container {
    width: 100%;
    max-width: 1410px;
}
body.home .nol-footer__headline-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 3rem;
    border-bottom: 3px solid var(--nol-red-500);
}
body.home .nol-footer__heading {
    color: var(--nol-white);
    font-size: clamp(2.1rem, 3.2vw, 3.1rem) !important;
    line-height: 1;
    margin: 0 !important;
}
body.home .nol-footer__contact-btn {
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 0.4rem 0.95rem 0.32rem;
    border: 3px solid var(--nol-white);
    background: transparent;
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1.28rem;
    font-weight: 600;
}
body.home .nol-footer__menu {
    justify-content: flex-start;
    gap: 2.6rem !important;
    margin: 2.35rem 0 3rem !important;
}
body.home .nol-footer__menu a {
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1.45rem !important;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}
body.home .nol-footer__brand-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
body.home .nol-footer__wordmark img {
    width: 245px !important;
    height: auto;
}
body.home .nol-footer__legal-address {
    margin: 1.6rem 0 1.25rem !important;
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1.35rem !important;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}
body.home .nol-footer__legal-copy {
    color: var(--nol-white);
    font-size: 0.9rem !important;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}
body.home .nol-footer__legal-copy span {
    display: inline-block;
    margin: 0 1rem;
}
body.home .nol-footer__legal-copy .nol-footer__credit {
    display: inline-flex;
    align-items: baseline;
    gap: 1rem;
    margin: 0 0 0 1rem;
    white-space: nowrap;
}
body.home .nol-footer__legal-copy .nol-footer__credit-separator {
    display: inline;
    margin: 0;
}
@media (max-width: 480px) {
    body.home .nol-footer__legal-copy .nol-footer__credit {
        display: block;
        margin: 0.25rem 0 0;
    }
    body.home .nol-footer__legal-copy .nol-footer__credit-separator {
        display: none;
    }
}
body.home .nol-footer__social {
    flex-direction: column;
    gap: 1.55rem !important;
    margin: 0;
}
body.home .nol-footer__social a {
    width: 54px !important;
    height: 54px !important;
}
body.home .nol-footer__social svg {
    width: 54px !important;
    height: 54px !important;
    max-width: 54px;
    max-height: 54px;
}

/* Homepage comp refinement pass: desktop-only visual tuning against
   NOL_HOME_REVISED.jpg after the structural image pass. */
@media (min-width: 1025px) {
    body.home .nol-header > .nol-container,
    body.nol-cream-shell .nol-header > .nol-container {
        max-width: 1360px;
        padding-left: 0;
        padding-right: 0;
    }
    body.home .nol-header__inner,
    body.nol-cream-shell .nol-header__inner {
        grid-template-columns: auto 1fr;
        column-gap: clamp(100px, 8vw, 130px); /* Zach 7/7: >=100px logo->nav */
        padding-top: 2.35rem;
    }
    body.home .nol-header__logo img,
    body.nol-cream-shell .nol-header__logo img {
        width: 351px;
    }
    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 2rem;
    }
    body.home .nol-header__nav {
        transform: translateX(-72px);
    }
    body.home .nol-nav,
    body.nol-cream-shell .nol-nav {
        gap: clamp(1.45rem, 2.05vw, 2.35rem);
    }
    body.home .nol-nav .menu-item a,
    body.home .nol-nav__link,
    body.nol-cream-shell .nol-nav .menu-item a,
    body.nol-cream-shell .nol-nav__link {
        font-size: clamp(1.25rem, 1.55vw, 1.55rem);
    }
    body.home .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__calendar-btn {
        display: inline-flex;
        min-width: 0;
        height: auto;
        margin-left: 0;
        padding: 0.55rem 1.15rem 0.45rem;
        flex: 0 0 auto;
    }
    body.home .nol-nav .sub-menu,
    body.nol-cream-shell .nol-nav .sub-menu {
        min-width: 238px;
        padding: 1.25rem 0;
    }

    body.home .nol-hero .nol-hero__copy {
        max-width: 980px;
        transform: translate(-28px, -30px);
    }
    body.home .nol-hero__headline {
        font-size: clamp(3rem, 3.42vw, 3.55rem);
        line-height: 1.02;
        letter-spacing: 0.03em;
    }
    body.home .nol-hero__body {
        max-width: 660px;
        margin-bottom: 1.55rem;
        font-size: 1.12rem;
    }
    body.home .nol-hero .nol-hero__cta.nol-button--primary {
        min-width: 415px !important;
        height: 58px !important;
        padding-top: 0.78rem !important;
        padding-bottom: 0.62rem !important;
    }

    body.home .nol-featurette-white-1 {
        background: var(--nol-featurette-navy);
    }
    body.home .nol-featurette--home-stage .nol-h2 {
        /* per Michael: ~2.6rem at 1400 with a touch more tracking */
        font-size: clamp(2.1rem, 2.95vw, 2.85rem) !important;
        letter-spacing: 0.035em;
        max-width: 720px;
        line-height: 1;
    }
    body.home .nol-featurette--home-stage .nol-rich {
        max-width: 900px;
        margin-bottom: 3.1rem !important; /* more air between body copy and callout */
        font-size: 1.02rem !important;
        line-height: 1.58 !important;
    }
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        color: var(--nol-white) !important;
        font-size: clamp(1.45rem, 1.9vw, 2rem) !important;
        margin-bottom: 20px !important;
    }
    body.home .nol-featurette-white-1 .nol-button--primary {
        min-width: 405px;
        height: 56px;
    }

    body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
        max-width: 760px;
        padding: 0 2.5rem;
        transform: translateY(-18px);
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
        font-size: clamp(2.35rem, 3.15vw, 3.2rem);
        line-height: 1.08;
        margin-bottom: 0.85rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__body {
        font-size: 0.98rem;
        line-height: 1.48;
        margin-bottom: 2.15rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-button--dark {
        min-width: 235px;
        height: 60px;
        font-size: 1.1rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
        font-size: clamp(2.35rem, 3vw, 3.05rem) !important;
        margin-bottom: 2.2rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 3.15rem 2.5rem 2.55rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 2rem;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
        min-width: 124px;
        padding: 0.62rem 1rem;
        font-size: 0.84rem;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.5rem, 1.78vw, 1.95rem) !important;
        line-height: 1.12;
        margin-bottom: 1.05rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        font-size: 0.95rem !important;
        line-height: 1.45;
        margin-bottom: 2.15rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
        font-size: 1rem;
    }

    body.home .nol-contact-cta--home-split.nol-bg-coral {
        grid-template-rows: 1fr;
        background-color: var(--nol-red-500) !important;
        background-image: none !important;
        background-size: auto !important;
        background-position: center !important;
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__media {
        grid-row: 1;
    }
    body.home .nol-contact-cta--home-split > .nol-container {
        grid-row: 1;
        align-items: center;
        background: var(--nol-red-500);
        padding-left: 2.25rem;
        padding-right: 2.25rem;
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__headline {
        max-width: 610px;
        margin-left: auto;
        margin-right: auto;
        font-size: clamp(2.05rem, 2.7vw, 2.75rem);
        line-height: 1.12;
        margin-bottom: 0.9rem;
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__body {
        max-width: 590px;
        margin-bottom: 2.25rem;
        font-size: 1rem;
        line-height: 1.48;
    }
    body.home .nol-contact-cta--home-split .nol-button--dark {
        min-width: 338px;
        height: 55px;
    }

    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner,

    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
        max-width: 920px;
        column-gap: 2.25rem;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading {
        font-size: clamp(1.85rem, 2.25vw, 2.25rem);
        margin-bottom: 1.45rem;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline {
        font-size: 0.98rem;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button {
        min-width: 316px;
        height: 56px;
        border-width: 4px;
        font-size: 0.96rem;
    }

    body.home .nol-footer {
        align-items: flex-start;
        padding-top: 94px !important;
        background: var(--nol-footer-navy);
    }
    body.home .nol-footer > .nol-container {
        max-width: 1408px;
    }
    body.home .nol-footer__headline-row {
        padding-bottom: 2.35rem;
        border-bottom-width: 2px;
    }
    body.home .nol-footer__heading {
        font-size: clamp(1.65rem, 2.1vw, 2.1rem) !important;
    }
    body.home .nol-footer__contact-btn {
        min-width: 200px;
        height: 52px;
        border-width: 4px;
        font-size: 0.9rem;
    }
    body.home .nol-footer__menu {
        gap: 2.3rem !important;
        margin: 2rem 0 2.45rem !important;
    }
    body.home .nol-footer__menu a {
        font-size: 1.16rem !important;
    }
    body.home .nol-footer__wordmark img {
        width: 225px !important;
    }
    body.home .nol-footer__legal-address {
        margin: 1.35rem 0 1rem !important;
        font-size: 1.05rem !important;
    }
    body.home .nol-footer__legal-copy {
        font-size: 0.72rem !important;
    }
    body.home .nol-footer__social {
        gap: 1.15rem !important;
    }
    body.home .nol-footer__social a,
    body.home .nol-footer__social svg {
        width: 44px !important;
        height: 44px !important;
        max-width: 44px;
        max-height: 44px;
    }
}

@media (min-width: 1025px) and (max-width: 1510px) {
    body.home .nol-header > .nol-container,
    body.nol-cream-shell .nol-header > .nol-container {
        padding-left: clamp(24px, 4vw, 56px);
        padding-right: clamp(24px, 4vw, 56px);
    }
    body.home .nol-header__inner,
    body.nol-cream-shell .nol-header__inner {
        column-gap: 100px; /* Zach 7/7: >=100px logo->nav holds in the tuned band too */
    }
    body.home .nol-header__logo img,
    body.nol-cream-shell .nol-header__logo img {
        width: clamp(235px, 24vw, 318px);
    }
    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        gap: clamp(0.85rem, 1.3vw, 1.4rem);
        transform: none;
    }
    body.home .nol-nav,
    body.nol-cream-shell .nol-nav {
        gap: clamp(0.8rem, 1.45vw, 1.6rem);
    }
    body.home .nol-nav .menu-item a,
    body.home .nol-nav__link,
    body.nol-cream-shell .nol-nav .menu-item a,
    body.nol-cream-shell .nol-nav__link {
        /* per Michael: ~1.4-1.45rem at 1440 */
        font-size: clamp(1.25rem, 1.55vw, 1.5rem);
    }
    body.home .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__calendar-btn {
        min-width: clamp(128px, 12vw, 160px);
        height: 50px;
        padding: 0.7rem 1rem 0.54rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 1024px) {
    html,
    body.nol-body {
        overflow-x: hidden;
    }
    body.home .nol-header > .nol-container,
    body.home .nol-header__tophat > .nol-container,
    body.nol-cream-shell .nol-header > .nol-container,
    body.nol-cream-shell .nol-header__tophat > .nol-container {
        max-width: none;
        padding-left: clamp(14px, 4vw, 32px);
        padding-right: clamp(14px, 4vw, 32px);
    }
    body.home .nol-header__inner,
    body.nol-cream-shell .nol-header__inner {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 1rem;
        padding: 1rem 0 0.5rem;
    }
    body.home .nol-header__logo img,
    body.nol-cream-shell .nol-header__logo img {
        width: min(260px, calc(100vw - 92px));
        height: auto;
    }
    body.home .nol-header__nav-toggle,
    body.nol-cream-shell .nol-header__nav-toggle {
        width: 44px;
        height: 44px;
    }
    body.home .nol-header__nav-toggle {
        color: var(--nol-white);
    }
    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        align-items: stretch;
        justify-content: flex-start;
        overflow-y: auto;
        padding: 5.25rem clamp(22px, 7vw, 72px) 2.5rem;
        text-align: left;
    }
    body.home .nol-header__nav .nol-nav,
    body.nol-cream-shell .nol-header__nav .nol-nav {
        width: min(100%, 520px);
        margin: 0 auto;
        align-items: stretch;
        gap: 1.05rem;
    }
    body.home .nol-header__nav .nol-nav .menu-item,
    body.home .nol-header__nav .nol-nav__item,
    body.nol-cream-shell .nol-header__nav .nol-nav .menu-item,
    body.nol-cream-shell .nol-header__nav .nol-nav__item {
        width: 100%;
    }
    body.home .nol-header__nav .nol-nav .menu-item a,
    body.home .nol-header__nav .nol-nav__link,
    body.nol-cream-shell .nol-header__nav .nol-nav .menu-item a,
    body.nol-cream-shell .nol-header__nav .nol-nav__link {
        display: inline-flex;
        width: fit-content;
        max-width: 100%;
        white-space: normal;
        font-size: clamp(1.45rem, 6vw, 2.5rem);
        line-height: 1;
        padding: 0.15rem 0;
    }
    body.home .nol-header__nav .nol-nav .sub-menu,
    body.nol-cream-shell .nol-header__nav .nol-nav .sub-menu {
        position: static;
        min-width: 0;
        width: 100%;
        display: block;
        margin: 0.55rem 0 0;
        padding: 0.45rem 0 0 1rem;
        background: transparent;
        border-top: 1px solid rgba(240, 233, 206, 0.32);
    }
    body.home .nol-header__nav .nol-nav .sub-menu a,
    body.nol-cream-shell .nol-header__nav .nol-nav .sub-menu a {
        color: var(--nol-cream-100);
        font-size: 0.92rem;
        line-height: 1.25;
        letter-spacing: 0.08em;
        padding: 0.55rem 0;
    }
    body.home .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__calendar-btn {
        width: min(100%, 520px);
        min-width: 0;
        height: 54px;
        margin: 1.75rem auto 0;
        padding: 0.8rem 1rem 0.66rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
        padding-left: clamp(1.5rem, 4vw, 3rem);
        padding-right: clamp(1.5rem, 4vw, 3rem);
        transform: none;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
        font-size: clamp(2.1rem, 4.3vw, 3rem);
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__body {
        margin-bottom: 1.65rem;
        font-size: 0.95rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-button--dark {
        min-width: 180px;
        height: 52px;
    }
}

@media (max-width: 767px) {
    body.home .nol-hero,
    body.home .nol-featurette-white-1,
    body.home .nol-split-section.nol-split-section-1,
    body.home .nol-featured-events.nol-bg-cream,
    body.home .nol-contact-cta--home-split.nol-bg-coral,
    body.home .nol-newsletter.nol-newsletter--mustard,
    body.home .nol-footer {
        width: 100vw;
        max-width: 100vw;
        overflow-x: hidden;
    }
    body.home .nol-container {
        max-width: none;
        padding-left: 18px;
        padding-right: 18px;
    }
    body.home .nol-button,
    body.home .nol-hero .nol-hero__cta.nol-button--primary,
    body.home .nol-featurette-white-1 .nol-button--primary,
    body.home .nol-split-section.nol-split-section-1 .nol-button--dark,
    body.home .nol-contact-cta--home-split .nol-button--dark,
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button,
    body.home .nol-footer__contact-btn {
        width: min(100%, 320px);
        min-width: 0 !important;
        max-width: 100%;
        height: 52px !important;
        padding: 0.78rem 1rem 0.62rem !important;
        font-size: 0.82rem !important;
        line-height: 1.1 !important;
    }
    body.home .nol-hero {
        height: clamp(640px, 100svh, 760px) !important;
        min-height: 640px !important;
        align-items: center;
    }
    body.home .nol-hero .nol-hero__bg {
        background-position: center top;
    }
    body.home .nol-hero .nol-hero__container {
        padding-top: 7rem;
        padding-bottom: 2.5rem;
    }
    body.home .nol-hero .nol-hero__copy {
        max-width: 100%;
        transform: none;
    }
    body.home .nol-hero__headline {
        max-width: 10.5ch;
        margin-left: auto;
        margin-right: auto;
        font-size: clamp(2.2rem, 12vw, 3.4rem);
        line-height: 0.95;
        overflow-wrap: normal;
    }
    body.home .nol-hero__body {
        max-width: 22rem;
        font-size: 0.95rem;
        line-height: 1.45;
    }

    body.home .nol-featurette-white-1 {
        height: auto !important;
        min-height: 430px;
        padding: 3.5rem 0 !important;
    }
    body.home .nol-featurette--home-stage .nol-h2 {
        max-width: 13ch;
        font-size: clamp(1.55rem, 8vw, 2.35rem) !important;
    }
    body.home .nol-featurette--home-stage .nol-rich {
        max-width: 23rem;
        margin-bottom: 1.7rem !important;
        font-size: 0.84rem !important;
        line-height: 1.45 !important;
    }
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        max-width: 18rem;
        font-size: clamp(1.2rem, 6vw, 1.65rem) !important;
        margin-bottom: 1.4rem !important;
    }

    body.home .nol-split-section.nol-split-section-1 {
        height: auto !important;
        min-height: 0 !important;
        display: block;
        background-image: none; /* full-bleed art doesn't read at phone width */
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__media {
        display: block !important;
        min-height: 340px !important;
        height: 340px !important;
        background-position: center center !important;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel {
        grid-column: 1;
        grid-row: 2;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
        margin-left: 0;
        width: 100%;
        height: auto;
        max-width: none;
        padding: 3rem 1.35rem 3.4rem;
        transform: none;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
        font-size: clamp(2rem, 10vw, 3rem);
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__body {
        max-width: 21rem;
        margin-left: auto;
        margin-right: auto;
        font-size: 0.9rem;
    }

    body.home .nol-featured-events.nol-bg-cream {
        height: auto !important;
        min-height: 0;
        display: block;
        padding: 3.4rem 0 !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
        font-size: clamp(2rem, 10vw, 3rem) !important;
        margin-bottom: 1.7rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        min-height: 0;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 2rem 1.5rem 2.1rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 1.3rem;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.45rem, 8vw, 2rem) !important;
    }

    body.home .nol-contact-cta--home-split.nol-bg-coral {
        height: auto !important;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        background: var(--nol-red-500) !important;
    }
    body.home .nol-contact-cta--home-split > .nol-container {
        grid-column: 1;
        grid-row: 1;
        padding: 3.5rem 1.5rem;
        background: var(--nol-red-500);
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__media {
        grid-column: 1;
        grid-row: 2;
        min-height: 310px;
        background-position: center;
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__headline {
        font-size: clamp(2rem, 10vw, 3rem);
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__body {
        font-size: 0.95rem;
    }

    body.home .nol-newsletter.nol-newsletter--mustard,

    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard {
        height: auto !important;
        padding: 2rem 0 !important;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        max-width: none;
        padding: 0;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading {
        font-size: clamp(1.55rem, 7vw, 2rem);
        margin: 0 0 0.85rem;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__tagline {
        max-width: 20rem;
        font-size: 0.86rem;
    }

    body.home .nol-footer {
        height: auto;
        padding: 3.5rem 0 2rem !important;
        align-items: flex-start;
    }
    body.home .nol-footer__headline-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1.6rem;
    }
    body.home .nol-footer__heading {
        font-size: clamp(1.55rem, 8vw, 2.4rem) !important;
        line-height: 1.05;
    }
    body.home .nol-footer__menu {
        gap: 0.9rem 1.5rem !important;
        margin: 1.5rem 0 2rem !important;
    }
    body.home .nol-footer__menu a {
        font-size: 1rem !important;
    }
    body.home .nol-footer__brand-row {
        gap: 1.5rem;
    }
    body.home .nol-footer__wordmark img {
        width: min(220px, 62vw) !important;
    }
    body.home .nol-footer__legal-address {
        font-size: 0.85rem !important;
        line-height: 1.4;
    }
    body.home .nol-footer__social a,
    body.home .nol-footer__social svg {
        width: 34px !important;
        height: 34px !important;
        max-width: 34px;
        max-height: 34px;
    }
}

/* Final homepage polish: keep the visual vocabulary from the comp and tighten
   the centered stage/header details. */
body.home .nol-featured-events.nol-bg-cream {
    position: relative;
    background:
        linear-gradient(180deg, rgba(135, 23, 37, 0.96) 0%, rgba(82, 16, 20, 0.98) 48%, rgba(22, 22, 22, 0.96) 100%);
    background-color: var(--nol-burgundy-800);
}
body.home .nol-featured-events.nol-bg-cream::before {
    display: none;
}
body.home .nol-featured-events.nol-bg-cream.nol-featured-events--has-bg-image::before {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
        linear-gradient(180deg, rgba(75, 0, 0, 0.32) 0%, rgba(40, 0, 0, 0.16) 44%, rgba(12, 5, 5, 0.68) 100%),
        var(--nol-featured-events-bg-image);
    background-size: cover;
    background-position: center 34%;
    background-repeat: no-repeat;
}
/* Depth: soft inner shadows at the section seams (client note 2026-07-06). */
body.home .nol-featured-events.nol-bg-cream::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    box-shadow: inset 0 26px 34px -18px rgba(0,0,0,0.55), inset 0 -26px 34px -18px rgba(0,0,0,0.55);
}
body.home .nol-featured-events.nol-bg-cream > .nol-container {
    position: relative;
    z-index: 2;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card {
    display: flex;
    min-height: 0;
    height: 445px; /* Zach 7/7: -100px */
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__link {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
    display: block;
    flex: 0 0 auto;
    height: clamp(70px, 5vw, 84px);
    aspect-ratio: auto;
    background: var(--nol-blue-900);
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
    max-width: 22rem;
}
body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
    align-self: flex-start;
    margin-top: 0;
}

.nol-header__pin {
    display: inline-block;
    position: relative;
    width: 11px;
    height: 11px;
    margin-left: 0.45rem;
    border-radius: 50% 50% 50% 0;
    background: var(--nol-gold-500);
    color: transparent;
    font-size: 0;
    transform: rotate(-45deg) translateY(-1px);
    transform-origin: center;
}
.nol-header__pin::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 999px;
    background: rgba(0, 43, 81, 0.7);
}

@media (min-width: 1025px) {
    body.home .nol-hero {
        /* per Michael round 2: 815 was too short */
        height: 920px;
        min-height: 920px;
    }
    body.home .nol-featurette-white-1 {
        /* height comes from content + section padding now */
        height: auto;
    }
    body.home .nol-featurette-white-1::before {
        /* square-aligned acoustic-tile texture from NOL_BUILD_HOME.psd;
           450px tile = ~150px sub-squares so the checkerboard alternation
           reads within the 560px band instead of cropping to stripes */
        background-image: url('../images/pattern-weave-navy.jpg');
        background-repeat: repeat;
        background-position: center;
        background-size: 450px auto;
        opacity: 1;
    }
    body.home .nol-header__utility {
        transform: translateX(-72px);
    }
    body.home .nol-header__utility-link,
    body.nol-cream-shell .nol-header__utility-link {
        display: inline-flex;
        align-items: center;
        line-height: 1;
    }
    body.home .nol-featurette--home-stage .nol-featurette__copy {
        max-width: 1180px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        transform: translateY(-12px);
    }
    body.home .nol-featurette--home-stage .nol-h2 {
        max-width: 700px;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 1.65rem !important;
        font-size: clamp(2.4rem, 3.75vw, 3.75rem) !important;
    }
    body.home .nol-featurette--home-stage .nol-rich {
        max-width: 980px;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 4.55rem !important;
        font-size: 1.06rem !important;
        line-height: 1.56 !important;
    }
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        max-width: 1420px;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 5.05rem !important;
        font-size: clamp(1.45rem, 1.9vw, 2rem) !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
        margin-bottom: 1.85rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream > .nol-container {
        transform: none;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        gap: 2.1rem !important;
        align-items: start;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 2.45rem 2.45rem 2.25rem !important;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 1.6rem;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.48rem, 1.6vw, 1.72rem) !important;
        line-height: 1.13;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        font-size: 0.95rem !important;
        line-height: 1.45;
        margin-bottom: 1.9rem !important;
    }
}

@media (min-width: 1025px) and (max-width: 1510px) {
    body.home .nol-header > .nol-container {
        box-sizing: border-box;
        padding-left: clamp(28px, 4vw, 56px);
        padding-right: clamp(28px, 4vw, 56px);
    }
    body.home .nol-header__utility {
        transform: none;
    }
}

@media (max-width: 767px) {
    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        min-height: 0;
        height: auto;
    }
    body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
        margin-top: 1.4rem;
    }
}

/* Homepage alignment hardening: these rules intentionally sit last to neutralize
   older homepage passes that left widths, spacer rows, and hover gaps fighting
   the current comp layout. */
@media (min-width: 1025px) {
    body.home .nol-nav .menu-item-has-children {
        position: relative;
    }
    body.home .nol-nav .menu-item-has-children::before {
        content: "";
        position: absolute;
        left: -0.45rem;
        right: -0.45rem;
        top: 100%;
        height: 0.85rem;
    }
    body.home .nol-nav .sub-menu {
        top: 100%;
        display: none;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        transition: none;
    }
    body.home .nol-nav .menu-item:hover > .sub-menu,
    body.home .nol-nav .menu-item:focus-within > .sub-menu,
    body.home .nol-nav__item:hover > .sub-menu,
    body.home .nol-nav__item:focus-within > .sub-menu {
        display: block;
    }

    body.home .nol-featurette--home-stage .nol-featurette__copy {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    body.home .nol-featurette--home-stage .nol-h2 {
        display: block;
        width: min(100%, 700px);
        margin: 0 auto 1.65rem !important;
        text-align: center;
    }
    body.home .nol-featurette--home-stage .nol-rich {
        display: block;
        width: min(100%, 980px);
        margin: 0 auto 4.55rem !important;
        text-align: center;
    }
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        display: block;
        width: min(100%, 1420px);
        margin: 0 auto 5.05rem !important;
        text-align: center;
    }
    body.home .nol-featurette-white-1 .nol-featurette--home-stage .nol-button--primary {
        align-self: center !important;
    }

}

@media (max-width: 1024px) {
    body.home .nol-featurette--home-stage .nol-featurette__copy {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    body.home .nol-featurette--home-stage .nol-h2,
    body.home .nol-featurette--home-stage .nol-rich,
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        width: min(100%, var(--nol-home-stage-copy-width, 23rem));
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center;
    }
    body.home .nol-featurette-white-1 .nol-featurette--home-stage .nol-button--primary,
    body.home .nol-contact-cta--home-split .nol-button--dark,
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button,
    body.home .nol-footer__contact-btn {
        align-self: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body.home .nol-contact-cta--home-split .nol-contact-cta__action {
        justify-content: center;
    }
    body.home .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner,
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
        align-items: center;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
}

@media (max-width: 767px) {
    body.home .nol-footer__headline-row {
        align-items: center;
        text-align: center;
    }
}

/* ======================================================================
 * Past Show Archive — nol_past_show list + detail templates.
 *
 * Hidden at launch (NOL_LAUNCH_HIDE_DEFERRED). All selectors are archive-
 * specific (.nol-archive-*) so they only style the past-show templates and
 * never leak into the live event surfaces. Reference comps:
 * NOL_EVENT_ARCHIVE.jpg (list) + NOL_EVENT_ARCHIVE_DETAIL.jpg (detail).
 * ====================================================================== */

/* --- List: header ---------------------------------------------------- */
.nol-archive-list__header {
    margin-bottom: var(--space-10);
}
.nol-archive-list__title {
    font-size: var(--nol-h1);
    margin: 0;
    text-align: left;
}

/* --- List: poster card grid ----------------------------------------- */
.nol-archive-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-14) var(--space-10);
}

.nol-archive-card {
    display: flex;
    flex-direction: column;
}

.nol-archive-card__media {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: var(--nol-border-dark);
}
.nol-archive-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 240ms ease-in-out;
}
.nol-archive-card__link:hover .nol-archive-card__media img,
.nol-archive-card:hover .nol-archive-card__media img {
    transform: scale(1.03);
}
.nol-archive-card__media-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--nol-blue-900);
    opacity: 0.12;
}

.nol-archive-card__body {
    padding-top: var(--space-4);
}
.nol-archive-card__title {
    font-family: var(--nol-font-support);
    font-size: var(--nol-h3);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.01em;
    margin: 0;
    color: var(--nol-blue-900);
}
.nol-archive-card__title a {
    color: inherit;
    text-decoration: none;
}
.nol-archive-card__title a:hover {
    color: var(--nol-red-500);
}
.nol-archive-card__date {
    display: block;
    font-family: var(--nol-font-support);
    font-size: var(--nol-eyebrow);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nol-muted);
    margin-top: var(--space-2);
}
.nol-archive-card__more {
    display: inline-block;
    font-family: var(--nol-font-support);
    font-size: var(--nol-small);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nol-blue-900);
    text-decoration: none;
    margin-top: var(--space-4);
}
.nol-archive-card__more:hover {
    color: var(--nol-red-500);
}

/* --- List: empty state ---------------------------------------------- */
.nol-archive-empty {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body-lg);
    color: var(--nol-muted);
    margin: 0;
}

/* --- List: Previous / Next pagination -------------------------------- */
.nol-archive-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--space-18);
    padding-top: var(--space-8);
    border-top: 1px solid var(--nol-border-dark);
}
.nol-archive-pagination__prev,
.nol-archive-pagination__next {
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
}
.nol-archive-pagination__next { margin-left: auto; }
.nol-archive-pagination a {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--nol-blue-900);
    text-decoration: none;
}
.nol-archive-pagination a:hover { color: var(--nol-red-500); }
.nol-archive-pagination__chevron {
    font-size: 1.25em;
    line-height: 1;
}

/* --- Detail: header + rule ------------------------------------------- */
.nol-archive-detail__header {
    padding-bottom: var(--space-6);
    border-bottom: 1px solid var(--nol-border-dark);
    margin-bottom: var(--space-14);
}
.nol-archive-detail__title {
    font-size: var(--nol-h1);
    text-align: left;
    margin: 0;
}
.nol-archive-detail__date {
    display: block;
    font-family: var(--nol-font-support);
    font-size: var(--nol-eyebrow);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nol-muted);
    margin-top: var(--space-3);
}
.nol-archive-detail__rule {
    border: 0;
    border-top: 1px solid var(--nol-border-dark);
    margin: var(--space-14) 0;
}

/* --- Detail: editorial body + poster split --------------------------- */
.nol-archive-detail__layout {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: var(--space-14);
    align-items: start;
}
.nol-archive-detail__layout--single {
    grid-template-columns: 1fr;
    max-width: 62ch;
}
.nol-archive-detail__body {
    font-size: var(--nol-body-lg);
    line-height: 1.65;
    color: var(--nol-ink);
}
.nol-archive-detail__empty {
    color: var(--nol-muted);
    font-style: italic;
}
.nol-archive-detail__poster {
    margin: 0;
}
.nol-archive-detail__poster img {
    width: 100%;
    height: auto;
    display: block;
}

/* --- Detail: videos grid --------------------------------------------- */
.nol-archive-videos__heading {
    font-size: var(--nol-h2);
    text-align: left;
    margin: 0 0 var(--space-8);
}
.nol-archive-videos__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-8);
}
.nol-archive-videos__item {
    position: relative;
    aspect-ratio: 16 / 9;
    background-color: var(--nol-blue-900);
}
.nol-archive-videos__item iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* --- Detail: gallery grid -------------------------------------------- */
.nol-archive-gallery__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
.nol-archive-gallery__item {
    margin: 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-color: var(--nol-border-dark);
}
.nol-archive-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* --- Detail: back link ----------------------------------------------- */
.nol-archive-detail__back {
    margin-top: var(--space-14);
}

/* --- Responsive ------------------------------------------------------ */
@media (max-width: 900px) {
    .nol-archive-detail__layout {
        grid-template-columns: 1fr;
        gap: var(--space-10);
    }
    .nol-archive-detail__poster {
        max-width: 420px;
    }
}

@media (max-width: 768px) {
    .nol-archive-grid {
        gap: var(--space-10) var(--space-6);
    }
    .nol-archive-videos__grid {
        grid-template-columns: 1fr;
    }
    .nol-archive-gallery__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .nol-archive-grid {
        grid-template-columns: 1fr;
    }
}

/* ======================================================================
 * GENERAL / NON-HOME PAGE SHELL  —  page.php + page-form.php
 * Cream editorial shell from NOL_GEN_CON.jpg and NOL_GEN_CON_FORM.jpg:
 * dark logo/nav on cream, inset hero image, editorial content column,
 * poster gallery, framed form/menu panel.
 *
 * Most of this is scoped to `body.nol-page-shell` (set in header.php for
 * these two templates only); the homepage (front-page.php) and event/archive
 * CPT templates never get that class, so nothing below can reach them —
 * even though several instance hooks (nol-hero-1, nol-featurette-white-1,
 * nol-newsletter-band-1) are shared with home. Exception: the header color/
 * border/calendar-btn/nav-recolor rules just below are grouped with
 * `body.nol-cream-shell` (page.php/page-form.php AND event/archive/calendar
 * templates all get that class) since those rules were previously
 * duplicated line-for-line under both selectors.
 * ====================================================================== */

/* --- Page surface: warm cream paper --------------------------------- */
body.nol-page-shell { background-color: var(--nol-cream-100); }

/* --- Header: dark-on-cream (the comp's defining shell shift, and it fixes
 * the dark logo that was previously navy-on-navy and near-invisible).
 * body.nol-page-shell (page.php / page-form.php) and body.nol-cream-shell
 * (the broader non-home shell — see "SHARED NON-HOME CREAM SHELL" below,
 * which also covers event/archive/calendar templates) previously carried
 * two line-for-line identical rule sets here under separate selectors;
 * grouped into one merged selector so the two shells can't drift apart.
 * Cream-shell-only sizing (container width, inner gaps, logo size, link
 * font sizes) stays scoped to body.nol-cream-shell further down, since
 * page-shell doesn't share that sizing pass. ---------------------------- */
body.nol-page-shell .nol-header,
body.nol-cream-shell .nol-header {
    background-color: var(--nol-cream-100);
    color: var(--nol-blue-900);
    border-bottom: 1px solid var(--nol-border-dark);
}
body.nol-page-shell .nol-header__utility-link,
body.nol-cream-shell .nol-header__utility-link { color: var(--nol-blue-900); }
body.nol-page-shell .nol-header__utility-link:hover,
body.nol-cream-shell .nol-header__utility-link:hover { color: var(--nol-burgundy-800); }
body.nol-page-shell .nol-header__pin,
body.nol-cream-shell .nol-header__pin { color: var(--nol-red-500); }

/* Calendar CTA → red-orange per comp */
body.nol-page-shell .nol-header__calendar-btn,
body.nol-cream-shell .nol-header__calendar-btn {
    background-color: var(--nol-red-500);
    border-color: var(--nol-red-500);
    color: var(--nol-white);
}
body.nol-page-shell .nol-header__calendar-btn:hover,
body.nol-cream-shell .nol-header__calendar-btn:hover {
    background-color: var(--nol-burgundy-800);
    border-color: var(--nol-burgundy-800);
    color: var(--nol-white);
}

/* Desktop inline nav only: navy links on cream. The mobile nav is a fixed
 * full-screen navy overlay (≤1024px) whose links must stay light, so the
 * recolor is gated to the desktop breakpoint where the bar itself is cream. */
@media (min-width: 1025px) {
    body.nol-page-shell .nol-nav .menu-item a,
    body.nol-page-shell .nol-nav__link,
    body.nol-cream-shell .nol-nav .menu-item a,
    body.nol-cream-shell .nol-nav__link { color: var(--nol-blue-900); }
    body.nol-page-shell .nol-nav .menu-item a:hover,
    body.nol-page-shell .nol-nav .menu-item.current-menu-item a,
    body.nol-page-shell .nol-nav__link:hover,
    body.nol-page-shell .nol-nav__link.is-active,
    body.nol-cream-shell .nol-nav .menu-item a:hover,
    body.nol-cream-shell .nol-nav .menu-item.current-menu-item a,
    body.nol-cream-shell .nol-nav__link:hover,
    body.nol-cream-shell .nol-nav__link.is-active { color: var(--nol-red-500); }
}

/* Wide-desktop inline nav for non-home now comes from the shared
 * body.home/body.nol-cream-shell rules in the @media(min-width:1025px)
 * header band (search "HEADER PARITY"), which apply from 1025px upward.
 * The old standalone (min-width:1511px) band was deleted as redundant. */

/* --- Inset editorial hero (image only; title lives with the content) --- */
body.nol-page-shell .nol-page-hero {
    background-color: var(--nol-cream-100);
    padding-top: clamp(1.25rem, 3vw, 2.5rem);
}
body.nol-page-shell .nol-page-hero__frame { line-height: 0; overflow: hidden; }
body.nol-page-shell .nol-page-hero__img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 12 / 5;
    object-fit: cover;
    object-position: center;
}
@media (max-width: 767px) {
    body.nol-page-shell .nol-page-hero__img { aspect-ratio: 3 / 2; }
}

/* --- Content column ------------------------------------------------- */
body.nol-page-shell .nol-page-content-1 {
    padding-top: clamp(var(--space-8), 4vw, var(--space-14));
}
body.nol-page-shell .nol-page__header {
    margin-bottom: clamp(1rem, 2.5vw, 1.75rem);
}
body.nol-page-shell .nol-page__title {
    margin: 0;
    color: var(--nol-blue-900);
    font-size: var(--nol-h1);
    line-height: 0.95;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* Editorial rich text: comfortable measure, generous rhythm */
body.nol-page-shell .nol-page__content {
    max-width: 68ch;
    font-size: var(--nol-body-lg);
    line-height: 1.7;
    color: var(--nol-ink);
}
body.nol-page-shell .nol-page__content--intro {
    max-width: 76ch;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
body.nol-page-shell .nol-page__content--body {
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}
body.nol-page-shell .nol-page__content p { margin: 0 0 1.2em; }
body.nol-page-shell .nol-page__content > :first-child { margin-top: 0; }
body.nol-page-shell .nol-page__content > :last-child { margin-bottom: 0; }
body.nol-page-shell .nol-page__eyebrow {
    margin-bottom: 0.55rem !important;
    font-family: var(--nol-font-support);
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--nol-burgundy-800);
}
body.nol-page-shell .nol-page__lead {
    max-width: 58rem;
    font-size: clamp(1.12rem, 1.45vw, 1.32rem);
    line-height: 1.55;
    color: var(--nol-blue-900);
}
body.nol-page-shell .nol-page__micro-cta {
    font-family: var(--nol-font-support);
    font-size: 0.92rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--nol-blue-900);
}
body.nol-page-shell .nol-page__content h2,
body.nol-page-shell .nol-page__content h3,
body.nol-page-shell .nol-page__content h4 {
    font-family: var(--nol-font-support);
    font-weight: 700;
    color: var(--nol-blue-900);
    line-height: 1.12;
    letter-spacing: 0;
    text-transform: none;
}
body.nol-page-shell .nol-page__content h2 {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    margin: 1.7em 0 0.45em;
}
body.nol-page-shell .nol-page__content h3 { font-size: clamp(1.2rem, 2vw, 1.6rem); margin: 1.5em 0 0.4em; }
body.nol-page-shell .nol-page__content h4 { font-size: 1.25rem; margin: 1.3em 0 0.35em; }

/* Large italic pull-quote (comp's editorial break) */
body.nol-page-shell .nol-page__content blockquote {
    margin: 1.6em 0;
    padding: 0;
    border: 0;
    max-width: 44ch;
    font-family: var(--nol-font-body);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(1.35rem, 2.6vw, 1.9rem);
    line-height: 1.25;
    color: var(--nol-blue-900);
}
body.nol-page-shell .nol-page__content blockquote p { margin: 0 0 0.3em; }

body.nol-page-shell .nol-page__content a { color: var(--nol-burgundy-800); }
body.nol-page-shell .nol-page__content img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 1.5em 0;
}
body.nol-page-shell .nol-page__content hr {
    border: 0;
    border-top: 1px solid var(--nol-border-dark);
    margin: 2em 0;
}
body.nol-page-shell .nol-page__details {
    margin: 1.5rem 0;
    font-family: var(--nol-font-support);
    font-size: 0.93rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.45;
    text-transform: uppercase;
    color: var(--nol-blue-900);
}
body.nol-page-shell .nol-page__details p {
    margin-bottom: 0.75rem;
}

/* Editor button (Gutenberg block or classic) → red-orange CTA per comp */
body.nol-page-shell .nol-page__content .wp-block-button__link,
body.nol-page-shell .nol-page__content .wp-element-button,
body.nol-page-shell .nol-page__content a.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--nol-red-500);
    color: var(--nol-white);
    font-family: var(--nol-font-display);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    padding: 0.7rem 2rem 0.55rem;
    border: 2px solid var(--nol-red-500);
    border-radius: 0;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease;
}
body.nol-page-shell .nol-page__content .wp-block-button__link:hover,
body.nol-page-shell .nol-page__content .wp-element-button:hover,
body.nol-page-shell .nol-page__content a.button:hover {
    background-color: var(--nol-burgundy-800);
    border-color: var(--nol-burgundy-800);
    color: var(--nol-white);
}
body.nol-page-shell .nol-page__intro-cta {
    display: flex;
    justify-content: center;
    margin-top: clamp(1.5rem, 2.4vw, 2.25rem);
}
body.nol-page-shell .nol-page__intro-cta .nol-button {
    min-width: min(100%, 320px);
    padding: 0.82rem 1.6rem 0.68rem;
    font-family: var(--nol-font-body);
    font-size: 1rem;
    font-weight: 600;
}

/* --- Two-column featurette (image LEFT, copy RIGHT — matches comp) --- */
body.nol-page-shell .nol-featurette--page {
    align-items: start;
    gap: clamp(1.5rem, 4vw, 3rem);
    margin: clamp(1.75rem, 3.5vw, 3rem) 0;
}
body.nol-page-shell .nol-featurette--page .nol-featurette__copy { padding: 0; }
body.nol-page-shell .nol-featurette--page .nol-featurette__media img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}
/* Inside the narrow column the copy uses the base measure/rhythm */
body.nol-page-shell .nol-featurette--page .nol-page__content {
    max-width: none;
    font-size: var(--nol-body);
    line-height: 1.65;
}

/* --- Gallery poster grid -------------------------------------------- */
body.nol-page-shell .nol-page-gallery { padding-top: clamp(1.5rem, 3vw, 2.5rem); }
body.nol-page-shell .nol-gallery--grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(0.5rem, 1.2vw, 1rem);
}
body.nol-page-shell .nol-gallery__item { margin: 0; overflow: hidden; }
body.nol-page-shell .nol-gallery__img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
}
body.nol-page-shell .nol-gallery__item:hover .nol-gallery__img { transform: scale(1.03); }
@media (max-width: 767px) {
    body.nol-page-shell .nol-gallery--grid { grid-template-columns: repeat(2, 1fr); }
    /* The form/menu gallery (.nol-gallery--row, see page-form.php) is always
       exactly 3 images (nol_get_default_gallery_images('form')); a 2-column
       grid with an odd count leaves an orphaned empty cell (2+1), so keep
       this variant single-column through the same tablet range instead. */
    body.nol-page-shell .nol-gallery--grid.nol-gallery--row { grid-template-columns: 1fr; }
}
@media (max-width: 460px) {
    body.nol-page-shell .nol-gallery--grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    body.nol-page-shell .nol-gallery__img { transition: none; }
    body.nol-page-shell .nol-gallery__item:hover .nol-gallery__img { transform: none; }
}

/* --- Form / Menu panel ---------------------------------------------- */
body.nol-page-shell .nol-page-content-1 {
    padding-top: clamp(3.75rem, 6vw, 5.25rem);
    padding-bottom: clamp(0.75rem, 2vw, 1.5rem);
}
body.nol-page-shell .nol-page__header,
body.nol-page-shell .nol-page__content {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
body.nol-page-shell .nol-page__header {
    margin-bottom: 1rem;
}
body.nol-page-shell .nol-page__content {
    font-size: clamp(1rem, 1.2vw, 1.12rem);
    line-height: 1.62;
}
body.nol-page-shell .nol-page__content h2 {
    margin-top: clamp(1rem, 2vw, 1.4rem);
    margin-bottom: 0.45rem;
    font-size: clamp(1.2rem, 2vw, 1.55rem);
}
body.nol-page-shell .nol-page__lead {
    margin-left: auto;
    margin-right: auto;
}
body.nol-page-shell .nol-page__content p {
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}
body.nol-page-shell .nol-form-panel { padding-top: clamp(1rem, 2.5vw, 2rem); }
body.nol-page-shell .nol-form-panel { padding-top: 0; }
body.nol-page-shell .nol-form-panel__card {
    max-width: 760px;
    margin: 0 auto;
    background-color: var(--nol-white);
    border: 2px solid var(--nol-border-dark);
    padding: clamp(1.5rem, 4vw, 3rem);
}
body.nol-page-shell .nol-form-panel__title {
    margin: 0 0 clamp(1rem, 2.5vw, 1.75rem);
    color: var(--nol-blue-900);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Brand generic form controls (Gravity Forms / CF7 / WPForms, etc.) */
body.nol-page-shell .nol-form-embed input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
body.nol-page-shell .nol-form-embed textarea,
body.nol-page-shell .nol-form-embed select {
    width: 100%;
    padding: 0.65rem 0.85rem;
    font-family: var(--nol-font-body);
    font-size: var(--nol-body);
    color: var(--nol-ink);
    background-color: var(--nol-white);
    border: 2px solid var(--nol-blue-900);
    border-radius: 0;
    box-shadow: none;
}
body.nol-page-shell .nol-form-embed input:focus,
body.nol-page-shell .nol-form-embed textarea:focus,
body.nol-page-shell .nol-form-embed select:focus {
    outline: none;
    border-color: var(--nol-blue-900);
}
body.nol-page-shell .nol-form-embed label {
    font-weight: 600;
    color: var(--nol-blue-900);
}
body.nol-page-shell .nol-form-embed .gform_fields {
    row-gap: 1.15rem !important;
}
body.nol-page-shell .nol-form-embed .gfield {
    margin-bottom: 1.15rem !important;
}
body.nol-page-shell .nol-form-embed .gfield_label,
body.nol-page-shell .nol-form-embed .gform-field-label {
    display: block;
    margin: 0 0 0.45rem !important;
}
body.nol-page-shell .nol-form-embed .gform_footer,
body.nol-page-shell .nol-form-embed .gform_page_footer {
    margin-top: 1.35rem !important;
}
/* Consolidated from 2 previously-overlapping rule blocks (plain + a
   higher-priority !important pass added to beat the Gravity Forms
   stylesheet); !important is kept only on the properties that actually
   need it to win against GF's own CSS. */
body.nol-page-shell .nol-form-embed input[type="submit"],
body.nol-page-shell .nol-form-embed button[type="submit"],
body.nol-page-shell .nol-form-embed .wp-block-button__link,
body.nol-page-shell .nol-form-embed .gform_button,
body.nol-page-shell .nol-form-embed input.gform_button {
    /* Large navy-outline "SIGN UP"-style submit per NOL_GEN_CON_FORM comp,
       mirroring the newsletter band's outline button. !important on size beats
       Gravity Forms' own control sizing. */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: 230px !important;
    min-height: 56px !important;
    padding: 0.95rem 2.6rem !important;
    background-color: transparent !important;
    border: 3px solid var(--nol-blue-900) !important;
    border-color: var(--nol-blue-900) !important;
    border-radius: 0;
    color: var(--nol-blue-900) !important;
    font-family: var(--nol-font-support) !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}
body.nol-page-shell .nol-form-embed input[type="submit"]:hover,
body.nol-page-shell .nol-form-embed button[type="submit"]:hover,
body.nol-page-shell .nol-form-embed .wp-block-button__link:hover,
body.nol-page-shell .nol-form-embed .gform_button:hover,
body.nol-page-shell .nol-form-embed input.gform_button:hover {
    background-color: var(--nol-blue-900) !important;
    border-color: var(--nol-blue-900) !important;
    color: var(--nol-white) !important;
}
/* PDF/menu iframe fills the card edge-to-edge (no inner control padding) */
body.nol-page-shell .nol-form-embed--iframe { line-height: 0; }
body.nol-page-shell .nol-form-embed--iframe iframe { display: block; width: 100%; }

@media (max-width: 900px) {
    body.nol-page-shell .nol-featurette--page {
        grid-template-columns: 1fr;
    }
    body.nol-page-shell .nol-featurette--page .nol-featurette__media img {
        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 767px) {
    body.nol-page-shell .nol-page-content-1 {
        padding-top: clamp(2.5rem, 9vw, 3.75rem);
    }
    body.nol-page-shell .nol-page__content {
        font-size: 1rem;
        line-height: 1.62;
    }
    body.nol-page-shell .nol-form-panel__card {
        padding: 1.35rem;
    }
}

/* ======================================================================
 * FORM / MENU PAGE COMPOSITION POLISH
 * Originally scoped to the retired page-form.php template body class; now
 * scoped to body.nol-page-shell + the builder module classes it emits
 * (nol_page_intro -> .nol-page-content-1 / .nol-page__*, nol_form_panel ->
 * .nol-form-panel*, nol_gallery -> .nol-gallery--row). Those module classes
 * are unique to the form/menu content pages, so general pages and the
 * homepage stay untouched. North Star: NOL_WIREFRAMES3 + NOL_GEN_CON_FORM -
 * a centered editorial intro sitting on one axis above a framed form/menu
 * panel, then the poster gallery.
 * ====================================================================== */

/* Center the intro on a single axis. Previously the copy hugged the left at
   a narrow measure while the form sat centered below, leaving the whole right
   half of the page empty and the page reading taller/sparser than the comp. */
body.nol-page-shell .nol-page__header {
    max-width: 60ch;
    margin-inline: auto;
    text-align: center;
}
body.nol-page-shell .nol-page__title {
    letter-spacing: 0.03em;
}
body.nol-page-shell .nol-page__content {
    max-width: 60ch;
    margin-inline: auto;
}
/* Tighten the intro-to-panel rhythm to pull the overall height in. */
body.nol-page-shell .nol-page-content-1 {
    padding-bottom: clamp(1rem, 2.5vw, 1.75rem);
}

/* --- The framed panel: the page's centerpiece ----------------------- */
body.nol-page-shell .nol-form-panel__card {
    position: relative;
    max-width: 620px;                 /* forms read tighter + more deliberate */
    padding: clamp(1.75rem, 3.5vw, 2.75rem);
}
/* Form pages drop the white card entirely: fields sit directly on the cream
   page per NOL_GEN_CON_FORM. The menu (--embed) and placeholder cards keep
   their frames. */
body.nol-page-shell .nol-form-panel__card--form {
    background-color: transparent;
    border: 0;
    padding: 0;
}
/* A menu / PDF embed becomes the large near-square framed box from the
   wireframe, and drops inner padding so the document fills the frame. */
body.nol-page-shell .nol-form-panel__card--embed {
    max-width: 940px;
    padding: clamp(0.75rem, 1.5vw, 1.25rem);
}

/* Give the generic form fields a branded, eyebrow-style voice. */
body.nol-page-shell .nol-form-embed .gfield_label,
body.nol-page-shell .nol-form-embed .gform-field-label,
body.nol-page-shell .nol-form-embed > form label {
    font-family: var(--nol-font-support);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--nol-blue-900);
}
/* keep GF's "(Required)" marker legible rather than shouting in caps */
body.nol-page-shell .nol-form-embed .gfield_required {
    display: inline-block;
    margin-left: 0.18rem;
    letter-spacing: 0;
    text-transform: none;
    font-size: 0.9em;
}

/* Submit: a confident full-width CTA that anchors the form (was a small,
   generic button floating at the lower-left). */
body.nol-page-shell .nol-form-embed .gform_footer,
body.nol-page-shell .nol-form-embed .gform_page_footer {
    margin-top: 1.5rem !important;
}
body.nol-page-shell .nol-form-embed input[type="submit"],
body.nol-page-shell .nol-form-embed button[type="submit"],
body.nol-page-shell .nol-form-embed .gform_button {
    width: auto;
    min-height: 56px;
    letter-spacing: 0.1em !important;
}

/* --- Branded fallback shell (no form / no PDF uploaded yet) ---------- */
body.nol-page-shell .nol-form-panel__card--placeholder {
    max-width: 620px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    text-align: center;
    padding-block: clamp(2.5rem, 6vw, 4rem);
}
body.nol-page-shell .nol-form-panel__card--placeholder .nol-form-panel__title {
    margin: 0;
}
body.nol-page-shell .nol-form-panel__eyebrow {
    margin: 0;
    color: var(--nol-red-500);
}
body.nol-page-shell .nol-form-panel__note {
    max-width: 44ch;
    margin: 0;
    font-size: var(--nol-body);
    line-height: 1.6;
    color: var(--nol-ink);
}
body.nol-page-shell .nol-form-panel__cta {
    margin-top: 0.4rem;
}

/* Gallery robustness: a navy base means a slow/missing poster reads as an
   intentional dark frame instead of a white void. Scoped to the single-row
   (<=3 image) form/menu galleries so the 6-up venue/music grids are untouched. */
body.nol-page-shell .nol-gallery--row .nol-gallery__item {
    background-color: var(--nol-blue-900);
}

/* On narrow viewports the intro and panel already stack full-width; keep the
   centered measure from over-constraining small screens. */
@media (max-width: 600px) {
    body.nol-page-shell .nol-page__header,
    body.nol-page-shell .nol-page__content {
        max-width: none;
    }
}

/* ======================================================================
 * SHARED NON-HOME CREAM SHELL
 * Applies the comp shell to general pages and event/archive surfaces while
 * leaving the homepage's transparent hero header and exact footer untouched.
 * ====================================================================== */

body.nol-cream-shell { background-color: var(--nol-cream-100); }

/* HEADER PARITY (2026-07-06): non-home headers now share the home header's
 * typography/layout/sizing rules directly (grouped body.home/body.nol-cream-shell
 * selectors in the header blocks earlier in this file). Palette (cream/navy/red)
 * comes from the "GENERAL / NON-HOME PAGE SHELL" block; position stays static
 * (not sticky). The old cream-shell-only sizing pass was deleted as superseded. */

/* Old cream-shell newsletter variant deleted 2026-07-06: non-home pages now
   share the home Behind the Curtain band rules (grouped selectors above). */

body.nol-cream-shell .nol-footer {
    height: auto;
    min-height: 500px;
    padding: clamp(3.5rem, 5vw, 5rem) 0 2.5rem !important;
    display: flex;
    align-items: flex-start;
    background-color: var(--nol-blue-900);
    background-image: none !important;
    color: var(--nol-white);
}
body.nol-cream-shell .nol-footer::before { display: none; }
body.nol-cream-shell .nol-footer > .nol-container {
    width: min(100%, 1320px);
}
body.nol-cream-shell .nol-footer__headline-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    padding-bottom: 2.2rem;
    border-bottom: 2px solid var(--nol-red-500);
}
body.nol-cream-shell .nol-footer__heading {
    margin: 0;
    color: var(--nol-white);
    font-size: clamp(1.85rem, 2.8vw, 2.5rem);
    line-height: 1.05;
}
body.nol-cream-shell .nol-footer__contact-btn {
    border-color: var(--nol-white);
    color: var(--nol-white);
    background: transparent;
}
body.nol-cream-shell .nol-footer__contact-btn:hover {
    background: var(--nol-white);
    color: var(--nol-blue-900);
}
body.nol-cream-shell .nol-footer__menu {
    justify-content: flex-start;
    gap: clamp(1.5rem, 3vw, 3rem);
    margin: 2rem 0 2.4rem !important;
}
body.nol-cream-shell .nol-footer__menu a {
    color: var(--nol-white);
    font-family: var(--nol-font-body);
    font-size: 1rem;
    letter-spacing: 0;
}
body.nol-cream-shell .nol-footer__brand-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: start;
}
body.nol-cream-shell .nol-footer__wordmark img {
    width: min(236px, 42vw) !important;
}
body.nol-cream-shell .nol-footer__legal-address,
body.nol-cream-shell .nol-footer__legal-copy {
    color: var(--nol-white);
}
body.nol-cream-shell .nol-footer__social {
    flex-direction: column;
    align-items: flex-end;
    gap: 1rem;
}
body.nol-cream-shell .nol-footer__social a,
body.nol-cream-shell .nol-footer__social svg {
    width: 42px !important;
    height: 42px !important;
    color: var(--nol-white);
}

@media (max-width: 767px) {
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard {
        padding: 1.8rem 0 !important;
    }
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__inner {
        display: flex;
        flex-direction: column;
        gap: 0.65rem;
    }
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__heading {
        white-space: normal;
    }
    body.nol-cream-shell .nol-newsletter.nol-newsletter--mustard .nol-newsletter__button {
        width: min(100%, 290px);
        min-width: 0;
        margin-top: 0.3rem;
    }
    body.nol-cream-shell .nol-footer__headline-row,
    body.nol-cream-shell .nol-footer__brand-row {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: flex-start;
    }
    body.nol-cream-shell .nol-footer__social {
        flex-direction: row;
        align-items: center;
    }
}

/* Homepage responsive finishing pass: keep the comp desktop intact, then use
   deliberate tablet/mobile layouts instead of letting older overrides fight. */
body.home .nol-contact-cta--home-split.nol-bg-coral {
    background-color: var(--nol-red-500) !important;
    background-image: none !important;
}

body.home .nol-contact-cta--home-split.nol-bg-coral::before {
    content: none !important;
}

body.home .nol-contact-cta--home-split .nol-contact-cta__media {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

@media (min-width: 1025px) {
    body.home .nol-featured-events.nol-bg-cream {
        box-sizing: border-box;
        height: 650px !important;
        min-height: 0;
        overflow: hidden;
        padding: clamp(70px, 5vw, 82px) clamp(64px, 6vw, 104px) clamp(22px, 2vw, 34px) !important;
    }

    body.home .nol-featured-events.nol-bg-cream > .nol-container {
        box-sizing: border-box;
        width: min(100%, 1410px);
        max-width: 1410px;
        height: 100%;
        padding-left: 0;
        padding-right: 0;
        display: flex;
        flex-direction: column;
        transform: none;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
        margin: 0 0 clamp(2.05rem, 2.7vw, 2.65rem) !important;
        font-size: clamp(2.35rem, 3.35vw, 4.1rem) !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        flex: 1 1 auto;
        min-height: 0;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: clamp(1.4rem, 2vw, 2.1rem) !important;
        align-items: stretch;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        width: auto !important;
        height: 100%;
        min-height: 0;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card:last-child:nth-child(odd) {
        grid-column: auto;
        justify-self: stretch;
        width: auto !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: clamp(1.1rem, 1.3vw, 1.35rem) clamp(1.3rem, 1.7vw, 1.75rem) 1.2rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: clamp(0.85rem, 1.1vw, 1.15rem);
    }

    body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
        min-width: min(124px, 100%);
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.12rem, 1.18vw, 1.48rem) !important;
        line-height: 1.14;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        max-width: 22rem;
        font-size: clamp(0.82rem, 0.84vw, 0.9rem) !important;
        line-height: 1.38;
        margin-bottom: 0.95rem !important;
    }

    body.home .nol-contact-cta--home-split.nol-bg-coral {
        height: 675px !important;
        min-height: 675px;
        display: grid;
        grid-template-columns: 46% 54%;
        grid-template-rows: 1fr !important;
        overflow: hidden;
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__media {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        height: 100%;
        min-height: 100%;
        background-size: cover !important;
        background-position: center center !important;
    }
}

@media (min-width: 1025px) and (max-width: 1279px) {
    body.home .nol-featured-events.nol-bg-cream {
        height: 650px !important;
        min-height: 0;
        overflow: hidden;
        padding: clamp(64px, 6vw, 78px) clamp(48px, 5.8vw, 74px) clamp(22px, 2vw, 32px) !important;
    }

    body.home .nol-featured-events.nol-bg-cream > .nol-container {
        width: min(100%, 1120px);
        max-width: 1120px;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        flex: 1 1 auto;
        min-height: 0;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: clamp(1rem, 1.75vw, 1.4rem) !important;
        align-items: stretch;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        height: 100%;
        min-height: 0;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card:last-child:nth-child(odd) {
        grid-column: auto !important;
        justify-self: stretch;
        width: auto !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 1.35rem clamp(1.15rem, 1.55vw, 1.45rem) 1.45rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 1.1rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
        min-width: 0;
        padding: 0.46rem 0.82rem;
        font-size: 0.76rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.04rem, 1.45vw, 1.25rem) !important;
        line-height: 1.16;
        margin-bottom: 0.85rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        max-width: none;
        font-size: 0.82rem !important;
        line-height: 1.42;
        margin-bottom: 1rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
        font-size: 0.88rem;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    body.home .nol-featured-events.nol-bg-cream {
        height: auto !important;
        min-height: 0;
        display: block;
        padding: clamp(4rem, 7vw, 5rem) clamp(48px, 7vw, 84px) !important;
    }

    body.home .nol-featured-events.nol-bg-cream > .nol-container {
        width: 100%;
        max-width: 860px;
        height: auto;
        padding-left: 0;
        padding-right: 0;
        display: block;
        transform: none;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
        margin: 0 0 2rem !important;
        font-size: clamp(2.35rem, 5.4vw, 3.25rem) !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: clamp(1.25rem, 3vw, 1.75rem) !important;
        align-items: stretch !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        height: 100%;
        min-height: 0;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
        height: clamp(116px, 16vw, 142px);
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, calc((100% - clamp(1.25rem, 3vw, 1.75rem)) / 2));
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 2.1rem clamp(1.5rem, 3.4vw, 2rem) 2.25rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        max-width: 30rem;
        margin-bottom: 1.65rem !important;
        font-size: 0.98rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 1.1rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
        min-width: 0;
        padding: 0.5rem 0.9rem;
        font-size: 0.82rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.35rem, 3vw, 1.75rem) !important;
        line-height: 1.14;
        margin-bottom: 0.9rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
        font-size: 0.92rem;
    }

    body.home .nol-contact-cta--home-split.nol-bg-coral {
        height: clamp(560px, 64vw, 675px) !important;
        min-height: 560px;
        display: grid;
        grid-template-columns: 46% 54% !important;
        grid-template-rows: 1fr !important;
        overflow: hidden;
    }

    body.home .nol-contact-cta--home-split > .nol-container {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100%;
        max-width: none;
        padding: clamp(2.35rem, 4.4vw, 3.7rem) clamp(1.75rem, 4.8vw, 3.55rem);
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--nol-red-500);
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__inner {
        width: 100%;
        max-width: 445px;
        margin: 0 auto;
        text-align: center;
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__headline {
        max-width: 12.5ch;
        margin: 0 auto 1rem;
        font-size: clamp(1.85rem, 3.5vw, 2.55rem);
        line-height: 1.08;
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__body {
        max-width: 29rem;
        margin: 0 auto clamp(1.45rem, 2.2vw, 2rem);
        font-size: clamp(0.86rem, 1.25vw, 0.98rem);
        line-height: 1.45;
    }

    body.home .nol-contact-cta--home-split .nol-button--dark {
        width: min(100%, 318px);
        min-width: 0;
        height: 52px;
        padding-left: 0.85rem;
        padding-right: 0.85rem;
        font-size: clamp(0.82rem, 1.6vw, 0.95rem);
        letter-spacing: 0.04em;
        white-space: nowrap;
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__media {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100%;
        height: 100%;
        min-height: 100%;
        background-size: cover !important;
        background-position: center center !important;
    }
}

@media (max-width: 767px) {
    body.home .nol-featured-events.nol-bg-cream {
        padding: 3.4rem 18px !important;
    }

    body.home .nol-featured-events.nol-bg-cream > .nol-container {
        padding-left: 0;
        padding-right: 0;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        width: 100% !important;
        height: auto;
        min-height: 0;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
        height: clamp(132px, 38vw, 168px);
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
        padding: 1.75rem 1.35rem 1.9rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
        margin-bottom: 1.1rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
        min-width: 0;
        padding: 0.52rem 0.9rem;
        font-size: 0.84rem;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
        font-size: clamp(1.35rem, 7vw, 1.75rem) !important;
        line-height: 1.14;
        margin-bottom: 0.95rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
        font-size: 0.92rem !important;
        line-height: 1.42;
        margin-bottom: 1.25rem !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
        font-size: 0.92rem;
    }

    body.home .nol-contact-cta--home-split.nol-bg-coral {
        grid-template-rows: auto clamp(320px, 72vw, 430px);
    }

    body.home .nol-contact-cta--home-split > .nol-container {
        padding: clamp(3.5rem, 12vw, 4.25rem) 1.5rem;
    }

    body.home .nol-contact-cta--home-split .nol-contact-cta__media {
        min-height: clamp(320px, 72vw, 430px);
        background-size: cover !important;
        background-position: center center !important;
    }
}

/* ======================================================================
 * FORM / MENU PANEL — optional intro (nol_form_panel builder element)
 * New hooks: the intro heading/lead rendered above the framed card. These
 * selectors don't exist elsewhere, so this block is additive-only. The card
 * itself reuses the pre-existing .nol-form-panel__card rules above.
 * ====================================================================== */
body.nol-page-shell .nol-form-panel__intro {
    max-width: 760px;
    margin: 0 auto clamp(1.25rem, 3vw, 2rem);
    text-align: center;
}
body.nol-page-shell .nol-form-panel__intro-title {
    margin: 0 0 clamp(0.5rem, 1.5vw, 1rem);
    color: var(--nol-blue-900);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
body.nol-page-shell .nol-form-panel__intro-lead {
    margin: 0;
    font-size: var(--nol-body);
    line-height: 1.6;
}

/* Calendar export links (event detail + list subscribe) - 2026-07-06 */
.nol-single-event__cal-links {
    margin: 0.9rem 0 0;
    font-family: var(--nol-font-body);
    font-size: 0.9rem;
    text-align: center;
}
.nol-single-event__cal-links a {
    color: var(--nol-teal-800);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 2px solid var(--nol-gold-500);
    padding-bottom: 1px;
}
.nol-single-event__cal-links a:hover { color: var(--nol-blue-900); }
.nol-single-event__cal-links span { margin: 0 0.5rem; color: var(--nol-muted); }
.nol-events-list__links { display: inline-flex; align-items: center; gap: 1.6rem; }
.nol-events-list__subscribe {
    color: var(--nol-teal-800);
    font-family: var(--nol-font-body);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 2px solid var(--nol-gold-500);
    padding-bottom: 1px;
}
.nol-events-list__subscribe:hover { color: var(--nol-blue-900); }


/* Client note 2026-07-06: collapse to the hamburger SOONER. The desktop
 * header needs breathing room; between 1025-1200px the nav would crowd the
 * logo, so this band re-applies the full mobile header treatment on top of
 * the desktop rules (same specificity, later source = wins). Contents are
 * a verbatim copy of the two <=1024px header bands. */
@media (min-width: 1025px) and (max-width: 1200px) {

    /* Switch to the hamburger before the nav would ever wrap. Show the mobile
       top hat; hide the desktop utility; logo left + hamburger right. */
    .nol-header__tophat { display: block; }
    .nol-header__inner .nol-header__utility { display: none; }
    .nol-header__inner { grid-template-columns: 1fr auto; }
    .nol-header__logo { grid-row: 1; grid-column: 1; }
    .nol-header__logo img { height: 76px; }
    .nol-header__nav-toggle { display: block; grid-row: 1; grid-column: 2; }
    /* The overlay is always rendered (full-screen, navy) but faded out and
       non-interactive until .is-open. display can't animate, so we fade
       opacity + visibility instead. */
    .nol-header__nav {
        display: flex;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100vh;
        height: 100dvh;
        z-index: 1000;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: var(--nol-blue-900);
        padding: 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 280ms ease, visibility 0s linear 280ms;
    }
    .nol-header__nav.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity 280ms ease, visibility 0s linear 0s;
    }
    .nol-header__nav-close {
        display: block;
        position: absolute;
        top: 1rem;
        right: 1.25rem;
        background: none;
        border: 0;
        color: var(--nol-white);
        font-size: 2.75rem;
        line-height: 1;
        cursor: pointer;
        padding: 0.25rem 0.6rem;
    }
    .nol-header__nav .nol-nav {
        flex-direction: column;
        align-items: center;
        gap: 1.75rem;
    }
    .nol-header__nav .nol-nav .menu-item a,
    .nol-header__nav .nol-nav__link {
        font-size: 1.4rem;
    }
    .nol-header__nav .nol-nav .sub-menu {
        position: static;
        display: block;
        width: 100%;
        min-width: 0;
        margin: 0.55rem 0 0;
        padding: 0.45rem 0 0 1rem;
        background: transparent;
        border-top: 1px solid rgba(240, 233, 206, 0.32);
        box-shadow: none;
    }
    .nol-header__nav .nol-nav .sub-menu a {
        color: var(--nol-cream-100);
        font-size: 0.92rem;
        line-height: 1.25;
        letter-spacing: 0.08em;
        padding: 0.55rem 0;
    }


    html,
    body.nol-body {
        overflow-x: hidden;
    }
    body.home .nol-header > .nol-container,
    body.home .nol-header__tophat > .nol-container,
    body.nol-cream-shell .nol-header > .nol-container,
    body.nol-cream-shell .nol-header__tophat > .nol-container {
        max-width: none;
        padding-left: clamp(14px, 4vw, 32px);
        padding-right: clamp(14px, 4vw, 32px);
    }
    body.home .nol-header__inner,
    body.nol-cream-shell .nol-header__inner {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 1rem;
        padding: 1rem 0 0.5rem;
    }
    body.home .nol-header__logo img,
    body.nol-cream-shell .nol-header__logo img {
        width: min(260px, calc(100vw - 92px));
        height: auto;
    }
    body.home .nol-header__nav-toggle,
    body.nol-cream-shell .nol-header__nav-toggle {
        width: 44px;
        height: 44px;
    }
    body.home .nol-header__nav-toggle {
        color: var(--nol-white);
    }
    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        align-items: stretch;
        justify-content: flex-start;
        overflow-y: auto;
        padding: 5.25rem clamp(22px, 7vw, 72px) 2.5rem;
        text-align: left;
    }
    body.home .nol-header__nav .nol-nav,
    body.nol-cream-shell .nol-header__nav .nol-nav {
        width: min(100%, 520px);
        margin: 0 auto;
        align-items: stretch;
        gap: 1.05rem;
    }
    body.home .nol-header__nav .nol-nav .menu-item,
    body.home .nol-header__nav .nol-nav__item,
    body.nol-cream-shell .nol-header__nav .nol-nav .menu-item,
    body.nol-cream-shell .nol-header__nav .nol-nav__item {
        width: 100%;
    }
    body.home .nol-header__nav .nol-nav .menu-item a,
    body.home .nol-header__nav .nol-nav__link,
    body.nol-cream-shell .nol-header__nav .nol-nav .menu-item a,
    body.nol-cream-shell .nol-header__nav .nol-nav__link {
        display: inline-flex;
        width: fit-content;
        max-width: 100%;
        white-space: normal;
        font-size: clamp(1.45rem, 6vw, 2.5rem);
        line-height: 1;
        padding: 0.15rem 0;
    }
    body.home .nol-header__nav .nol-nav .sub-menu,
    body.nol-cream-shell .nol-header__nav .nol-nav .sub-menu {
        position: static;
        min-width: 0;
        width: 100%;
        display: block;
        margin: 0.55rem 0 0;
        padding: 0.45rem 0 0 1rem;
        background: transparent;
        border-top: 1px solid rgba(240, 233, 206, 0.32);
    }
    body.home .nol-header__nav .nol-nav .sub-menu a,
    body.nol-cream-shell .nol-header__nav .nol-nav .sub-menu a {
        color: var(--nol-cream-100);
        font-size: 0.92rem;
        line-height: 1.25;
        letter-spacing: 0.08em;
        padding: 0.55rem 0;
    }
    body.home .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__calendar-btn {
        width: min(100%, 520px);
        min-width: 0;
        height: 54px;
        margin: 1.75rem auto 0;
        padding: 0.8rem 1rem 0.66rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__panel-inner {
        padding-left: clamp(1.5rem, 4vw, 3rem);
        padding-right: clamp(1.5rem, 4vw, 3rem);
        transform: none;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
        font-size: clamp(2.1rem, 4.3vw, 3rem);
    }
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__body {
        margin-bottom: 1.65rem;
        font-size: 0.95rem;
    }
    body.home .nol-split-section.nol-split-section-1 .nol-button--dark {
        min-width: 180px;
        height: 52px;
    }

    /* Overlay links must stay light on the navy overlay (the >=1025px
       recolor band would otherwise paint them navy-on-navy). */
    body.nol-page-shell .nol-nav .menu-item a,
    body.nol-page-shell .nol-nav__link,
    body.nol-cream-shell .nol-nav .menu-item a,
    body.nol-cream-shell .nol-nav__link { color: var(--nol-cream-100); }
    .nol-header__nav { transform: none; }
}


/* Zach 7/7: mobile overlay - address top-right above the close (X) per
   mobilenav2 comp; calendar button harmonized with nav. */
@media (max-width: 1200px) {
    body.home .nol-header__nav .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__nav .nol-header__calendar-btn,
    .nol-header__nav .nol-header__calendar-btn {
        font-size: clamp(1.65rem, 5vw, 2.1rem) !important;
        line-height: 1 !important;
    }
    /* Address pinned to the top-right corner of the overlay, on its own row
       above the X (mobilenav2). Absolute so it leaves the menu column flow. */
    .nol-header__nav .nol-header__overlay-address {
        position: absolute;
        top: 1.5rem;
        right: 1.5rem;
        margin: 0;
        display: inline-flex;
        align-items: center;
        color: var(--nol-cream-100);
        font-family: var(--nol-font-body);
        font-size: 1.05rem;
        font-weight: 500;
        letter-spacing: 0.02em;
        text-decoration: none;
        z-index: 1;
    }
    /* X drops below the address so the two stack (address over close). */
    .nol-header__nav-close {
        top: 4.2rem;
    }
    /* Clear the stacked address + X before the first menu item. */
    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        padding-top: 8rem;
    }
}
@media (min-width: 1201px) {
    .nol-header__nav .nol-header__overlay-address { display: none; }
}

/* ----------------------------------------------------------------------
 * 2026-07-08 production repair: events cards + wide desktop header.
 * Earlier comp-fidelity passes forced this section to a fixed desktop height
 * and made media very shallow. Real event copy needs room; only the media crop
 * should clip, never the card body or section.
 * ---------------------------------------------------------------------- */
@media (min-width: 1201px) {
    body.home .nol-header > .nol-container,
    body.nol-cream-shell .nol-header > .nol-container {
        box-sizing: border-box;
        width: min(1480px, calc(100% - clamp(48px, 6vw, 96px)));
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.home .nol-header__inner,
    body.nol-cream-shell .nol-header__inner {
        grid-template-columns: clamp(260px, 22vw, 351px) minmax(0, 1fr) !important;
        column-gap: clamp(48px, 5vw, 96px) !important;
    }

    body.home .nol-header__logo img,
    body.nol-cream-shell .nol-header__logo img {
        width: 100% !important;
        height: auto !important;
    }

    body.home .nol-header__utility,
    body.nol-cream-shell .nol-header__utility {
        grid-column: 2 !important;
        transform: none !important;
        max-width: 100%;
    }

    body.home .nol-header__nav,
    body.nol-cream-shell .nol-header__nav {
        grid-column: 2 !important;
        transform: none !important;
        justify-self: stretch;
        justify-content: flex-end;
        min-width: 0;
        gap: clamp(1rem, 1.5vw, 1.5rem);
    }

    body.home .nol-nav,
    body.nol-cream-shell .nol-nav {
        min-width: 0;
        gap: clamp(0.85rem, 1.25vw, 1.45rem) !important;
    }

    body.home .nol-nav .menu-item a,
    body.home .nol-nav__link,
    body.nol-cream-shell .nol-nav .menu-item a,
    body.nol-cream-shell .nol-nav__link {
        font-size: clamp(1rem, 1.22vw, 1.22rem) !important;
    }

    body.home .nol-header__calendar-btn,
    body.nol-cream-shell .nol-header__calendar-btn {
        min-width: 0 !important;
        height: auto !important;
        padding: 0.66rem 1.22rem 0.58rem !important;
        font-size: clamp(1rem, 1.18vw, 1.18rem) !important;
        white-space: nowrap;
    }
}

body.home .nol-featured-events.nol-bg-cream {
    height: auto !important;
    min-height: 650px;
    overflow: visible;
    padding: clamp(52px, 4vw, 68px) clamp(48px, 5vw, 88px) clamp(42px, 4vw, 64px) !important;
}

body.home .nol-featured-events.nol-bg-cream > .nol-container {
    height: auto !important;
    min-height: 0;
}

body.home .nol-featured-events.nol-bg-cream .nol-featured-events__heading {
    margin-bottom: clamp(1.7rem, 2.4vw, 2.4rem) !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-featured-events__grid {
    min-height: 0;
    align-items: stretch !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__link,
body.home .nol-featured-events.nol-bg-cream .nol-event-card__link:hover,
body.home .nol-featured-events.nol-bg-cream .nol-event-card__link:focus {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
    height: clamp(150px, 11vw, 184px) !important;
    min-height: clamp(150px, 11vw, 184px);
    flex: 0 0 auto;
    overflow: hidden;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__body {
    flex: 1 1 auto;
    min-height: auto !important;
    overflow: visible;
    padding: clamp(1.55rem, 1.75vw, 2rem) clamp(1.55rem, 2vw, 2.25rem) clamp(1.45rem, 1.8vw, 2rem) !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__title,
body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
    text-decoration: none !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__genres {
    margin-bottom: clamp(0.9rem, 1.2vw, 1.25rem) !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-pill--genre {
    min-width: 0 !important;
    padding: 0.55rem 1.05rem !important;
    font-size: clamp(0.76rem, 0.76vw, 0.86rem) !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__title {
    font-size: clamp(1.22rem, 1.35vw, 1.58rem) !important;
    line-height: 1.14;
    margin-bottom: clamp(0.8rem, 1vw, 1rem) !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__excerpt {
    max-width: none !important;
    font-size: clamp(0.9rem, 0.92vw, 1rem) !important;
    line-height: 1.45;
    margin-bottom: 1rem !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-event-card__more {
    margin-top: auto !important;
    font-size: clamp(0.9rem, 0.95vw, 1rem) !important;
    text-decoration: none !important;
}

body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta {
    margin-top: clamp(1.65rem, 2.3vw, 2.3rem) !important;
}

@media (min-width: 1025px) and (max-width: 1279px) {
    body.home .nol-featured-events.nol-bg-cream {
        min-height: 650px;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        min-height: 0 !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
        height: clamp(140px, 13vw, 170px) !important;
        min-height: clamp(140px, 13vw, 170px);
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
        height: clamp(150px, 18vw, 190px) !important;
    }
}

@media (max-width: 767px) {
    body.home .nol-featured-events.nol-bg-cream {
        overflow: visible;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-event-card__media {
        height: clamp(160px, 46vw, 220px) !important;
    }

    body.home .nol-featured-events.nol-bg-cream .nol-featured-events__cta .nol-button {
        flex: 0 0 min(320px, calc(100vw - 70px)) !important;
        width: min(320px, calc(100vw - 70px)) !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 52px !important;
        padding: 0.6rem 1rem 0.42rem !important;
        font-size: 0.82rem !important;
        letter-spacing: 0.04em;
        white-space: nowrap;
    }
}

/* Zach mobile type fixes: preserve intentional builder line breaks, keep the
   stage headline dominant, and prevent the bar headline from splitting inside
   "HEAR IT. FEEL IT." on narrow iPhones. */
body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
    color: var(--nol-white) !important;
}

@media (max-width: 1024px) {
    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__copy .nol-h2 {
        width: min(100%, 15ch) !important;
        max-width: 15ch !important;
        font-size: clamp(34px, 9.4vw, 42px) !important;
        line-height: 0.96 !important;
    }

    body.home .nol-featurette-white-1.nol-bg-navy .nol-featurette--home-stage .nol-featurette__callout {
        width: min(100%, 18rem) !important;
        max-width: 18rem !important;
        font-size: clamp(18px, 4.8vw, 21px) !important;
        line-height: 1.1 !important;
        margin-bottom: 1.35rem !important;
    }
}

@media (max-width: 767px) {
    body.home .nol-split-section.nol-split-section-1 .nol-split-section__title {
        font-size: clamp(31px, 8.2vw, 36px) !important;
        line-height: 1.02 !important;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
}

/* ======================================================================
 * Zach 7/7: child-page text standard (extracted from /menu/ + /music/)
 * Type-only properties on purpose - alignment/width stay per-component.
 * ====================================================================== */
body.nol-page-shell .nol-menu-intro .nol-rich,
body.nol-page-shell .nol-featurette__copy .nol-rich {
    font-size: clamp(1rem, 1.2vw, 1.12rem);
    line-height: 1.62;
    color: var(--nol-ink);
}
body.nol-page-shell .nol-menu-intro .nol-rich p,
body.nol-page-shell .nol-featurette__copy .nol-rich p { margin: 0 0 1.2em; }

body.nol-page-shell .nol-menu-intro .nol-rich h2,
body.nol-page-shell .nol-featurette__copy .nol-rich h2,
body.nol-page-shell .nol-page__content h2 {
    font-family: var(--nol-font-support);
    font-weight: 600;
    font-size: clamp(1.55rem, 2.2vw, 1.95rem);
    line-height: 1.18;
    letter-spacing: 0.01em;
    text-transform: none;
    color: var(--nol-blue-900);
    margin: 1.35em 0 0.5em;
}
body.nol-page-shell .nol-menu-intro .nol-rich h3,
body.nol-page-shell .nol-featurette__copy .nol-rich h3 {
    font-family: var(--nol-font-support); font-weight: 700;
    font-size: clamp(1.2rem, 2vw, 1.6rem); line-height: 1.12;
    letter-spacing: 0; text-transform: none; color: var(--nol-blue-900);
    margin: 1.5em 0 0.4em;
}
body.nol-page-shell .nol-menu-intro .nol-rich h4,
body.nol-page-shell .nol-featurette__copy .nol-rich h4 {
    font-family: var(--nol-font-support); font-weight: 700;
    font-size: 1.25rem; line-height: 1.12; letter-spacing: 0;
    text-transform: none; color: var(--nol-blue-900); margin: 1.3em 0 0.35em;
}

/* Mobile featured-hero cap (Broughton-style): no screen-height hero images */
@media (max-width: 767px) {
    body.nol-page-shell .nol-hero { min-height: 40vh; }
}