/* Global links, buttons, bookplate gradient, Hunter Green section overrides,
   image oval frames, testimonials, accessibility, Ninja Forms, Events
   Calendar, mobile nav overlay. */

/* Contents
---------------------------------------------------------------------------- */

/*  1. Global links
    2. Buttons
    3. Hunter Green sections
    4. Images
    5. Testimonials
    6. Accessibility
    7. Ninja Forms
    8. The Events Calendar
    9. Mobile nav overlay
   10. Page title
   11. 404 page
   12. Postscript
   13. Cookie consent */

/* 1. Global links
---------------------------------------------------------------------------- */

/* Global link styles
--------------------------------------------- */

/* :not(.wp-block-button__link): WCAG 1.4.1 underlining applies to inline
   text links only. Buttons are already distinguishable by background, border
   and padding. Weight 400 because IM Fell DW Pica's delicate strokes render
   synthetic bold incorrectly. */
a:link:not(.wp-block-button__link),
button[data-href="#gdpr_cookie_modal"] {
    color: var(--wp--preset--color--brand-alt);
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: var(--gcs-weight-link);
}
a:visited:not(.wp-block-button__link) {
    color: var(--wp--preset--color--base-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: var(--gcs-weight-link);
}
a:hover,
button[data-href="#gdpr_cookie_modal"]:hover {
    color: var(--wp--preset--color--brand);
    text-decoration: none;
}
a:focus,
button[data-href="#gdpr_cookie_modal"]:focus {
    color: var(--wp--preset--color--brand);
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
    text-decoration: none;
}

/* Cookie settings opens a dialog, so it is a button styled as a link */
button[data-href="#gdpr_cookie_modal"] {
    padding: 0;
    border: 0;
    background: none;
    letter-spacing: inherit;
    cursor: pointer;
}

/* Cover block link color
--------------------------------------------- */

/* !important is required: the a:link pseudo-class beats the wp-elements
   :where() selector, so a block-level override cannot win. */
.wp-block-cover a:link:not(.wp-block-button__link),
.wp-block-cover a:visited:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
}

.wp-block-cover a:hover:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
    text-decoration: underline;
    text-decoration-color: var(--wp--preset--color--border-base);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.wp-block-cover a:focus:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
    text-decoration-color: var(--wp--preset--color--border-base);
    text-decoration-thickness: 2px;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus-on-dark);
    outline-offset: var(--gcs-focus-offset);
}

/* 2. Buttons
---------------------------------------------------------------------------- */

/* Bookplate treatment
--------------------------------------------- */

/* Two-layer treatment matching the ivory-heirloom-logo-block in
   gcs-header.css. Cross-file dependency: ::before and ::after must match that
   block. Requires position: relative, overflow: hidden, isolation: isolate,
   and z-index on the pseudo-elements.
   Rationale: GCS Section Visual Treatments in Notion. */
.wp-block-button__link,
.wp-element-button {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Button text above both gradient layers */
.wp-block-button__link span,
.wp-element-button span {
    position: relative;
    z-index: 3;
}

/* Layer 1: white radial highlight, matches logo block ::before */
.wp-block-button__link::before,
.wp-element-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 30% 30%,
        rgba(255, 255, 255, 0.4) 0%,
        transparent 50%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
}

/* Layer 2: Rich Brown edge darkening, matches logo block ::after */
.wp-block-button__link::after,
.wp-element-button::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at center,
        transparent 0%,
        transparent 70%,
        rgba(42, 24, 16, 0.15) 100%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

/* Hover
--------------------------------------------- */

/* Hunter Green buttons invert to Warm Ivory background, Hunter Green text.
   !important is required: WordPress wp-elements inline rules set hover
   background-color and win by source order. The Hunter Green section's
   scoped hover rule has higher specificity and correctly overrides this. */
.wp-block-button__link:hover,
.wp-element-button:hover {
    background-color: var(--wp--preset--color--base) !important;
    color: var(--wp--preset--color--brand) !important;
}

/* Gradient layers hide on hover: the emboss recedes on press. */
.wp-block-button__link:hover::before,
.wp-element-button:hover::before,
.wp-block-button__link:hover::after,
.wp-element-button:hover::after {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.wp-block-button__link:focus,
.wp-element-button:focus {
    background-color: var(--wp--preset--color--base) !important;
    color: var(--wp--preset--color--brand) !important;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus) !important;
    outline-offset: var(--gcs-focus-offset) !important;
}

/* Cover photos take the dark-context ring. !important is required: the
   button focus rule above sets its outline with !important. */
.wp-block-cover .wp-block-button__link:focus,
.wp-block-cover .wp-element-button:focus {
    outline-color: var(--gcs-color-focus-on-dark) !important;
}

/* 3. Hunter Green sections
---------------------------------------------------------------------------- */

/* Global hover would put Hunter Green on Hunter Green, 1:1. !important is
   required: the block editor emits wp-elements rules in inline <style> tags
   that load after this sheet and win by source order despite :where(). */
.has-brand-background-color a:link:not(.wp-block-button__link),
.has-brand-background-color a:visited:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: var(--gcs-weight-link);
}
/* Hover and focus: gold underline, never gold text. Victorian Gold on
   Hunter Green measures 2.29:1 and fails WCAG 1.4.3 as text. */
.has-brand-background-color a:hover:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
    text-decoration: underline;
    text-decoration-color: var(--wp--preset--color--border-base);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.has-brand-background-color a:focus:not(.wp-block-button__link) {
    color: var(--wp--preset--color--brand-accent) !important;
    text-decoration-color: var(--wp--preset--color--border-base);
    text-decoration-thickness: 2px;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus-on-dark);
    outline-offset: var(--gcs-focus-offset);
}

/* Email link underline: Cloudflare email protection strips text-decoration.
   !important overrides third-party plugin output. */
.has-brand-background-color a[href*="cdn-cgi"],
.has-brand-background-color a[href^="mailto"] {
    text-decoration-line: underline !important;
    text-underline-offset: 3px !important;
}

/* !important is required to outrank the site-wide button hover rule above */
.has-brand-background-color .wp-block-button__link:hover,
.has-brand-background-color .wp-element-button:hover {
    background-color: var(--wp--preset--color--contrast-accent) !important;
    color: var(--wp--preset--color--brand-alt) !important;
}

/* !important is required to outrank the site-wide button focus rule above */
.has-brand-background-color .wp-block-button__link:focus,
.has-brand-background-color .wp-element-button:focus {
    background-color: var(--wp--preset--color--contrast-accent) !important;
    color: var(--wp--preset--color--brand-alt) !important;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus-on-dark) !important;
    outline-offset: var(--gcs-focus-offset) !important;
}

