/* ==========================================
   TEXTURES
   Reusable background textures and patterns
========================================== */
.texture,
[class*="is-style-texture-"],
.nofcc-section-background[class*="texture-"] {
    position: relative;
    overflow: hidden;
}
/* Texture default fallback */
.texture-paper,
.is-style-texture-paper,
.texture-topo,
.is-style-texture-topo,
.texture-dots,
.is-style-texture-dots,
.texture-wash,
.is-style-texture-wash,
.texture-swirl,
.is-style-texture-swirl,
.texture-grid,
.is-style-texture-grid,
.texture-grain,
.is-style-texture-grain {
    --nofcc-texture-bg-default: var(--color-cream, #f7f2ea);
}
/* Paper */
.texture-paper,
.is-style-texture-paper,
.nofcc-section-background.texture-paper {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        radial-gradient(rgba(31, 41, 55, 0.035) 1px, transparent 1px),
        linear-gradient(135deg, rgba(255,255,255,0.45), rgba(31,41,55,0.025));
    background-size: 18px 18px, 100% 100%;
}
/* Topographic */
.texture-topo,
.is-style-texture-topo,
.nofcc-section-background.texture-topo {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        repeating-radial-gradient(
            ellipse at 20% 30%,
            rgba(31, 41, 55, 0.045) 0,
            rgba(31, 41, 55, 0.045) 1px,
            transparent 2px,
            transparent 18px
        );
}
/* Dots */
.texture-dots,
.is-style-texture-dots,
.nofcc-section-background.texture-dots {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        radial-gradient(rgba(239, 35, 60, 0.12) 1.2px, transparent 1.2px),
        radial-gradient(rgba(31, 41, 55, 0.07) 1.2px, transparent 1.2px);
    background-size: 26px 26px, 48px 48px;
    background-position: 0 0, 12px 16px;
}
/* Wash */
.texture-wash,
.is-style-texture-wash,
.nofcc-section-background.texture-wash {
    background:
        radial-gradient(circle at 18% 22%, rgba(239,35,60,0.08), transparent 34%),
        radial-gradient(circle at 82% 72%, rgba(246,196,83,0.18), transparent 38%),
        radial-gradient(circle at 50% 50%, rgba(255,255,255,0.55), transparent 48%),
        var(--texture-bg, var(--nofcc-texture-bg-default));
}
/* Swirl */
.texture-swirl,
.is-style-texture-swirl,
.nofcc-section-background.texture-swirl {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        radial-gradient(ellipse at 15% 20%, rgba(239,35,60,0.07), transparent 36%),
        radial-gradient(ellipse at 85% 25%, rgba(246,196,83,0.14), transparent 34%),
        radial-gradient(ellipse at 55% 85%, rgba(31,41,55,0.045), transparent 38%);
}
/* Grid */
.texture-grid,
.is-style-texture-grid,
.nofcc-section-background.texture-grid {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        linear-gradient(rgba(31,41,55,0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(31,41,55,0.035) 1px, transparent 1px);
    background-size: 42px 42px;
}
/* Grain */
.texture-grain,
.is-style-texture-grain,
.nofcc-section-background.texture-grain {
    background-color: var(--texture-bg, var(--nofcc-texture-bg-default));
    background-image:
        radial-gradient(rgba(31,41,55,0.07) 0.8px, transparent 0.8px);
    background-size: 10px 10px;
}
/* ==========================================
   NOFCC SECTION BACKGROUND BLOCK
========================================== */
.nofcc-section-background {
    position: relative;
    overflow: hidden;
    padding: 96px 0;
}
/*
|--------------------------------------------------------------------------
| Image Background System
|--------------------------------------------------------------------------
| Compatibility mapping:
| - Keep the saved block class names stable for Gutenberg validation.
| - Apply the established site behaviour at the CSS layer instead.
| - Do not reverse these classes in getSectionClasses(); doing so invalidates
|   every section-background block saved with the original markup.
|
| These selectors are intentionally more specific so they win over older
| pattern-level background rules.
|--------------------------------------------------------------------------
*/
/* Base image section reset */
body .nofcc-section-background.has-background-image {
    background-image: none !important;
    background-attachment: scroll !important;
    background-position: var(--section-bg-position, 50% 50%) !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}
/* Inner image layer */
body .nofcc-section-background .nofcc-section-background__image {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0;
    display: none !important;
    width: 100%;
    height: 100%;
    background-image: var(--section-bg-image) !important;
    background-position: var(--section-bg-position, 50% 50%) !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    pointer-events: none;
}
/* Scroll class: established fixed-image treatment. */
body .nofcc-section-background.has-background-image.is-background-scroll {
    background-image: var(--section-bg-image) !important;
    background-position: var(--section-bg-position, 50% 50%) !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}
body .nofcc-section-background.has-background-image.is-background-scroll .nofcc-section-background__image {
    display: none !important;
}
/* Fixed class: established scroll-with-section treatment. */
body .nofcc-section-background.has-background-image.is-background-fixed {
    background-image: none !important;
    background-attachment: scroll !important;
}
body .nofcc-section-background.has-background-image.is-background-fixed .nofcc-section-background__image {
    display: block !important;
    position: absolute !important;
    background-image: var(--section-bg-image) !important;
    background-position: var(--section-bg-position, 50% 50%) !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
}
/* Overlay */
.nofcc-section-background__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: #ffffff;
    pointer-events: none;
}
/* Content */
.nofcc-section-background__inner {
    position: relative;
    z-index: 2;
    width: min(90%, 1180px);
    margin: 0 auto;
}
/* No image mode */
.nofcc-section-background:not(.has-background-image) .nofcc-section-background__image,
.nofcc-section-background:not(.has-background-image) .nofcc-section-background__overlay {
    display: none !important;
}
.nofcc-section-background:not(.has-background-image) {
    color: var(--color-text);
}
.nofcc-section-background:not(.has-background-image) h1,
.nofcc-section-background:not(.has-background-image) h2,
.nofcc-section-background:not(.has-background-image) h3,
.nofcc-section-background:not(.has-background-image) h4 {
    color: var(--color-text);
}
.nofcc-section-background:not(.has-background-image) p,
.nofcc-section-background:not(.has-background-image) li {
    color: var(--color-muted);
}
.nofcc-section-background:not(.has-background-image) .eyebrow {
    color: var(--color-muted);
}