/* Footer stripe: the footer template part sets has-base-background-color on
   the group block, producing a ~27px ivory band. Scoped to .site-footer. */
.site-footer .wp-block-group.has-base-background-color.has-background {
    background-color: transparent !important;
}

/* Section margin-top bands: core sets margin-top 32px on every alignfull
   block, producing a visible ivory band. Interior is untouched. */
.wp-block-post-content .wp-block-group.alignfull {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 4. Images
---------------------------------------------------------------------------- */

/* Victorian gold oval image frame
--------------------------------------------- */

/* Applies to WordPress image blocks, testimonial images, and The events
   Calendar images. */
.entry-content .wp-block-image img,
.wp-block-post-content .wp-block-image img,
.wpmtst-testimonial img,
.wp-block-media-text .wp-block-media-text__media img,
.wp-block-gallery .wp-block-image img,
article .wp-post-image,
.post-thumbnail img,
/* The Events Calendar: events archive */
.tribe-events-calendar-latest-past__event-featured-image,
/* The Events Calendar: single event featured image */
.tribe-events-event-image img,
/* The Events Calendar: post type wrapper safety net */
.type-tribe_events img {
    border: 3px solid var(--wp--preset--color--border-base);
    border-radius: 50%;
    padding: 8px;
    background-color: var(--wp--preset--color--base);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* The tribe skeleton reset strips border and padding at equal specificity and
   loads later. The tooltip is named because it leaves the article on open. */
.tribe-common .type-tribe_events img,
.tribe-common .tribe-events-calendar-month__calendar-event-tooltip-featured-image {
    border: 3px solid var(--wp--preset--color--border-base);
    border-radius: 50%;
    padding: 8px;
    background-color: var(--wp--preset--color--base);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Exclusions: higher specificity prevents oval on non-content images */
.site-logo img,
.custom-logo,
.wp-block-site-logo img,
.ivory-heirloom-logo-block img,
.ivory-heirloom-logo-block .wp-block-site-logo img,
.wp-block-cover img,
.wp-block-cover__image-background,
nav img,
.wp-block-navigation img,
.ivory-heirloom-nav-block img,
button img,
.wp-block-button img,
img.no-oval,
.no-oval img,
/* The Events Calendar loading spinner: exclude from oval */
.tribe-events-spinner-medium {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

/* Victorian oval frame: explicit class
--------------------------------------------- */

/* Container frame, mirroring .img-victorian-rect: border, padding and radius
   sit on the element carrying the class, not on the media inside. Embeds get
   blunt ends so player controls are not clipped. */
.victorian-oval-frame {
    position: relative;
    display: inline-block;
    border: 3px solid var(--wp--preset--color--border-base);
    border-radius: 50%;
    padding: 8px;
    background-color: var(--wp--preset--color--base);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.victorian-oval-frame:has(iframe, video) {
    border-radius: 50% / 40%;
}

/* !important overrides the default oval, which resolves at (0,2,1) */
.victorian-oval-frame img,
.victorian-oval-frame iframe,
.victorian-oval-frame video {
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
    display: block;
}

/* !important overrides the default oval radius */
.victorian-oval-frame img {
    border-radius: 50% !important;
}

/* Smaller radius tucks the corners inside the blunt frame */
.victorian-oval-frame iframe,
.victorian-oval-frame video {
    border-radius: 46% / 36%;
}

/* Victorian oval frame: portrait class
--------------------------------------------- */

/* !important is required: the Events Calendar reset strips border, padding
   and margin inside its views. Embeds get blunt ends so player controls are
   not clipped. */
.victorian-oval-frame-portrait {
    position: relative;
    display: block !important;
    width: fit-content !important;
    margin-inline: auto !important;
    border: 3px solid var(--wp--preset--color--border-base) !important;
    border-radius: 50% !important;
    padding: 8px !important;
    background-color: var(--wp--preset--color--base) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

/* !important is required to override the frame radius above */
.victorian-oval-frame-portrait:has(iframe, video) {
    border-radius: 40% / 50% !important;
}

/* !important overrides the default oval, which resolves at (0,2,1) */
.victorian-oval-frame-portrait img,
.victorian-oval-frame-portrait iframe,
.victorian-oval-frame-portrait video {
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
    display: block;
}

/* !important overrides the default oval radius */
.victorian-oval-frame-portrait img {
    border-radius: 50% !important;
    aspect-ratio: 3 / 4;
    object-fit: cover;
}

/* Smaller radius tucks the corners inside the blunt frame */
.victorian-oval-frame-portrait iframe,
.victorian-oval-frame-portrait video {
    border-radius: 36% / 46%;
    aspect-ratio: 9 / 16;
    width: 100%;
    height: auto;
}

/* Add alongside an oval frame class when the subjects sit low in the photo */
.oval-focus-lower img {
    object-position: center 70%;
}

/* Victorian rectangular border
--------------------------------------------- */

/* Non-portrait photography: venue, architectural, landscape, object.
   Corner ornaments use Rumble Brave Ornaments glyph 9 (U=0039), mirrored in
   four orientations, not rotated. Usage: wrap the image in
   <div class="img-victorian-rect"> or add the class to the wp-block-image
   container.
   Rationale: GCS Section Visual Treatments in Notion. */
.img-victorian-rect {
    position: relative;
    display: block;
    width: fit-content;
    margin-inline: auto;
    border: 3px solid var(--wp--preset--color--border-base);
    padding: 8px;
    background-color: var(--wp--preset--color--base);
    border-radius: 2px;
}

/* Centers a frame the author marked centered. alignfull sets negative margins
   but cannot set a width on an inline-block, so the box parks at x=0.
   !important is required: LiteSpeed CSS Combine hoists this file above the
   inline global styles for guests, inverting source order. */
.img-victorian-rect.has-text-align-center {
    display: block !important;
    width: fit-content !important;
    margin-inline: auto !important;
}

/* Embedded video: the frame needs a definite width for the iframe to resolve
   a percentage against. fit-content collapses here because an iframe with no
   width attribute falls back to the 300x150 HTML default. */
.img-victorian-rect.img-victorian-embed {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 822px !important;
}

.img-victorian-rect.img-victorian-embed iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}

.img-victorian-rect img {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
    display: block;
    width: 100%;
    height: auto;
}

/* Corner ornament shared styles */
.img-victorian-rect .corner-ornament {
    font-family: 'Rumble Brave Ornaments', serif;
    color: var(--wp--preset--color--border-base);
    position: absolute;
    font-size: 1.25em;
    line-height: 1;
    width: 1.25em;
    height: 1.25em;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

/* Top-left: base orientation */
.img-victorian-rect .corner-tl {
    top: -0.5em;
    left: -0.5em;
    transform: scale(1, 1);
}

/* Top-right: horizontal flip */
.img-victorian-rect .corner-tr {
    top: -0.5em;
    right: -0.5em;
    transform: scale(-1, 1);
}

/* Bottom-left: vertical flip */
.img-victorian-rect .corner-bl {
    bottom: -0.5em;
    left: -0.5em;
    transform: scale(1, -1);
}

/* Bottom-right: both flips */
.img-victorian-rect .corner-br {
    bottom: -0.5em;
    right: -0.5em;
    transform: scale(-1, -1);
}

/* Victorian gallery: mixed frames in one grid
--------------------------------------------- */

/* Scoped to galleries with .gcs-gallery. Frame classes size themselves for
   standalone images and break the grid, so each frame moves to the img.
   !important is required: the frame classes set it, and core's gallery
   rules use an ID selector. Assumes default columns. */
.wp-block-gallery.gcs-gallery figure.wp-block-image {
    display: flex !important;
    justify-content: flex-start !important;
    width: calc(50% - var(--wp--style--unstable-gallery-gap, 16px) / 2) !important;
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

@media (min-width: 600px) {
    .wp-block-gallery.gcs-gallery figure.wp-block-image {
        width: calc(33.33333% - var(--wp--style--unstable-gallery-gap, 16px) * 0.66667) !important;
    }
}

.wp-block-gallery.gcs-gallery figure.wp-block-image img {
    flex: none !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    box-sizing: border-box;
    border: 3px solid var(--wp--preset--color--border-base) !important;
    padding: 8px !important;
    border-radius: 50% !important;
    background-color: var(--wp--preset--color--base) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

/* Half-width portrait oval keeps row heights equal */
.wp-block-gallery.gcs-gallery figure.victorian-oval-frame-portrait img {
    width: 50% !important;
    aspect-ratio: 3 / 4;
    align-self: center;
}

.wp-block-gallery.gcs-gallery figure.img-victorian-rect img {
    border-radius: 2px !important;
}

/* Credits sit below the frame, not over the photo. !important is required:
   core's caption rules match at equal specificity and can load later */
.wp-block-gallery.gcs-gallery figure.wp-block-image:has(figcaption)::before {
    content: none !important;
}

.wp-block-gallery.gcs-gallery figure.wp-block-image figcaption {
    position: static !important;
    flex: none !important;
    max-height: none !important;
    padding: 0.5em 0 0 !important;
    background: none !important;
    color: var(--wp--preset--color--contrast) !important;
    text-shadow: none !important;
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-size: 12px !important;
    line-height: 1.3;
}

/* Lightbox, site-wide: the overlay shows the grid's crop through a fixed
   window, so the img fills it and the frame follows the visible crop.
   !important is required: core sizes the overlay img in fixed pixels */
.wp-lightbox-overlay .wp-block-image {
    display: flex !important;
    width: 100% !important;
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.wp-lightbox-overlay .wp-block-image img {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: cover;
    box-sizing: border-box;
    border: 3px solid var(--wp--preset--color--border-base) !important;
    padding: 8px !important;
    border-radius: 50% !important;
    background-color: var(--wp--preset--color--base) !important;
}

.wp-lightbox-overlay .wp-block-image.img-victorian-rect img {
    border-radius: 2px !important;
}

.wp-lightbox-overlay .wp-block-image.no-oval img {
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
}

/* Enlarge buttons: each is hidden and stretched over its photo, so the whole
   photo opens the lightbox and Tab reaches every photo. !important is
   required: WordPress writes the button position inline */
.wp-block-gallery.gcs-gallery .wp-lightbox-container button {
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    opacity: 0;
    border-radius: 0;
}

/* Keyboard focus shows only the focus ring. !important: for guests, core's
inline image CSS loads after the combined sheet and wins an equal-
specificity tie */
.wp-block-gallery.gcs-gallery .wp-lightbox-container button:focus-visible {
    opacity: 1;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--wp--preset--color--border-contrast);
    outline-offset: var(--gcs-focus-offset);
    background-color: transparent !important;
    backdrop-filter: none !important;
}

.wp-block-gallery.gcs-gallery .wp-lightbox-container button:focus-visible svg {
    display: none;
}

/* Half-width portrait oval. !important is required: position is set inline */
.wp-block-gallery.gcs-gallery figure.victorian-oval-frame-portrait button {
    left: 25% !important;
    width: 50%;
    aspect-ratio: 3 / 4;
}

/* Lightbox controls meet the touch-target minimum */
.wp-lightbox-overlay .wp-lightbox-close-button,
.wp-lightbox-overlay .wp-lightbox-navigation-button-prev,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next {
    min-width: 44px;
    min-height: 44px;
}

/* 5. Testimonials
---------------------------------------------------------------------------- */

/* Strong Testimonials, Unstyled template: full CSS control, no plugin styles
   compete. DOM hooks: div.wpmtst-testimonial-content,
   .wpmtst-testimonial-field.testimonial-name,
   .wpmtst-testimonial-field.testimonial-company. */

/* Testimonial content: IM Fell DW Pica italic */
.wpmtst-testimonial-content,
.testimonial-content {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-size: var(--gcs-body);
    line-height: var(--gcs-lh-body);
    color: var(--wp--preset--color--contrast);
    font-style: italic;
    margin-bottom: 1rem;
    text-align: center;
}

/* Name field: Meddon script signature, renders below content as attribution */
.wpmtst-testimonial-field.testimonial-name,
.wpmtst-client .testimonial-name {
    font-family: 'Meddon', cursive;
    font-size: var(--gcs-signature-size);
    color: var(--wp--preset--color--brand-alt);
    font-weight: var(--gcs-weight-signature);
    text-align: center;
    display: block;
    margin-top: 1rem;
    line-height: var(--gcs-lh-signature);
}

/* Company and position: IM Fell DW Pica italic, Saddle Brown */
.wpmtst-testimonial-field.testimonial-company,
.wpmtst-client .testimonial-company {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-size: var(--gcs-small);
    color: var(--wp--preset--color--base-accent);
    font-style: italic;
    text-align: center;
}

/* Tributes ornamental system
--------------------------------------------- */

/* Scope: .strong-view-id-3 only. The homepage rotator is .strong-view-id-1;
   both emit .wpmtst-testimonial with the same post IDs, so every selector
   below must stay prefixed.
   Markup injected by wavlt_tributes_ornaments() in functions-gcs.php.
   L6: solid #B8860B base, #D4AF37 gradient over, zero offset.
   Rationale: GCS Tributes Page — Ornamental System Decision Record §14 in
   Notion. */

/* Shared ornament structure */

.strong-view-id-3 .gcs-orn {
    display: block;
    text-align: center;
    line-height: 1;
    pointer-events: none;
}

/* Layer stack: both layers occupy one box at zero offset */
.strong-view-id-3 .gcs-orn-stack {
    position: relative;
    display: inline-block;
}

.strong-view-id-3 .gcs-orn-layer {
    display: block;
    white-space: nowrap;
}

/* Gradient over base: later in source order, paints on top */
.strong-view-id-3 .gcs-orn-layer-grad {
    position: absolute;
    left: 0;
    top: 0;
}

.strong-view-id-3 .gcs-orn-half {
    display: inline-block;
    line-height: 1;
}

/* Layer fonts and colors: applies to caps and dividers alike */
.strong-view-id-3 .gcs-orn-layer-base .gcs-orn-half {
    font-family: 'Rumble Brave Ornaments', serif;
    color: #B8860B;
}

.strong-view-id-3 .gcs-orn-layer-grad .gcs-orn-half {
    font-family: 'Rumble Brave Ornaments Gradient', serif;
    color: #D4AF37;
}

/* Caps: `i` at 56px, join -28px, 14px per half */

.strong-view-id-3 .gcs-cap .gcs-orn-half {
    font-size: 3.5rem; /* 56px */
}

.strong-view-id-3 .gcs-cap-head { margin-bottom: 1.75rem; } /* 28px */
.strong-view-id-3 .gcs-cap-tail { margin-top: 1.75rem; }

/* Head cap: horizontal mirror */
.strong-view-id-3 .gcs-cap-head .gcs-orn-half-l {
    transform: translateX(14px);
}
.strong-view-id-3 .gcs-cap-head .gcs-orn-half-r {
    transform: scaleX(-1) translateX(14px);
}

/* Tail cap: vertical mirror of the head */
.strong-view-id-3 .gcs-cap-tail .gcs-orn-half-l {
    transform: scaleY(-1) translateX(14px);
}
.strong-view-id-3 .gcs-cap-tail .gcs-orn-half-r {
    transform: scale(-1, -1) translateX(14px);
}

/* Dividers: `H` at 40px, join -16px, 8px per half */

/* One blank line of body text above and below.
   Derived from content type 20px x 1.7 = 34px line box.
   Does not step responsively; content type doesn't either. */
.strong-view-id-3 .gcs-divider {
    margin: 2.125rem 0; /* 34px, 108px total rhythm */
}

.strong-view-id-3 .gcs-divider .gcs-orn-half {
    font-size: 2.5rem; /* 40px */
}

.strong-view-id-3 .gcs-divider .gcs-orn-half-l {
    transform: translateX(8px);
}
.strong-view-id-3 .gcs-divider .gcs-orn-half-r {
    transform: scaleX(-1) translateX(8px);
}

/* Empty-view guard: no caps floating on an empty view */
.strong-view-id-3 .strong-content:empty + .gcs-cap,
.strong-view-id-3 .strong-content:empty .gcs-cap {
    display: none;
}

/* Anchor landing: header is static, clears the divider block above */
.strong-view-id-3 .wpmtst-testimonial[id^="testimonial-"] {
    scroll-margin-top: 6rem; /* 96px */
}

/* Print: ornaments are screen decoration */
@media print {
    .strong-view-id-3 .gcs-orn { display: none; }
}

/* ---- Responsive: em-based steps ---- */

@media (max-width: 48em) { /* 768px */
    .strong-view-id-3 .gcs-cap .gcs-orn-half { font-size: 2.75rem; } /* 44px */
    .strong-view-id-3 .gcs-cap-head .gcs-orn-half-l {
        transform: translateX(11px);
    }
    .strong-view-id-3 .gcs-cap-head .gcs-orn-half-r {
        transform: scaleX(-1) translateX(11px);
    }
    .strong-view-id-3 .gcs-cap-tail .gcs-orn-half-l {
        transform: scaleY(-1) translateX(11px);
    }
    .strong-view-id-3 .gcs-cap-tail .gcs-orn-half-r {
        transform: scale(-1, -1) translateX(11px);
    }

    .strong-view-id-3 .gcs-divider .gcs-orn-half { font-size: 2rem; } /* 32px */
    .strong-view-id-3 .gcs-divider .gcs-orn-half-l {
        transform: translateX(6px);
    }
    .strong-view-id-3 .gcs-divider .gcs-orn-half-r {
        transform: scaleX(-1) translateX(6px);
    }
}

@media (max-width: 30em) { /* 480px */
    .strong-view-id-3 .gcs-cap .gcs-orn-half { font-size: 2.25rem; } /* 36px */
    .strong-view-id-3 .gcs-cap-head .gcs-orn-half-l {
        transform: translateX(9px);
    }
    .strong-view-id-3 .gcs-cap-head .gcs-orn-half-r {
        transform: scaleX(-1) translateX(9px);
    }
    .strong-view-id-3 .gcs-cap-tail .gcs-orn-half-l {
        transform: scaleY(-1) translateX(9px);
    }
    .strong-view-id-3 .gcs-cap-tail .gcs-orn-half-r {
        transform: scale(-1, -1) translateX(9px);
    }

    .strong-view-id-3 .gcs-divider .gcs-orn-half { font-size: 1.75rem; } /* 28px */
    .strong-view-id-3 .gcs-divider .gcs-orn-half-l {
        transform: translateX(5px);
    }
    .strong-view-id-3 .gcs-divider .gcs-orn-half-r {
        transform: scaleX(-1) translateX(5px);
    }
}

/* Testimonial slider navigation
--------------------------------------------- */

/* Strong Testimonials injects nav as A.wpmslider-prev and A.wpmslider-next.
   The earlier .wpmtst-prev and .cycle-prev selectors matched nothing.
   !important: plugin CSS loads after theme. */
.wpmslider-prev,
.wpmslider-next {
    color: var(--wp--preset--color--contrast) !important;
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    min-width: 44px;
    min-height: var(--gcs-touch-min);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

.wpmslider-prev:hover,
.wpmslider-next:hover {
    color: var(--wp--preset--color--border-base) !important;
    text-decoration: none !important;
}

/* 6. Accessibility
---------------------------------------------------------------------------- */

.skip-link.screen-reader-text {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--brand);
    font-family: 'IM Fell DW Pica', Georgia, serif;
    font-size: var(--gcs-small);
    font-weight: var(--gcs-weight-link);
    padding: 1rem 1.5rem;
    position: absolute;
    top: -100%;
    left: 0;
    z-index: 100000;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    border: 3px solid var(--wp--preset--color--border-base);
    border-radius: 2px;
}

.skip-link.screen-reader-text:focus {
    top: 0;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
}

*:focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* Gold rings are too dark to see on Hunter Green and cover photos */
.has-brand-background-color :focus-visible,
.wp-block-cover :focus-visible {
    outline-color: var(--gcs-color-focus-on-dark);
}

/* !important is required: TEC focus rules strip the ring or add a shadow */
:is(.tribe-common, .tribe-events) :focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus) !important;
    outline-offset: var(--gcs-focus-offset) !important;
    box-shadow: none !important;
}

/* !important is required: the TEC ring rule above is also !important */
:is(.tribe-common, .tribe-events) :is(input, textarea, select):focus-visible {
    outline-color: var(--wp--preset--color--brand-alt) !important;
}

/* The body prefix outranks the parent theme's off-brand field focus ring */
body :is(input, textarea, select):focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--wp--preset--color--brand-alt);
    outline-offset: var(--gcs-focus-offset);
}

/* The body prefix outranks Strong Testimonials' outline 0 on slider links */
body .strong-view .wpmslider-controls a:focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* The body prefix outranks Popup Maker's outline none on the content box */
body .pum-container .pum-content:focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

@media (prefers-contrast: high) {
    html body {
        background: #FFFFFF;
        color: #000000;
    }
    a {
        color: #0000EE !important;
        text-decoration: underline;
    }
    /* !important plus matching specificity is required: the cover block
       link rule near the top of this file is also !important, so this
       override must tie on specificity and win on document order. */
    .wp-block-cover a:link:not(.wp-block-button__link),
    .wp-block-cover a:visited:not(.wp-block-button__link) {
        color: #0000EE !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* 7. Ninja Forms
---------------------------------------------------------------------------- */

/* Popup Maker theme must be set to Content Only, theme ID 330. The default
   Theme wrapper conflicts with these styles. */

/* Form container: Victorian Gold border, Warm Ivory background */
.nf-form-cont {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    background-color: var(--wp--preset--color--base);
    border: 3px solid var(--wp--preset--color--border-base);
    padding: 2rem;
    border-radius: 2px;
    max-width: 680px;
    margin: 0 auto;
}

/* .nf-form-title is a span rendered directly, no h3 child. */
.nf-form-title {
    font-family: var(--wp--preset--font-family--sorts-mill-goudy), Georgia, serif;
    font-size: 28px;
    color: var(--wp--preset--color--brand-alt);
    margin-bottom: 1.5rem;
    text-align: center;
    display: block;
}

/* Field labels */
.nf-field-label label,
.nf-field-label .nf-label-span {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-weight: var(--gcs-weight-body);
    color: var(--wp--preset--color--contrast);
    font-size: var(--gcs-form-error);
    margin-bottom: 8px;
    display: block;
}

/* Required field indicator */
.nf-field-label .req {
    color: var(--wp--preset--color--brand);
}

/* Input fields: text, email, tel, date, number, textarea, select */
.nf-field input[type="text"],
.nf-field input[type="email"],
.nf-field input[type="tel"],
.nf-field input[type="date"],
.nf-field input[type="number"],
.nf-field textarea,
.nf-field select {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-size: var(--gcs-input);
    color: var(--wp--preset--color--contrast);
    background-color: var(--wp--preset--color--base);
    border: 2px solid var(--wp--preset--color--border-base);
    padding: 12px 16px;
    min-height: var(--gcs-touch-preferred);
    width: 100%;
    border-radius: 2px;
    transition: all 0.3s ease;
}

/* Focus state: Deep Purple outline, WCAG compliant */
.nf-field input:focus,
.nf-field textarea:focus,
.nf-field select:focus {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--wp--preset--color--brand-alt);
    outline-offset: var(--gcs-focus-offset);
    border-color: var(--wp--preset--color--brand-alt);
}

/* Hunter Green with Warm Ivory text and a Victorian Gold border. */
.nf-form-cont .submit-container input[type="button"],
.nf-form-cont .submit-container input[type="submit"],
.nf-form-cont .nf-field input[type="button"] {
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
    font-weight: var(--gcs-weight-button);
    font-size: var(--gcs-form-error);
    background-color: var(--wp--preset--color--brand);
    color: var(--wp--preset--color--brand-accent);
    border: 2px solid var(--wp--preset--color--border-base);
    padding: 14px 32px;
    min-height: var(--gcs-touch-preferred);
    min-width: 120px;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(53, 94, 59, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Submit button hover */
.nf-form-cont .submit-container input[type="button"]:hover,
.nf-form-cont .submit-container input[type="submit"]:hover,
.nf-form-cont .nf-field input[type="button"]:hover {
    background-color: var(--wp--preset--color--brand-alt);
    border-color: var(--wp--preset--color--brand-alt);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(53, 94, 59, 0.35);
}

/* Submit button focus */
.nf-form-cont .submit-container input[type="button"]:focus,
.nf-form-cont .submit-container input[type="submit"]:focus,
.nf-form-cont .nf-field input[type="button"]:focus {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* Error messages */
.nf-error-msg,
.nf-error .nf-field-element::after {
    color: #d32f2f;
    font-weight: var(--gcs-weight-emphasis);
    font-size: var(--gcs-form-error);
    font-family: var(--wp--preset--font-family--im-fell-dw-pica), Georgia, serif;
}

/* Success messages */
.nf-pass .nf-field-element::after {
    color: var(--wp--preset--color--brand);
    font-weight: var(--gcs-weight-emphasis);
}

/* Field spacing */
.nf-field-container {
    margin-bottom: 1.25rem;
}

/* 8. The Events Calendar
---------------------------------------------------------------------------- */

/* Load order governs this whole section: the tribe skeleton, common and
   views-full sheets all load after the theme sheet. Every !important below
   exists for that reason. */

/* Text color
--------------------------------------------- */

/* Plugin sets near-black rgb(20,24,39) across month header, event titles,
   view selector, search input, date numbers and venue text. !important:
   common-full.css and views-full.css load after the theme sheet. */
.tribe-events-c-top-bar__datepicker-button,
.tribe-events-c-top-bar__datepicker-time,
.tribe-events-c-top-bar__datepicker-mobile,
.tribe-events-c-top-bar__datepicker-desktop,
.tribe-events-c-view-selector__button-text,
.tribe-events-c-view-selector__list-item-text,
.tribe-common-form-control-text__input,
.tribe-events-calendar-list__month-separator-text,
.tribe-events-calendar-list__event-date-tag-daynum,
.tribe-events-calendar-list__event-date-tag-weekday,
.tribe-events-calendar-list__event-venue,
.tribe-events-calendar-month__grid-cell-date-link,
.tribe-events-calendar-month__calendar-event-title a {
    color: var(--wp--preset--color--contrast) !important;
}

/* Passed event notice
--------------------------------------------- */

/* Plugin default is light blue on blue. Replaced with Aged Parchment,
   Rich Brown text and a Victorian Gold border. */
.tribe-events-notices {
    background-color: var(--wp--preset--color--contrast-accent) !important;
    color: var(--wp--preset--color--contrast) !important;
    border-color: var(--wp--preset--color--border-base) !important;
}

/* Single event width
--------------------------------------------- */

/* views-skeleton.css loads after the theme sheet and sets max-width: none,
   so max-width needs !important. Margin and padding longhand beat the
   plugin's shorthand without it. Content size resolves to theme.json
   contentSize, currently 800px, and follows any change there. */

/* #tribe-events-content carries .tribe-events-single: it is the container,
   not a parent. Prefixing with the body class outranks the plugin's plain ID
   rule, so padding wins without !important. max-width keeps !important
   because plugin skeleton CSS overrides it explicitly. */
body.single-tribe_events #tribe-events-content {
    max-width: var(--wp--style--global--content-size) !important;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

/* Single event featured image caption
--------------------------------------------- */

/* Added by a PHP filter only when the image has a Media Library caption */
.gcs-fi-caption {
    font-size: var(--gcs-small);
}

/* The Events Calendar buttons
--------------------------------------------- */

/* Find Events is position: static; relative is required before the bookplate
   pseudo-elements will place. !important on colors only: common-full.css
   loads after the theme sheet. Infrastructure rules do not need it. */

/* Infrastructure: Subscribe/Add to Calendar */
.tribe-common-c-btn-border,
.tribe-events-c-subscribe-dropdown__button {
    overflow: hidden;
    isolation: isolate;
}

/* Infrastructure: Find Events */
.tribe-common-c-btn {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Font 14px to 1rem, min-height 41px to 44px for the WCAG 2.5.5 touch
   target, border 1px to 2px. Padding keeps interior spacing adequate
   at 44px. */
.tribe-common-c-btn-border,
.tribe-events-c-subscribe-dropdown__button {
    background-color: var(--wp--preset--color--base) !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    min-height: var(--gcs-touch-min) !important;
    border-width: 2px !important;
    border-radius: 2px !important;
    padding: 0.75rem 1.25rem !important;
}

/* Find Events: WCAG fix + brand compliance */
.tribe-common-c-btn {
    background-color: var(--wp--preset--color--brand) !important;
    color: var(--wp--preset--color--brand-accent) !important;
    font-weight: 400 !important;
    border: 2px solid var(--wp--preset--color--border-base) !important;
    border-radius: 2px !important;
}

/* Cross-file dependency: must match the logo block ::before. No !important
   needed: not set by plugin CSS. */
.tribe-common-c-btn-border::before,
.tribe-events-c-subscribe-dropdown__button::before,
.tribe-common-c-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 30% 30%,
        rgba(255, 255, 255, 0.4) 0%,
        transparent 50%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
}

/* Cross-file dependency: must match the logo block ::after. */
.tribe-common-c-btn-border::after,
.tribe-events-c-subscribe-dropdown__button::after,
.tribe-common-c-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at center,
        transparent 0%,
        transparent 70%,
        rgba(42, 24, 16, 0.15) 100%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

/* Hover. Cross-file dependency: must match the global
   .wp-block-button__link hover rule. */
.tribe-common-c-btn-border:hover,
.tribe-events-c-subscribe-dropdown__button:hover,
.tribe-common-c-btn:hover {
    background-color: var(--wp--preset--color--contrast-accent) !important;
    color: var(--wp--preset--color--brand-alt) !important;
    border-color: var(--wp--preset--color--border-contrast) !important;
}

.tribe-common-c-btn-border:hover::before,
.tribe-events-c-subscribe-dropdown__button:hover::before,
.tribe-common-c-btn:hover::before,
.tribe-common-c-btn-border:hover::after,
.tribe-events-c-subscribe-dropdown__button:hover::after,
.tribe-common-c-btn:hover::after {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Subscribe button color
--------------------------------------------- */

/* Gold text on a light background is never used. Hunter Green replaces it. */
.tribe-common-c-btn-border,
.tribe-events-c-subscribe-dropdown__button {
    color: var(--wp--preset--color--brand) !important;
}

/* Event website link button
--------------------------------------------- */

/* Plugin renders this as a classless <a> with gold background and white text.
   !important extends to position, overflow and isolation because the plugin
   sets conflicting values on them. */
.tribe-block__event-website a {
    background-color: var(--wp--preset--color--brand) !important;
    color: var(--wp--preset--color--brand-accent) !important;
    font-weight: 400 !important;
    border: 2px solid var(--wp--preset--color--border-base) !important;
    border-radius: 2px !important;
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    display: inline-block;
    padding: 0.6em 1.2em;
    text-decoration: none !important;
}

/* Bookplate gradient: ::before white highlight */
.tribe-block__event-website a::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 30% 30%,
        rgba(255, 255, 255, 0.4) 0%,
        transparent 50%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
}

/* Bookplate gradient: ::after Rich Brown edge darkening */
.tribe-block__event-website a::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at center,
        transparent 0%,
        transparent 70%,
        rgba(42, 24, 16, 0.15) 100%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

/* Hover: inversion pattern */
.tribe-block__event-website a:hover {
    background-color: var(--wp--preset--color--base) !important;
    color: var(--wp--preset--color--brand) !important;
}

.tribe-block__event-website a:hover::before,
.tribe-block__event-website a:hover::after {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Venue name
--------------------------------------------- */

/* Plugin renders the venue name as a classless H3 at 14px. Deep Purple is
   correct and retained. !important: views-full.css loads after the theme
   sheet. */
.tribe-block__venue__name h3 {
    font-size: 1rem !important;
    color: var(--wp--preset--color--brand-alt) !important;
}

/* Venue address and phone
--------------------------------------------- */

/* Near-black to Rich Brown, 14px to 16px. !important: plugin CSS loads
   after theme. */
.tribe-block__venue__address,
.tribe-block__venue__phone,
.tribe-block__venue__tel {
    color: var(--wp--preset--color--contrast) !important;
    font-size: 1rem !important;
}

/* Subscribe button border
--------------------------------------------- */

/* Computed border resolves to blue despite --tec-color-accent-primary being
   set correctly. Cause is an unexplained browser default bleed on the DIV,
   not a cascade conflict, so specificity alone cannot win it. !important
   forces Victorian Gold. */
.tribe-common-c-btn-border,
.tribe-events-c-subscribe-dropdown__button {
    border-color: var(--wp--preset--color--border-base) !important;
}

/* Datepicker active month
--------------------------------------------- */

/* Plugin sets Victorian Gold background on the active month via
   views-full.css; gold is never a background for readable text.
   !important: views-full.css loads after the theme sheet. */
.tribe-events .datepicker .month.active,
.tribe-events .datepicker .month.active:hover,
.tribe-events .datepicker .month.focused.active {
    background: var(--wp--preset--color--brand) !important;
    color: var(--wp--preset--color--brand-accent) !important;
}

/* Datepicker current month
--------------------------------------------- */

/* Plugin sets Victorian Gold text on .month.current; gold is never used for
   readable text on light backgrounds. Aged Parchment background distinguishes
   the current month without filling the tile. !important: views-full.css
   loads after the theme sheet. */
.tribe-events .datepicker .month.current {
    color: var(--wp--preset--color--contrast) !important;
    background: var(--wp--preset--color--contrast-accent) !important;
}

.tribe-events .datepicker .month.current:hover {
    color: var(--wp--preset--color--brand-accent) !important;
    background: var(--wp--preset--color--brand) !important;
}

/* Calendar views rect frame
--------------------------------------------- */

/* Follows the single event's frame choice, so logos are not cropped by the
   oval. The tribe skeleton reset strips .img-victorian-rect in every view, so
   its values are restated at higher specificity. */
.tribe-events-calendar-list__event-featured-image-wrapper .img-victorian-rect,
.tribe-events-calendar-latest-past__event-featured-image-wrapper .img-victorian-rect,
.tribe-events-calendar-day__event-featured-image-wrapper .img-victorian-rect,
.tribe-events-calendar-month__calendar-event-featured-image-wrapper .img-victorian-rect,
.tribe-events-calendar-month__calendar-event-tooltip-featured-image-wrapper .img-victorian-rect,
.tribe-events-calendar-month-mobile-events__mobile-event-featured-image-wrapper .img-victorian-rect {
    max-width: 100%;
    box-sizing: border-box;
    border: 3px solid var(--wp--preset--color--border-base);
    padding: 8px;
    background-color: var(--wp--preset--color--base);
    border-radius: 2px;
    margin-inline: auto;
}

/* List view font size
--------------------------------------------- */

/* Scoped to .tribe-events-calendar-list. Month and day grid cells are not
   affected: list view has no grid width constraint, they do. !important:
   the plugin sheets load after the theme sheet. */
.tribe-events-calendar-list .tribe-events-calendar-list__event-datetime,
.tribe-events-calendar-list .tribe-events-calendar-list__event-description p,
.tribe-events-calendar-list .tribe-block__venue,
.tribe-events-calendar-list .tribe-events-calendar-list__event-venue {
    font-size: 1rem !important;
}

/* Events list pre-breakpoint layout guard
--------------------------------------------- */

/* The plugin adds its breakpoint-medium class with JavaScript, so the list
   paints in column flow first and the featured image jumps left to right.
   These rules restate the resolved geometry. Rationale: GCS Section Visual
   Treatments in Notion */
@media (min-width: 768px) { /* TEC breakpoint-medium threshold */
    .tribe-events-view.tribe-events .tribe-events-calendar-list__event {
        display: flex;
        flex-direction: row-reverse;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    .tribe-events-view.tribe-events .tribe-events-calendar-list__event-featured-image-wrapper {
        flex: 0 0 37.5%;
        max-width: 37.5%;
    }
    .tribe-events-view.tribe-events .tribe-events-calendar-list__event-details {
        flex: 0 0 62.5%;
        max-width: 62.5%;
    }
}

/* Events header pre-breakpoint layout guard
--------------------------------------------- */

/* Same cause as the list guard above: the plugin adds its breakpoint class
   with JavaScript, so the header paints at its pre-breakpoint size and the
   list below it drops when the class lands. These reservations hold the
   resolved geometry and go inert once the class applies. Measurements and
   the re-measurement trigger: GCS Section Visual Treatments in Notion */
@media (min-width: 768px) { /* TEC breakpoint-medium threshold */
    .tribe-events .tribe-events-header {
        min-height: 168px;
    }
    /* Specificity 0,3,0 is load-bearing: TEC views-skeleton.css uses the
       same 0,2,0 selector and loads later, winning on source order. */
    .tribe-events[data-js="tribe-events-view"] .tribe-events-l-container {
        padding-top: 96px;
    }
    /* First list row: TEC swaps to a 0,4,0 breakpoint-gated selector for this
       margin, so 0,5,0 is required. A 0,4,0 match would tie and lose on source
       order. Value is TEC's resolved post-breakpoint 40px. */
    .tribe-events[data-js="tribe-events-view"] .tribe-events-calendar-list__month-separator
    + .tribe-events-calendar-list__event-row.tribe-common-g-row {
        margin-top: 40px;
    }
    /* Container gutter: TEC swaps this to --tec-grid-gutter-page when its
       breakpoint class lands after first paint, reflowing the view. Pre-applying
       the resolved value removes the reflow. 0,3,0 clears TEC's 0,2,0 base. */
    .tribe-common .tribe-common-l-container.tribe-events-l-container {
        padding-left: var(--tec-grid-gutter-page);
        padding-right: var(--tec-grid-gutter-page);
    }
}

/* Narrow screens: TEC's list rows extend past the page edge and the page
   scrolls sideways. Clipping horizontal overflow stops it. */
.tribe-events .tribe-events-l-container {
    overflow-x: clip;
}

/* 9. Mobile nav overlay
---------------------------------------------------------------------------- */

/* !important: the block library sets the container background by source
   order, so specificity alone cannot win. */
.wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--base) !important;
    border-right: 2px solid var(--wp--preset--color--border-base);
}

/* 10. Page title
---------------------------------------------------------------------------- */

/* Specificity h1.wp-block-post-title (0,1,1) beats Ollie's default
   :root :where(.wp-block-post-title) (0,0,1). No !important needed.
   Rationale: Design Tokens Decision Record §16 in Notion. */
h1.wp-block-post-title {
    font-family: var(--wp--preset--font-family--rumble-brave);
    color: var(--wp--preset--color--brand);
    text-align: center;
    font-weight: var(--gcs-weight-h1);
}

/* Rendered by a tribe template, not a block, so the editor cannot align it */
.tribe-events-single-event-title {
    text-align: center;
}

/* 11. 404 page
---------------------------------------------------------------------------- */

/* Exception to the site H1 standard. Scoped to .error404 so no other
   H1 inherits it. */
.error404 .gcs-404-quote {
  font-family: var(--wp--preset--font-family--sorts-mill-goudy);
  font-style: italic;
  font-weight: 400;
  font-size: 1.5rem;
  color: var(--wp--preset--color--brand);
}
@media (min-width: 782px) {
  .error404 .gcs-404-quote {
    font-size: 2rem;
  }
}

/* 12. Postscript
---------------------------------------------------------------------------- */

/* Weight 600 is browser synthesis; Meddon ships 400 only, as with the
   testimonial signature. The aside inherits body size, never reduced. */
.gcs-postscript {
  margin: 2rem 0;
  padding: 0 2rem;
}

.gcs-postscript-mark {
  font-family: var(--wp--preset--font-family--meddon);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--gcs-color-signature);
  margin-block-end: 0.5rem;
}

.gcs-postscript-text {
  font-family: var(--wp--preset--font-family--sorts-mill-goudy);
  font-style: italic;
  font-weight: 400;
  margin-block-start: 0;
}

/* 13. Cookie consent
---------------------------------------------------------------------------- */

/* GDPR Cookie Compliance loads after the theme stylesheets and matches with
   single-ID selectors. A doubled ID outranks every plugin rule, so no rule
   in this section needs !important. */

/* Banner
--------------------------------------------- */

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar p {
    color: var(--wp--preset--color--contrast);
    font-size: var(--wp--preset--font-size--small);
    line-height: var(--gcs-lh-body);
}

/* The "settings" control inside the notice text reads as a link */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .moove-gdpr-cookie-notice button.change-settings-button {
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    color: var(--wp--preset--color--brand-alt);
    text-decoration: underline;
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .moove-gdpr-cookie-notice button.change-settings-button:hover {
    color: var(--wp--preset--color--brand);
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .moove-gdpr-cookie-notice button.change-settings-button:focus {
    color: var(--wp--preset--color--brand);
    box-shadow: none;
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* Modal
--------------------------------------------- */

#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-modal-content {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
}

#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-modal-right-content {
    background-color: var(--wp--preset--color--contrast-accent);
}

#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .cookie-switch .gdpr-sr-enable {
    color: var(--wp--preset--color--brand);
}

#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-tab-main-content a {
    color: var(--wp--preset--color--brand-alt);
    text-decoration: underline;
}

/* The plugin removes the outline from modal buttons and links, so the site
   focus ring is restored */
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-modal-close:focus-visible,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-tab-main-content a:focus-visible {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* The plugin's keyboard script marks its current stop with .focus-g; the
   disabled Necessary switch can't take real focus, so the ring follows it */
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .cookie-switch.focus-g {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* Real focus stays behind at the switch stop, so its stale ring is removed */
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal:has(.focus-g) :focus-visible:not(.focus-g) {
    outline: none;
}

/* The plugin's keyboard state on Close ignores the branding colors */
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-modal-close.focus-g span.gdpr-icon,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .moove-gdpr-modal-close.focus-g i {
    color: var(--wp--preset--color--brand);
}

/* Buttons
--------------------------------------------- */

/* Banner and modal buttons. The floating button keeps the plugin's fixed
   position, which also anchors the gradient layers. */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton {
    position: relative;
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button {
    overflow: hidden;
    isolation: isolate;
    height: auto;
    min-height: var(--gcs-touch-preferred);
    min-width: 120px;
    padding: 10px 18px;
    border: 2px solid var(--wp--preset--color--border-base);
    border-radius: 2px;
    background-color: var(--wp--preset--color--brand);
    color: var(--wp--preset--color--base);
    font-family: inherit;
    font-size: 1rem;
    font-weight: var(--gcs-weight-button);
    box-shadow: none;
    transform: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Settings is the secondary action: outline style at full opacity */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton.moove-gdpr-infobar-settings-btn {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--brand);
    opacity: 1;
}

/* Bookplate treatment
--------------------------------------------- */

/* Plugin buttons hold bare text with no span, so the layers sit at
   z-index -1 inside the isolated button: above its background, below
   its text. */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton::before,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton::before,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 30% 30%,
        rgba(255, 255, 255, 0.4) 0%,
        transparent 50%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: -1;
    transition: opacity 0.3s ease;
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton::after,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton::after,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at center,
        transparent 0%,
        transparent 70%,
        rgba(42, 24, 16, 0.15) 100%
    );
    border-radius: inherit;
    pointer-events: none;
    z-index: -1;
    transition: opacity 0.3s ease;
}

/* Hover and focus
--------------------------------------------- */

/* Solid buttons invert to Warm Ivory, matching light-background site buttons */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:hover,
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:focus,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:hover,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:focus,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:hover,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:focus {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--brand);
    box-shadow: none;
}

/* The outline Settings button takes the secondary hover */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton.moove-gdpr-infobar-settings-btn:hover,
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton.moove-gdpr-infobar-settings-btn:focus {
    background-color: var(--wp--preset--color--contrast-accent);
    color: var(--wp--preset--color--brand-alt);
}

/* The emboss recedes on hover and focus */
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:hover::before,
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:hover::after,
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:focus::before,
#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:focus::after,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:hover::before,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:hover::after,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:focus::before,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:focus::after,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:hover::before,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:hover::after,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:focus::before,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:focus::after {
    opacity: 0;
}

#moove_gdpr_cookie_info_bar#moove_gdpr_cookie_info_bar .mgbutton:focus,
#moove_gdpr_cookie_modal#moove_gdpr_cookie_modal .mgbutton:focus,
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:focus {
    outline: var(--gcs-focus-width) var(--gcs-focus-style) var(--gcs-color-focus);
    outline-offset: var(--gcs-focus-offset);
}

/* Floating button
--------------------------------------------- */

/* A permanent text tab replaces the gear icon */
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button .moove_gdpr_icon {
    display: none;
}

#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button .moove_gdpr_text {
    display: block;
    padding: 0;
    background-color: transparent;
    font: inherit;
    line-height: 1.5;
    text-transform: none;
}

/* The tab floats over any background, so the focus ring pairs a Rich Brown
   outline with a Warm Ivory band; one contrasts with any solid color. */
#moove_gdpr_save_popup_settings_button#moove_gdpr_save_popup_settings_button:focus {
    outline-color: var(--wp--preset--color--contrast);
    box-shadow: 0 0 0 var(--gcs-focus-offset) var(--wp--preset--color--base);
}

/* The fixed banner covers the page bottom; this keeps focused content
   clear of it while it shows. Each value covers the tallest banner
   measured in that layout. */
html:has(#moove_gdpr_cookie_info_bar:not(.moove-gdpr-info-bar-hidden)) {
    scroll-padding-bottom: 19rem;
}

@media (min-width: 48em) { /* 768px: text and buttons sit side by side */
    html:has(#moove_gdpr_cookie_info_bar:not(.moove-gdpr-info-bar-hidden)) {
        scroll-padding-bottom: 11rem;
    }
}

@media (min-width: 64em) { /* 1024px */
    html:has(#moove_gdpr_cookie_info_bar:not(.moove-gdpr-info-bar-hidden)) {
        scroll-padding-bottom: 9rem;
    }
}
