@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&family=Kalam&display=swap');
/*  SITE: Eagle River Pickleball Association
Version 1.6
*/


.green-text {color: #006600 !important;}

/*type*/
.entry-content p {font-size:1.2em;}
::marker {    content: "";}
/*.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 {
    color: #1e3a62 !important;text-transform: uppercase;
}*/
.entry-content h1 {text-transform: none;}
.entry-content h2 {
    font-size: 2em !important;
 
}
/*.entry-content .wp-block-image img {
    border-radius: 0;
    margin: 0px;
}*/
.wp-block-navigation a:hover {
    text-decoration: none !important;
    opacity: .8 !important;
	transition: all 0.3s ease-in-out;
	
}
/*------------------------------------------------------------------------------
GLOBAL
-------------------------------------------------------------------------------*/
/* Apply to all elements with an ID so any anchor link has breathing room */


#section-home-cta h2 {
    padding-top: 5px;
    white-space: nowrap;
    display: block;
    width: 100%;
    text-align: center;
    overflow: visible;
    font-size: clamp(1.3rem, 2.7vw, 4rem) !important;
    max-width: 100%;
}

[id] {
    scroll-margin-top: 140px;
}

/* Ensure the scrolling is smooth rather than a sudden jump */
html {
    scroll-behavior: smooth;
}
div.wppb-progress > span {
    background: #f7e351;
}
div.wppb-progress {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    height: 25px;
    margin: 20px 0;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(247, 227, 81, 0.3);
}

.fund-goal-btn a {
    background: transparent none;
    border-color: white;
    border-width: 1px;
    border-style: solid;
    color: white;
    padding-top: calc(0.6rem - 1px);
    padding-right: calc(1rem - 1px);
    padding-bottom: calc(0.6rem - 1px);
    padding-left: calc(1rem - 1px);
	margin-top:20px;
}


/* hide titles on pages 3/18 */
h1.wp-block-heading {display:none !important;}
/* Remove the automatic margin between top-level sections */
.wp-site-blocks .wp-block-group, 
.wp-site-blocks section {
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
}

/* 1. Prevent text wrapping and fix width issues */
header .wp-block-navigation__submenu-container {
    min-width: 220px !important; /* Ensures a consistent, clean width */
    width: max-content !important; /* Expands to fit long titles like Clinics / Coaching */
    padding: 10px 0 !important;
    border-radius: 4px;
    border-top: 4px solid #002147 !important; /* Branded Navy top accent */
    box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
}

/* 2. Style the individual links */
header .wp-block-navigation-item__content {
  /*  white-space: nowrap !important; */
       padding: 12px 6px !important;
    transition: all 0.2s ease-in-out;
    color: #002147 !important;
    font-weight: 600 !important;
	
	
	   
}

/*====================================================
                      NAV
====================================================*/

/* Styling for the prominent Donate button */
.donate-pop-btn .wp-block-button__link {
    font-weight: 800 !important;
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    display: inline-flex !important;
    align-items: center;
    gap: 10px; /* Space for the icon we will inject */
	white-space: nowrap !important;
}

/* Hover state */
.donate-pop-btn .wp-block-button__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.25);
    filter: brightness(1.1);
}

/* Adding the Font Awesome Icon via CSS */
.donate-pop-btn .wp-block-button__link::before {
    content: "\f4be"; /* FA v6 'hand-holding-heart' */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

/* Optional: Subtle Pulse effect to draw the eye */
@keyframes donate-pulse {
    0% { transform: scale(1); }
    5% { transform: scale(1.08); }
    10% { transform: scale(1); }
}

.donate-pop-btn {
    animation: donate-pulse 5s infinite;
}
/*header .current-menu-item,*/
header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content{box-shadow: inset 4px 0 0 #F7E351;
    padding-left: 10px !important;}
header .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
    background-color:#18a6e7;
    border: 1px solid #00000026;
}

/* Style the Facebook Menu Item */
.menu-facebook a {
    /* Hide the word "Facebook" */
    font-size: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 10px !important;
}

/* Inject the Icon */
header .menu-facebook a::before {
    content: "\f082"; /* FontAwesome Facebook Square Icon */
    font-family: "Font Awesome 6 Brands"; /* Ensure this matches your FA version */
    font-size: 20px !important; /* Adjust size to match menu height */
    color: #002147; /* Match your deep blue menu text */
    visibility: visible;
	    top: 5px;
	position: relative;
}

/* Hover Effect */
header .menu-facebook a:hover {
	    background-color: transparent !important;
    color: #1877F2;
    padding-left: 8px !important;
    box-shadow: none !important;
	opacity: 1 !important;
	
}
.menu-facebook a:hover::before {
    color: #1877F2; /* Facebook Blue on hover */
	opacity: 1 !important;
	

}
/* Add a subtle frame and rounded corners to gallery images within your specific section */
.nwd-gallery .wp-block-image img {
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    transition: all 0.3s ease;
}

/* Hover Effect: Lifts the image and highlights with ERPA Yellow */
.nwd-gallery .wp-block-image img:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.15);
    border-color: #F7E351 !important; /* Your ERPA Yellow */
    cursor: pointer;
}

/* Ensure the captions are clean and legible for older eyes */
.nwd-gallery figcaption {
    font-size: 1rem;
    color: #444;
    margin-top: 10px;
    line-height: 1.4;
    font-weight: 500;
}

/* Adjust spacing between the individual gallery columns */
.nwd-gallery .wp-block-columns {
    gap: 40px !important;
}

/* Optional: Add a small shadow to the images even when not hovered to give them depth */
.nwd-gallery .wp-block-image img {
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}




/* Force Gallery Images into Uniform Squares */
/* Force Gallery Images into a 3-Column Square Grid */
.wp-block-gallery.is-layout-flex {
  display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; 
    gap: 15px !important; 
}

/* Ensure the individual image containers stay square */
.wp-block-gallery .wp-block-image {
    margin: 0 !important;
    width: 100% !important;
}

.wp-block-gallery .wp-block-image a {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important; 
    position: relative;
    border-radius: 4px;
}

/* Force the image to fill the square without distortion */
.wp-block-gallery .wp-block-image img {
   position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; 
    object-position: center !important;
}

/* Mobile Fix: Drop to 2 columns on small screens so they aren't tiny */
@media (max-width: 600px) {
    .wp-block-gallery.is-layout-flex {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}



/* 3. Hover state with subtle "Action Yellow" or "Court Green" left border */
header .wp-block-navigation-item__content:hover {
  /*  background-color: #f8fafc !important;
    color: #006600 !important;
	*/
	
	    background-color: #002147 !important;
    color: #18a6e7 !important;
	
	
    padding-left: 11px !important; /* Slight "push" effect */
    box-shadow: inset 4px 0 0 #F7E351; /* Suble Yellow accent line on the left */
}
header .wp-block-group {

    background: #18a6e7 !important;
}
/* Global Typography - ERPA Style Guide */
body, p, li, a, input, textarea {
    font-family: 'Calibri', 'Segoe UI', Candara, Bitstream Vera Sans, DejaVu Sans, Bitstream Vera Sans, HTML5 Eye Ads, sans-serif;
    font-weight: 400;
    color: #333333; /* Soft black for body text readability */
    line-height: 1.6;
}

/* Headings - Bold & Navy Blue */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Calibri', 'Segoe UI', sans-serif;
    font-weight: 700; /* Calibri Bold */
    color: #002147; /* ERPA Navy Blue */
    line-height: 1.2;
    margin-bottom: 1rem;
}

/* Extra Punch for Hero Titles and specific Bold headers */
h1, .hero-title, .wp-block-heading strong {
    font-weight: 800; /* Extra Bold feel where supported */
}

/* Ensure buttons follow the guide */
.wp-block-button__link, button {
    font-family: 'Calibri', sans-serif;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
    color: inherit;
    font-size: 1.3em;
}

/* Intro Section Above Gallery */
.sub-section-intro {
    text-align: center;
    margin-bottom: 40px;
    padding: 0 20px;
}

.sub-section-intro  h2 {
    font-size: clamp(2rem, 5vw, 3.5rem);
    color: #002147; /* Navy */
    text-transform: uppercase;
    margin-bottom: 0;
    letter-spacing: -1px;
}

.sub-section-intro  h4 {
    font-size: 1.2rem;
    color: #006600; /* Court Green */
    font-weight: 400;
    font-family: 'Calibri', sans-serif;
    margin-top: 10px;
    position: relative;
    display: inline-block;
}

/* Subtle accent lines for the subheadline */
.sub-section-intro  h4::before, 
.sub-section-intro  h4::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 40px;
    height: 5px;
    background-color: #F7E351; /* Action Yellow */
}

.sub-section-intro  h4::before { right: 100%; margin-right: 15px; }
.sub-section-intro  h4::after { left: 100%; margin-left: 15px; }





































#section-hero-erpa .wp-block-cover__image-background.has-parallax {
   /* background-position-y: -90px !important;*/
}
#section-hero-erpa h1.hero-title {   /* font-size: 3em !important; */   max-width: 800px;}
#section-hero-erpa p.hero-subtitle {font-size:1.5em !important;padding-bottom:20px;    max-width: 800px;}

/* Force the 'One Vision' header to a single line */
.home-hero-title {
    white-space: nowrap !important;
    text-transform: none !important; /* Ensures 'Initial Caps' works */
    font-size: clamp(1.8rem, 4vw, 3rem) !important; /* Responsively shrinks font so it stays on one line */
}

/* Force the 'Heart of Pickleball' tagline to a single line */
.home-hero-tagline {
    white-space: nowrap !important;
    font-size: clamp(1.1rem, 2vw, 1.8rem) !important;
    margin-top: 10px !important;
    text-transform: capitalize !important;
}

/* On very small mobile phones, allow it to wrap so it doesn't bleed off the screen */
@media (max-width: 480px) {
    .home-hero-title, .home-hero-tagline {
        white-space: normal !important;
        text-align: center;
    }
}

/* Converts a dark/black logo to pure white */
.nwd-logo-white img {
    filter: brightness(0) invert(1);
    max-width: 180px; /* Adjust as needed for footer scale */
    height: auto;
}




/* Hero Section Enhancements */
.wp-block-cover h1 {
    font-size: clamp(2.5rem, 5vw, 4.5rem); /* Responsive sizing */
    line-height: 1.1;
    margin-bottom: 20px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.wp-block-cover p.hero-subtitle {
    letter-spacing: 2px;
    font-weight: 700;
    margin-bottom: 10px;
}
.wp-block-cover .wp-block-button__link, header .nav-cta-btn a,
.wp-block-button__link{ transition: all 0.3s ease;}
/* Specific Button Hover for Hero */
.wp-block-cover .wp-block-button__link:hover,
header .nav-cta-btn a:hover,
.wp-block-button__link:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
   
}


/* Makes the small tagline extra readable */
.wp-block-cover p.has-secondary-color {
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 800;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.4);
	font-size: 1.6em;
}


/*home about section fade */
/* Make the parent container the anchor */
.nwd-about-section {
    position: relative;
    overflow: hidden;
}

/* Force the Column 2 container to be height-aware */
.nwd-about-section .wp-block-column:last-child {
    position: static; /* Allows the image to reference the main Group */
}

/* The Magic: Pin the image block to the top, right, and bottom */
.nwd-full-bleed-image img {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%; /* Adjust this to 60% if you want it to overlap the center more */
    height: 100%;
    object-fit: cover; /* This keeps the proportions but fills the space */
    object-position: center right; /* Keeps the player in view */
    
    /* The Fade to the left */
    mask-image: linear-gradient(to left, black 20%, transparent 100%);
    -webkit-mask-image: linear-gradient(to left, black 20%, transparent 100%);
    
    z-index: 1;
}

/* Ensure the text stays on top */
.nwd-about-section .wp-block-column:first-child {
    position: relative;
    z-index: 2;
}
/* Centers the text column content vertically */
.nwd-about-section .wp-block-column:first-child {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 5%; /* Gives the text some breathing room before the image starts */
}

/* Optional: Styling for that small 'Our Mission' eyebrow text */
.nwd-about-section h4 {
    color: #006600; /* Court Green */
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-size: 1.4rem;
    margin-bottom: 10px;
}


/* HOME GOAL SECTION */
/* Strategic Section Styling */
.nwd-strategic-section h2 {
    color: #18A6E7; /* Sky Blue for the headline */
    margin-bottom: 20px;
}

/* Custom Progress Bar Placeholder */
.nwd-progress-container {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    height: 25px;
    width: 100%;
    margin: 20px 0;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(247, 227, 81, 0.3);
}

.nwd-progress-fill {
    background: #F7E351; /* Action Yellow */
    height: 100%;
   /* width: 10%;*/ /* Change this to control the percentage */
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 15px;
    transition: width 2s ease-in-out;
}
.nwd-progress-wrapper p {
    color: #F7E351 !important;
	padding-bottom: 10px;
}
.nwd-progress-label {
    color: #002147;
    font-size: 0.8rem;
    font-weight: 800;
}
/* This makes the bar 'grow' into place once the section fades in */
.nwd-start-anim .nwd-progress-fill {
    animation: growBar 2s ease-out forwards;
    transform-origin: left;
}

@keyframes growBar {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}
/* Target Outline Buttons inside the Strategic Section on Hover */
.nwd-strategic-section .wp-block-button.is-style-outline .wp-block-button__link:hover {
    background-color: #F7E351 !important; /* Action Yellow */
    border-color: #F7E351 !important;
    color: #002147 !important; /* Navy Blue text for contrast */
    opacity: 1;
    transform: translateY(-2px); /* Subtle lift effect */
    transition: all 0.3s ease;
}

/* Optional: Smooth transition for the initial state */
.nwd-strategic-section .wp-block-button.is-style-outline .wp-block-button__link {
    transition: all 0.3s ease;
}



/* HOME FEATURES */
/* Feature Cards Styling */
.nwd-features-section .wp-block-column {
    background: #002147;
    padding: 3em 3em;
    border-radius: 8px;
    border: 1px solid #e1e8ed;
    transition: all 0.3s ease;
    text-align: center;
}
.nwd-features-section {
    background-color: #F9F9F9;
    background-image: linear-gradient(rgba(249, 249, 249, 0.95), rgba(249, 249, 249, 0.60)), 
                      url('https://erpa.dev.nwd.host/wp-content/uploads/sites/28/banner-paddle-left-01.webp');
    background-size: cover;
    background-position: center;
    padding: 40px 20px !important;
}
.nwd-features-section .wp-block-column:hover {
    border-color: #18A6E7; /* Sky Blue on hover */
    box-shadow: 0 10px 30px rgba(0, 33, 71, 0.08);
    transform: translateY(-5px);
}




/* Font Awesome Icon Styling */
.nwd-icon {
    font-size: 4em;
    color: #18A6E7; /* Sky Blue */
    margin-bottom: 25px;
    display: inline-block;
    transition: transform 0.3s ease;
}

/* Make the icon "pop" when the card is hovered */
.nwd-features-section .wp-block-column:hover .nwd-icon {
    transform: scale(1.1) rotate(5deg);
    color: #0689c5;
}
/* Feature Section Title Spacing */
.nwd-features-section h3 {
    margin-bottom: 50px;
    font-weight: 800;
    color: #abadaf;
}
/* Ensure the Gutenberg paragraph behaves like our link */
p.nwd-feature-link {
    margin-top: 15px !important;
}

p.nwd-feature-link a {
    text-decoration: none;
    color: inherit; 
	font-weight:600;
}

/* Maintain the hover effect for the link inside the paragraph */

p.nwd-feature-link:hover a {
    color: #3cb5ef !important;
}
/* Custom hover for the middle green card link */
.nwd-feature-card-green:hover .nwd-feature-link {
    color: #006600 !important;
} 	
#section-home-features {margin-top:0 !important;padding-bottom:2em !important;}
#section-home-features .nwd-about-content {
max-width: 1400px !important;
	margin: 0 auto !important;}

#section-home-features .nwd-about-content .wp-block-column {
    padding-top: 3em !important;
    padding-bottom: 3em !important;
}
#section-home-features .nwd-about-content p {  color: #ffff;}
  #section-home-features .nwd-about-content p.nwd-feature-link a {
    text-decoration: none;
    color: #18a6e7;
    font-weight: 600;
}
.entry-content {margin-top:0 !important;}




/* Specificity Boost: Target the wrapper AND the link */
.wp-block-button.btn-yellow-01 .wp-block-button__link,
.givewp-donation-form-modal__open{
    background-color: #F7E351 !important; /* Force Yellow over Primary Blue */
    color: #002147 !important;            /* Force Navy over White */

    display: inline-flex !important;
    align-items: center;
    gap: 12px;

    padding: 16px 35px !important;        /* Overriding the 12px/24px  */
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    border-radius: 8px !important;

    border: none !important;
    box-shadow: 0 4px 0px #d4c13d;
    transition: all 0.3s ease !important;
}
.wp-block-button.btn-white-outline-01 .wp-block-button__link {
    background-color: transparent !important;
    color: #f6f6f6 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
    padding: 16px 35px !important;
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    border-radius: 8px !important;
    border: 1px solid white;
    box-shadow: 0 4px 0px #cac9c3;
    transition: all 0.3s ease !important;
}
/* Hover State - Needs high specificity too */
.wp-block-button.btn-yellow-01 .wp-block-button__link:hover {
    background-color: #fff28c !important;
    color: #002147 !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    text-decoration: none !important;
}

/* Fix the icon movement inside the higher-specificity button */
.wp-block-button.btn-yellow-01 .wp-block-button__link:hover i {
    transform: translateX(5px);
}






/* Intro Section Above Gallery */
.nwd-gallery-intro {
    text-align: center;
    margin-bottom: 40px;
    padding: 0 20px;
}

.nwd-gallery-intro h2 {
    font-size: clamp(2rem, 5vw, 3.5rem);
    color: #002147; /* Navy */
    text-transform: uppercase;
    margin-bottom: 0;
    letter-spacing: -1px;
}

.nwd-gallery-intro h4 {
    font-size: 1.2rem;
    color: #006600; /* Court Green */
    font-weight: 400;
    font-family: 'Calibri', sans-serif;
    margin-top: 10px;
    position: relative;
    display: inline-block;
}

/* Subtle accent lines for the subheadline */
.nwd-gallery-intro h4::before, 
.nwd-gallery-intro h4::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 40px;
    height: 5px;
    background-color: #F7E351; /* Action Yellow */
}

.nwd-gallery-intro h4::before { right: 100%; margin-right: 15px; }
.nwd-gallery-intro h4::after { left: 100%; margin-left: 15px; }

/* Mobile: Remove lines if they cramp the screen */
@media (max-width: 600px) {
    .nwd-gallery-intro h4::before, .nwd-gallery-intro h4::after { display: none; }
}


/* Gallery Item Container */
.nwd-gallery-item {
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.4s ease;
}

/* Position the Text at the Bottom */
.nwd-gallery-item .wp-block-cover__inner-container {
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end; /* Push text to bottom */
    align-items: center;
    padding-bottom: 20px !important;
    width: 100%;
}

/* Style the Floating Word */
.nwd-gallery-item p, 
.nwd-gallery-item h2, 
.nwd-gallery-item h3 {
    background-color: #F7E351 !important; /* Action Yellow */
    color: #002147 !important; /* Navy Blue */
    padding: 5px 20px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    font-size: 1.2rem !important;
    letter-spacing: 1px;
    transform: skewX(-15deg); /* The ERPA Skew */
    margin: 0 !important;
    box-shadow: 5px 5px 0px rgba(0,0,0,0.1);
}

/* Ensure the text itself isn't skewed/leaning */
.nwd-gallery-item p span {
    display: inline-block;
    transform: skewX(15deg); 
}


/* 1. Force the Overlay Color & Opacity */
.nwd-gallery-item .wp-block-cover__background {
    background-color: #002147 !important; /* Brand Navy */
    opacity: 0.25 !important; /* Keep it bright and crisp */
    transition: opacity 0.4s ease-in-out !important;
}

/* 2. The Bottom Vignette (Ensures yellow text pops) */
.nwd-gallery-item .wp-block-cover__inner-container {
   /* background: linear-gradient(to top, rgba(0,33,71,0.7) 0%, rgba(0,33,71,0) 40%) !important;*/
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 25px !important;
    z-index: 2;
}

/* 3. The Image "Zoom" Animation */
.nwd-gallery-item .wp-block-cover__image-background {
   /* transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;*/
}

/* 4. Hover State: Clearer Image & Slight Zoom */
.nwd-gallery-item:hover .wp-block-cover__background {
  /*  opacity: 0.1 !important; /* Almost disappears on hover */
}
.max-width-1400 {max-width:1400px;margin: 0 auto;}
.nwd-gallery-item:hover .wp-block-cover__image-background {
 /*   transform: scale(1.08) !important;*/
}

/* 5. Fix the Muddy Text Color (if WP tries to dim it) */
.nwd-gallery-item p, 
.nwd-gallery-item h3 {
    opacity: 1 !important;
    color: #002147 !important; /* Force Navy on Yellow */
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}



#section-home-cta {margin-top:0 !important}






/*                 --------  SUBPAGE GLOBAL ------------------            */
/* 1. Remove default bullets */
ul.nwd-fa-list {
    list-style: none;
    padding-left: 1.5rem; /* Adjust based on icon size */
    margin-left: 0;
}

/* 2. Create the Custom Icon Bullet */
ul.nwd-fa-list li {
    position: relative;
    margin-bottom: 0.75rem; /* Space between items */
    line-height: 1.5;
}

ul.nwd-fa-list li::before {
    /* Use the Font Awesome v6 Free Unicode */
    /* Checkmark: \f058 | Arrow: \f105 | Circle-Play: \f144 */
    content: "\f058"; 
    
    font-family: "Font Awesome 6 Free";
    font-weight: 900; /* Required for solid icons */
    
    position: absolute;
    left: -1.75rem; /* Pulls icon into the padding area */
    color: #006600; /* Your Brand Green */
    font-size: 1.1rem;
    display: inline-block;
}
ul.nwd-fa-list-yellow li::before { color: #F7E351; /* Your Brand Green */ }
.section-subpage-hero .wp-block-cover {min-height:400px !important;}

/* 2. Massive Title for Subpages */
 .hero-title {
    font-size: clamp(3rem, 8vw, 5.5rem) !important;
    line-height: 0.9;
    font-weight: 900 !important;
    color: #ffffff;
    text-shadow: 3px 3px 0px #006600;
    letter-spacing: -2px !important;
    text-transform: uppercase;
    margin-bottom: 5px !important;
}

/* Target the H3 specifically inside the about-hero */

/* Container Clip - Creates that modern diagonal edge */
.section-subpage-hero {
/*    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
    overflow: hidden;
    background: #002147;*/
}

.section-subpage-hero {
/*    clip-path: polygon(0 0, 100% 0, 100% 92%, 0% 100%);
    margin-bottom: 50px; */
}
/* Make sure the text inside isn't leaning too much */
.hero-subtitle span,
.hero-subtitle {
    font-style: normal !important;
}
.section-subpage-hero .wp-block-cover .wp-block-cover__inner-container {    text-align: center !important;}
/* Removing the "boring" default WordPress dim overlay for a gradient */
.section-subpage-hero .wp-block-cover__background {
    background: linear-gradient(180deg, rgba(0,33,71,0.2) 0%, rgba(0,33,71,0.3) 100%) !important;
    opacity: 1 !important;
}
body:not(.home) .hero-subtitle {
    display: none !important;
}

.hero-subtitle {

    display: inline-block !important; 
    width: auto !important;
    background-color: #F7E351 !important;
    color: #002147 !important;
    padding: 8px 15px !important; 
    font-weight: 800 !important;
    text-transform: uppercase;
    transform: skewX(-15deg) !important;
    margin: -10px auto 0 auto !important;    
    -webkit-transform: skewX(-15deg) !important; 
    backface-visibility: hidden; 
}

/* Because inline-block needs the parent to tell it to stay center */
.wp-block-cover__inner-container {
    text-align: center !important;
}

/* PLAY PICKLEBALL -------------------*/
/* Prevents the header from covering the section title after a jump */
#schedule, #clinics, #rules {
    scroll-margin-top: 100px; 
    padding-top: 60px;
    padding-bottom: 60px;
}

/* Container for the Schedule/Loop section */
.nwd-info-split {
    display: flex;
    gap: 30px;
    margin-top: -40px; 
    z-index: 10;
    position: relative;
}

.nwd-info-card {
    flex: 1;
    background: #ffffff;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    border-top: 6px solid #002147; 
}

.nwd-info-card.loop {
    border-top-color: #006600;
}
.nwd-info-card:first-child a {color:#18a6e7;}


/* Styling the "No Play" dates to stand out */
.no-play-alert {
    background: #fff5f5;
    border: 1px dashed #cc0000;
    padding: 15px;
    border-radius: 8px;
    margin: 15px 0;
    color: #cc0000;
    font-weight: 700;
    text-align: center;
}
/* Rules & Game Section Styling */
.nwd-rules-section {
    background-color: #f4f7f9 !important;
    padding: 60px 0 !important;
    
}

/* Target standard lists inside the Rules section */
#rules ul {
    list-style: none;
    padding-left: 0;
}

#rules li {
    margin-bottom: 12px;
}

/* Automatically style any link ending in .pdf */
#rules a[href$=".pdf"] {
    display: inline-flex;
    align-items: center;
    background: #f9f9f9;
    padding: 12px 20px;
    border-left: 4px solid #cc0000; /* PDF Red */
    border-radius: 0 8px 8px 0;
    text-decoration: none;
    color: #002147;
    font-weight: 700;
    transition: all 0.3s ease;
    width: 95%;
}

#rules a[href$=".pdf"]:hover,
#clinics a[href$=".pdf"]:hover{
    background: #eef2f7;
    transform: translateX(5px);
}

/* Adds a generic PDF icon via CSS so the client doesn't have to */
#rules a[href$=".pdf"]:not(.wp-block-button__link)::before,
#clinics a[href$=".pdf"]:not(.wp-block-button__link)::before {
    content: "PDF";
    font-size: 0.65rem;
    background: #cc0000;
    color: white;
    padding: 2px 5px;
    margin-right: 15px;
    border-radius: 3px;
    font-weight: 900;
    white-space: nowrap;
}

/* Style for external web links in the Rules section */
#rules a[href^="http"]:not([href$=".pdf"]) {
    display: inline-flex;
    align-items: center;
    background: #f9f9f9;
    padding: 12px 20px;
    border-left: 4px solid #002147; /* ERPA Navy for Web Links */
    border-radius: 0 8px 8px 0;
    text-decoration: none;
    color: #002147;
    font-weight: 700;
    transition: all 0.3s ease;
    width: 100%;
    margin-bottom: 5px;
	white-space: nowrap;
}

#rules a[href^="http"]:not([href$=".pdf"]):hover {
    background: #eef2f7;
    transform: translateX(5px);
    border-left-color: #006600; /* Turns Green on hover */
	white-space: nowrap;
}

/* Adds a "Link" icon via CSS */
#rules a[href^="http"]:not([href$=".pdf"])::before {
    content: "\2197"; /* Modern 'North East' arrow icon */
    font-size: 1.1rem;
    margin-right: 15px;
    color: #002147;
    font-weight: 900;
	white-space: nowrap;
}
/* The container for the right-hand links */
.nwd-resource-box {
    background-color: #f8fafc; /* Very subtle cool grey */
    padding: 30px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
    height: 100%; /* Keeps it aligned with the left text */
}

/* Optional: Add a small header inside the box */
.nwd-resource-box::before {
    content: "Quick Resources";
    display: block;
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: #006600; /* Court Green */
    margin-bottom: 20px;
    letter-spacing: 1px;
}

/* Tighten up the list inside this box */
.nwd-resource-box ul {
    margin: 0;
    padding: 0;
}


.nwd-resource-box {
    position: relative;
    overflow: hidden;
}

.nwd-resource-box::after {
    content: "";
    position: absolute;
    top: 37px;
    right: 26px;
    width: 40px;
    height: 10px;
    background: #F7E351;
    transform: skewX(-45deg);
}


/* Style for the PDF download buttons to make them feel "Premium" */
.nwd-pdf-link {
    display: flex;
    align-items: center;
    background: #f4f4f4;
    padding: 15px;
    border-left: 4px solid #006600; /* Court Green */
    text-decoration: none;
    color: #002147;
    font-weight: 700;
    margin-bottom: 10px;
    transition: background 0.3s;
}

.nwd-pdf-link:hover {
    background: #e8eee8;
}

.nwd-pdf-link::before {
    content: "\f1c1"; /* FontAwesome PDF Icon */
    font-family: "Font Awesome 6 Free";
    margin-right: 15px;
    color: #cc0000; /* PDF Red */
}
/* TeamReach App Download Button */
.btn-download-app a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #006600 !important; /* Court Green */
    color: #ffffff !important;
    padding: 18px 30px;
    border-radius: 50px; /* Pill shape for "App" feel */
    text-decoration: none !important;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 3px solid transparent;
    box-shadow: 0 6px 20px rgba(0, 102, 0, 0.2);
}

/* Add an icon before the text */
.btn-download-app a::before {
    content: "\f3cd"; /* Mobile Phone Icon */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 12px;
    font-size: 1.2rem;
    color: #F7E351; /* Action Yellow */
}

/* Hover State: The "Pop" */
.btn-download-app a:hover {
    background-color: #002147 !important; /* Brand Navy */
    transform: scale(1.05) translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 33, 71, 0.3);
    color: #F7E351 !important;
}

/* Mobile: Ensure it fits on smaller screens */
@media (max-width: 480px) {
    .btn-download-app a {
        width: 100%;
        padding: 15px 20px;
        font-size: 0.9rem;
    }
}


#rules {
    position: relative;
    overflow: hidden; /* Keeps the paddle inside the section */
	    margin-top: 0 !important;
}



#rules {
    position: relative;
    background-image: url('../img/banner-paddle-left-01.webp');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    z-index: 1;
    overflow: hidden;
    color: #ffffff; /* Ensures text is white on the navy side */
}

#rules::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to left, 
        rgba(0, 40, 85, 1) 33%, 
        rgba(0, 40, 85, 8) 40%, 
        rgba(0, 40, 85, .5) 100%
    );
    z-index: -1;
    object-fit: cover;
}

#rules h2,#rules h3 {color: #F7E351;}
#rules p {color: white;}
#rules .sub-section-intro h4 {
    font-size: 1.2rem;
	color: #c9dbed;}
/* Ensure your Columns and Text sit on top of the background */
#rules .wp-block-columns,
#rules .wp-block-group__inner-container {
    position: relative;
    z-index: 2; /* Forces content to stay visible */
}






/* Container Adjustments */
.col-weekly-schedule {
    background-color: #f0f4f8 !important; /* Very light cool-grey/blue background to avoid "stark white" */
    border-radius: 15px;
    border: 1px solid #d1d9e0;
}

/* Heading Icon Color */
.col-weekly-schedule h2 i {
    color: #002855;
    margin-right: 10px;
}

/* Table Styling */
.col-weekly-schedule figure.wp-block-table {
    margin: 20px 0 !important;
}

.col-weekly-schedule table {
    border-collapse: separate;
    border-spacing: 0;
    border: 2px solid #002855;
    border-radius: 10px;
    overflow: hidden; /* Ensures rounded corners work */
    background-color: #ffffff;
}

/* Table Header - ERPA Navy & Gold */
.col-weekly-schedule table thead tr {
    background-color: #002855 !important;
}

.col-weekly-schedule table thead td {
    color: #F7E351 !important; /* ERPA Yellow */
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 15px !important;
    border: none !important;
}

/* Row Styling */
.col-weekly-schedule table tbody tr td {
    border-bottom: 1px solid #e2e8f0;
    padding: 12px 15px !important;
    color: #002855;
    vertical-align: middle;
}

/* Alternate Row Colors - Light Blue instead of Grey */
.col-weekly-schedule table tbody tr:nth-child(even) {
    background-color: #e6f0fa; 
}

/* Special Highlight for Lessons/Drills */

.col-weekly-schedule table td strong {
    color: #096b09;
}
.col-weekly-schedule table thead tr td strong {
    color: #d4af37; /* A slightly deeper gold for text readability */
}
/* Hover Effect */
.col-weekly-schedule table tbody tr:hover {
    background-color: #fff9c4 !important; /* Subtle yellow glow on hover */
}

/* Style the Location Links */
.col-weekly-schedule p a {
    color: #002855;
    font-weight: 700;
    text-decoration: underline;
}

/* Hide the old list format once you confirm the table looks good */
.col-weekly-schedule ul.wp-block-list {
    display: none;
}

/* Target the Loop Column */
.nwd-info-card.loop {
    background-color: #002855 !important; /* ERPA Navy */
    border-radius: 15px;
    padding: 30px !important;
    color: #ffffff !important; /* White text for readability */
    border: 2px solid #F7E351; /* Yellow border to tie into the brand */
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/* Heading Styling */
.nwd-info-card.loop h3 {
    color: #F7E351 !important; /* ERPA Yellow */
    font-size: 1.8rem;
    margin-bottom: 20px !important;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Seasonal Tag (The dates no play is happening) */
.nwd-info-card.loop .seasonal-tag {
    background-color: rgba(247, 227, 81, 0.1); /* Subtle yellow tint */
    border: 1px dashed #F7E351;
    padding: 15px;
    border-radius: 8px;
    font-weight: 700;
    color: #F7E351 !important;
    margin: 20px 0 !important;
}

/* Button Styling */
.btn-download-app a.wp-block-button__link {
    background-color: #F7E351 !important;
    color: #002855 !important; /* Dark text on light button */
    font-weight: 800 !important;
    text-transform: uppercase;
    border: none;
    transition: all 0.3s ease;
    padding: 15px 25px !important;
}

.btn-download-app a.wp-block-button__link:hover {
    background-color: #ffffff !important;
    transform: scale(1.05);
}

/* Supporting text */
.nwd-info-card.loop p,.nwd-info-card.loop p a {
    line-height: 1.6;
    font-size: 1.05rem;
    color: white;
}

/* Tighten up the table cells */
.col-weekly-schedule table tbody tr td {
    padding: 8px 12px !important; /* Reduced from 12px/15px */
    line-height: 1.2 !important;
}

/* Reduce spacing between the two tables */
.col-weekly-schedule h4 {
    margin-top: 20px !important;
    margin-bottom: 10px !important;
}

/* Ensure the right column content doesn't feel "lost" in the deep blue */
.nwd-info-card.loop {
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Keeps content at the top */
    height: 100%; /* Ensures the navy background stretches to match the table height */
}
#play-pickleball-locations p a {color: var(--wp--preset--color--primary);}




/*               ABOUT PAGE -------------------*/
/* Target the figure and the image inside it */
.nwd-breakout-image {
    width: 100vw !important;
    max-width: 1300px !important; /* Limits it so it doesn't get ridiculously huge */
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
	margin: 0 auto;
    text-align: center;
}

.nwd-breakout-image img {
    width: 100% !important;
    height: auto !important;
	border-radius: 10px;
}
.nwd-history-photo img {
    border: 10px solid white !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
/*    transform: rotate(3deg);*/
    max-width: 100%;
    height: auto;
}
/* Style the individual info cards */
.nwd-info-card {
    background: #ffffff;
    padding: 40px 30px !important;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05); /* Very soft shadow */
    transition: transform 0.3s ease, border-color 0.3s ease;
    border-bottom: 4px solid #F7E351; /* The Action Yellow accent */
}

.nwd-info-card:hover {
    transform: translateY(-10px); /* Lifts up on hover like a modern app */
    border-bottom: 4px solid #006600; /* Turns Green on hover */
}

.nwd-info-card i {
    font-size: 2.5rem;
    color: #002147;
    margin-bottom: 20px;
    display: block;
}

.nwd-info-card h4 {
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 15px;
    color: #002147;
}


/* Center board content and style text */
.nwd-board-card {
    text-align: center;
    padding: 20px;
}

.nwd-board-card h4,.nwd-board-card a {
    margin: 10px 0 5px 0 !important;
    font-size: 1.1rem;
    color: #d1d1d1 !important;
    font-weight: 700;
}

.nwd-board-card p {
    color: #006600;
    font-weight: 700;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.nwd-docs-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin: 50px 0;
    padding: 0 20px;
}

.nwd-doc-btn a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 28px;
    border-radius: 4px;
    text-decoration: none !important;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Primary Button - Dark Navy */
.nwd-btn-primary a {
    background-color: #002147;
    color: #ffffff !important;
    border: 2px solid #002147;
}

.nwd-btn-primary a:hover {
    background-color: #006600; /* Turns Court Green on hover */
    border-color: #006600;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Outline Button - Transparent/Navy */
.nwd-btn-outline a {
    background-color: transparent;
    color: #002147 !important;
    border: 2px solid #002147;
}

.nwd-btn-outline a:hover {
    background-color: #f7e351 !important; /* Action Yellow pop */
    border-color: #f7e351;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Icon Colors */
.nwd-doc-btn i {
    font-size: 1.1rem;
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
    .nwd-doc-btn {
        width: 100%; /* Stack buttons on small phones */
        justify-content: center;
    }
}

/* Styling for the Narrative Quote */
blockquote.wp-block-quote {
    background: #f8f9fa; /* Very soft grey to set it apart from white bg */
    border-left: 6px solid #006600; /* Court Green accent */
    padding: 30px 40px !important;
    margin: 40px 0 !important;
    position: relative;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    font-style: italic;
}

/* Add a stylized decorative quote mark */
blockquote.wp-block-quote::before {
    content: "\201C"; /* Unicode for open quote */
    position: absolute;
    top: -10px;
    left: 10px;
    font-family: Georgia, serif;
    font-size: 5rem;
    color: rgba(0, 102, 0, 0.1); /* Very faint green quote mark */
    line-height: 1;
}

/* Style the text inside */
blockquote.wp-block-quote p {
    color: #002147 !important; /* Dark Navy */
    line-height: 1.6 !important;
    margin: 0 !important;
    font-weight: 500;
}

/* Bold the emphasis points */
blockquote.wp-block-quote strong {
    color: #006600; /* Green for Riverview Park / 10-court facility */
}

/* Custom ERPA Divider */
/* Wide Fading Divider */
hr.wp-block-separator.is-style-default {
    border: none;
    height: 2px;
    background: linear-gradient(to right, transparent, #002147 50%, transparent);
    opacity: 0.2 !important;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
.col-wrapper-max-1280 {max-width:1280px;margin:0 auto;}





/* 1. Base Container Styling (Applies to both File Blocks and Paragraphs with links) */
#section-minutes .wp-block-file,
#section-minutes p:has(a) {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-left: 5px solid #006600; /* Court Green accent */
    padding: 18px 25px;
    border-radius: 4px;
    margin-bottom: 10px !important;
    transition: all 0.2s ease-in-out;
}

/* Hover effects */
#section-minutes .wp-block-file:hover,
#section-minutes p:has(a):hover {
    background: #fcfcfc;
    border-color: #F7E351;
    transform: translateX(5px);
}

/* 2. Link Styling */
#section-minutes .wp-block-file a,
#section-minutes p a {
    color: #002147 !important;
    font-weight: 700;
    text-decoration: none !important;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 15px;
    width: 100%;
}

/* 3. Default Icon (Generic File) */
#section-minutes p a::before,
#section-minutes .wp-block-file a::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 1.2rem;
    content: "\f15b"; /* Generic file icon */
    color: #666666;
}

/* 4. PDF Specific Icon */
#section-minutes a[href$=".pdf"]::before {
    content: "\f1c1" !important;
    color: #cc0000 !important; /* Red for PDF */
}

/* 5. Word Document Specific Icon (.doc or .docx) */
#section-minutes a[href$=".doc"]::before,
#section-minutes a[href$=".docx"]::before {
    content: "\f1c2" !important;
    color: #2b579a !important; /* Blue for Word */
}

/* 6. Excel Specific Icon (Just in case!) */
#section-minutes a[href$=".xls"]::before,
#section-minutes a[href$=".xlsx"]::before {
    content: "\f1c3" !important;
    color: #1d6f42 !important; /* Green for Excel */
}

/* Skill Development Cards */
.skill-card-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 25px;
    margin-top: 30px;
}

.skill-card {
    background: #ffffff;
    border-top: 5px solid #006600; /* Court Green accent */
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
}

.skill-card h3 {
    color: #002147;
    font-size: 1.4rem;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.skill-card p {
    font-size: 1rem;
    line-height: 1.6;
    flex-grow: 1;
}

/* Button style for the Email/PDF links */
.skill-card .btn-skill a{
    margin-top: 20px;
    display: inline-block;
    background-color: #002147;
    color: #F7E351 !important; /* Yellow text on Navy */
    text-align: center;
    padding: 10px 20px;
    text-decoration: none;
    font-weight: 800;
    border-radius: 4px;
    text-transform: uppercase;
    transition: background 0.3s;
}

.skill-card .btn-skill a:hover {
    background-color: #006600;
    color: #fff !important;
}

/* Specific styling for the "Seasonal" tag */
.seasonal-tag {
    font-size: 0.75rem !important;
    background: #eee;
    padding: 7px 12px;
    border-radius: 10px;
    text-transform: uppercase;
    color: #666;
    font-weight: 700;
}

/* Container constraints */
.col-the-board {
    max-width: 1400px;
    margin: 0 auto;
}

/* Card Styling Improvements */
.nwd-board-card {
    background-color: #002855; /* Solid Navy for a clean look */
    border-radius: 12px;
    padding: 30px !important;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.nwd-board-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

/* Icon Styling */
.nwd-board-card .nwd-icon {
    font-size: 40px;
    color: #F7E351; /* ERPA Yellow */
    margin-bottom: 20px;
}

/* Typography Fixes */
.nwd-board-card h4 {
    color: #ffffff !important;
    font-size: 1.4rem;
    margin-bottom: 5px !important;
    text-transform: none; /* Removes forced all-caps */
}

/* Email Links - Single Line & Clickable */
.nwd-board-card p.board-email {
    margin-bottom: 20px !important;
    margin-block-start: 0;
    text-align: center;
}
.nwd-board-card p a {
    color: #F7E351 !important; /* Yellow for high visibility */
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    word-break: break-all; /* Prevents overflow on smaller screens */
}

/* The Bio Text - Replacing the Green All-Caps */
.nwd-board-card p {
    color: #e0e0e0 !important; /* Soft white/light gray */
    font-size: 1rem;
    line-height: 1.6;
    text-align: left; /* Left align bios for much better readability */
    text-transform: none !important; /* Forces sentence case over all-caps */
}
/* Name Styling */
.nwd-board-card h4.board-name {
	margin-block-start: 0;
    color: #ffffff !important;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 2px !important; /* Tighten gap to title */
    text-transform: none;
}

/* Title Styling - Distinct and professional */
.nwd-board-card .board-title {
    margin-block-start: 0;
    color: #F7E351 !important;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase !important;
    letter-spacing: 1px;
    margin-bottom: 1px !important;
    text-align: center;
}
/* Directors at Large Section */
#section-the-board h4:not(.nwd-board-card h4) {
    margin-top: 40px;
    color: #002855;
}

#section-the-board p.has-text-align-center {
    font-size: 1.2rem;
    color: #333;
}



/*-------------------------------------
            MERCHANDISE 
---------------------------------------*/


/* 1. Style the Main Card Container */
.merch-grid .wp-block-post {
    background: #fff;
    border: 1px solid #e1e1e1;
    border-radius: 8px;
    border-top: 4px solid #F7E351; /* ERPA Yellow accent */
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: transform 0.2s ease;
}

.merch-grid .wp-block-post:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}

/* 2. Style the Title */
.merch-grid .wp-block-post-title {
    font-size: 1.25rem !important;
    color: #002855 !important; /* ERPA Navy */
    margin: 15px 0 10px 0 !important;
    font-weight: bold;
    line-height: 1.3;
}







/* 5. Clean up the Featured Image */
.merch-grid .wp-block-post-featured-image {
    margin: 0 0 15px 0 !important;
}

.merch-grid .wp-block-post-featured-image img {
    border-radius: 4px;
    width: 100%;
}


/* 1. Hide any default list styling */
.merch-grid .wp-block-post-content ul.wp-block-list {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 2. Add the Font Awesome Bullet */
.merch-grid .wp-block-post-content li {
    position: relative;
    padding-left: 1.5rem !important; /* Space for the icon */
    margin-bottom: 8px !important;
    font-size: 0.95rem;
    color: #444;
    line-height: 1.5;
}

.merch-grid .wp-block-post-content li::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900; /* Required for FA solid icons */
    content: "\f111"; /* This is the 'circle' icon code */
    position: absolute;
    left: 0;
    top: 5px; /* Adjusts the vertical alignment of the bullet */
    font-size: 0.5rem; /* Makes the bullet a nice small size */
    color: #F7E351; /* ERPA Yellow - makes bullets match your brand */
}

/* 3. Style the Price (Last Item) */
/* This removes the bullet from the price and makes it bold */
.merch-grid .wp-block-post-content li:last-child {
    font-weight: bold !important;
    color: #002855 !important;
    margin-top: 12px !important;
    padding-left: 0 !important;
    font-size: 1.1em;
}

.merch-grid .wp-block-post-content li:last-child::before {
    content: none !important; /* Removes the yellow bullet from the price line */
}



/* CONTACT PAGE */
/* Contact Page Specific Adjustments */
.nwd-contact-info-list p {
    font-size: 1.1rem;
    margin-bottom: 15px;
}

.nwd-contact-info-list strong {
    font-weight: 700;
    color: #002147;
}
/* Style the form inputs to look modern */
.wpforms-container input, .wpforms-container textarea {
    border: 2px solid #e0e0e0 !important;
    border-radius: 4px !important;
    padding: 12px !important;
    transition: border-color 0.3s ease;
}

.wpforms-container input:focus, .wpforms-container textarea:focus {
    border-color: #006600 !important; /* Court Green on focus */
    outline: none;
}

/* Style the Submit Button to match your Yellow buttons */
.wpforms-container .wp-block-button__link {
    background-color: #F7E351 !important;
    color: #002147 !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    border: none !important;
}



/*--------------------------------------------
              NEW COURT PROJECT
---------------------------------------------*/

/* Donations Paused Styling */
.donation-paused-notice {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-left: 5px solid #006600;
    padding: 20px 24px;
    border-radius: 8px;
    margin: 30px 0;
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

/* Icon Styling (uses WordPress Dashicons) */
.donation-paused-notice .notice-icon {
    color: #166534;
    font-size: 24px;
    margin-top: 2px;
}

/* Text Content Styling */
.donation-paused-notice h3 {
    color: #14532d; /* Deep forest green */
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 8px 0 !important;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.donation-paused-notice p {
    color: #166534;
    font-size: 15px;
    line-height: 1.5;
    margin: 0 !important;
    font-weight: 500;
}

/* Ensure the icon scales if using Dashicons */
.donation-paused-notice .dashicons {
    width: 30px;
    height: 30px;
    font-size: 30px;
}







/* Container for the card */
.nwd-sponsorship-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 2rem !important;
    text-align: center;
    transition: all 0.3s ease-in-out !important;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
	max-width:1200px;
	Margin: 0 auto !important;
}

/* Hover effect to make it interactive */
.nwd-sponsorship-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 12px 20px rgba(0, 48, 87, 0.1); /* Navy tinted shadow */
    border-color: #003057 !important; /* Navy border on hover */
}

/* The Tier Name (Bronze, Silver, etc.) */
.nwd-sponsorship-card h4 {
    color: #003057 !important; /* Navy */
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.1rem !important;
    margin-bottom: 0.5rem !important;
}

/* The Price/Amount */
.nwd-sponsorship-card p {
    color: #006600 !important; /* Brand Green or Navy */
    font-size: 2.25rem !important;
    font-weight: 800 !important;
  /*  margin: 1rem 0 !important;*/
    display: block;
}

/* Optional: Add a 'popular' or 'highlight' style for Platinum */
.nwd-sponsorship-card.is-platinum {
    background-color: #f8fafc !important;
    border: 2px solid #F7E351 !important; /* Action Yellow border */
}

.legacy-highlight {
    background-color: #003057 !important;
    color: #ffffff !important;
    margin-top: 3rem !important;
    border: 2px dashed #F7E351 !important;
}
.legacy-highlight h3 {
    color: #F7E351 !important;
}
.legacy-highlight p {
	font-size:1.2em !important;
	color: #ffffff !important;}


.nwd-fine-print {
    font-size: 0.9rem !important;
    opacity: 0.9;
    margin-top: 2rem !important;
    line-height: 1.4 !important;
    max-width: 600px; /* Keeps it centered and readable */
    margin-left: auto !important;
    margin-right: auto !important;
}
/* Styling the two 'Ways to Give' secondary cards */
.nwd-ways-card {
    background: #ffffff !important;
    border-top: 5px solid #006600 !important; /* Brand Green accent bar at the top */
    border-radius: 8px !important;
    padding: 2.5rem !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05) !important;
    height: 100%;
}

.nwd-ways-card h3 {
    color: #003057 !important; /* Navy */
    margin-bottom: 1rem !important;
}

/* The Parent Section */
.nwd-new-court-background-fade {
    position: relative;
    background-image: url('https://erpa.dev.nwd.host/wp-content/uploads/sites/28/banner-proposed-10-court.webp');
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Optional: adds a parallax effect */
    z-index: 1;
    overflow: hidden;
}

/* The Navy Overlay */
.nwd-new-court-background-fade::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 48, 87, 0.85); /* Navy with 85% opacity */
    z-index: -1; /* Puts overlay behind text but in front of image */
}


.nwd-new-court-background-fade ul li::before {
    content: "\f058";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: -1.75rem;
   color: #F7E351;
    font-size: 1.1rem;
    display: inline-block;
}

.nwd-new-court-background-fade h2 {   color: var(--wp--preset--color--secondary) !important;}
.nwd-new-court-background-fade ul {
    list-style: none;
    padding-left: 1.5rem;
    margin-left: 11px !important;
}
.nwd-new-court-background-fade ul li {
    position: relative;
    margin-bottom: 0.75rem;
    line-height: 1.5;
}
.nwd-new-court-background-fade p,.nwd-new-court-background-fade li {color:white;}

#section-support-goal h4,#section-support-goal ul li {color:#ffffff !important;}



/* Sponsorship List Styling */
.sponsor-list-column {
    background: #f9f9f9;
    padding: 30px !important;
    border-left: 5px solid #ffcc00; /* Matching your yellow brand color */
    border-radius: 8px;
}

.sponsor-list-column ul {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.sponsor-list-column li {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    font-size: 0.95rem;
    line-height: 1.4;
}

.sponsor-list-column li strong {
    display: block;
    color: #004d2c; /* Brand Green */
    font-size: 1.1rem;
    margin-bottom: 4px;
}

/* Form Column Styling */
.sponsor-form-column {
    padding: 20px !important;
    border: 1px solid #e2e2e2;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}


.donation-notice {
  
   font-size: 0.8rem !important;
	color: #666;
    background-color: #f9f9f9;
    padding: 5px 15px;
    border-left: 4px solid #F7E351;
    margin-top: 20px;
    border-radius: 0 8px 8px 0;
    line-height: 1.4;
}


.donation-notice::before {
    content: "\f05a"; /* info-circle icon */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 10px;
    color: #004d2c;
    font-size: 1rem;
}




.donation-notice a {
    color: #004d2c;
    font-weight: 700;
    text-decoration: underline;
}

.donation-notice a:hover {
    color: #ffcc00; /* Brand Yellow/Gold */
}





/* Fix for Mobile (Fixed backgrounds can be glitchy on iOS) */
@media (max-width: 768px) {
    .nwd-new-court-background-fade {
        background-attachment: scroll;
    }
}









/*------------------------------------------------------
                     MEMBERSHIP
-----------------------------------------------------*/
#membership-levels .wp-block-button__link:hover {  background-color:#f7e351;
    color: #002147;     transition: all 0.3s ease;
}


/* Payment Guidelines Block Styling */
.payment-guidelines-block {
    background-color: #fdfdfd; /* Very light gray/white background */
    border-left: 5px solid #ffcc00; /* The ERPA Yellow accent */
    border-top: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    padding: 25px 30px;
    margin: 30px 0;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* Title inside the block */
.payment-guidelines-block h3 {
    margin-top: 0;
    color: #333;
    font-size: 1.25rem;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Adding a little "Info" icon before the title using CSS */
.payment-guidelines-block h3::before {
    content: 'ⓘ';
    margin-right: 10px;
    color: #ffcc00;
    font-weight: bold;
    font-size: 1.4rem;
}

/* List styling inside the block */
.payment-guidelines-block ul {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
}

.payment-guidelines-block ul li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 12px;
    line-height: 1.5;
    color: #555;
    font-size: 1.05rem;
}

/* Custom Checkmark for the list items */
.payment-guidelines-block ul li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #2ecc71; /* A nice green for "do these things" */
    font-weight: bold;
}

/* Highlighting the "No Cash" warning */
.payment-guidelines-block ul li strong {
    color: #d9534f; /* Soft red for the warning */
}

/* Responsive adjustment */
@media (max-width: 768px) {
    .payment-guidelines-block {
        padding: 20px;
        margin: 20px 0;
    }
}











#section-fade-about .home-tag-line {
    padding-top: 5px;
    white-space: nowrap;
    display: block;
    width: 100%;
    text-align: center;
    overflow: visible;
    font-size: clamp(0.7rem, 3.2vw, 4rem);
	max-width: 100%;
}

/* Specific fix for small mobile screens */
@media (max-width: 480px) {
    .home-tag-line {
        font-size: 3vw; /* Forces it to scale strictly by width on tiny screens */
    }
}




/* --- ERPA Animation Library (Scroll-Triggered) --- */


/* --- Optimized Trigger-Based Animations --- */

/* Base state for all anim elements */
[class*="nwd-fade-"] {
    opacity: 0;
    animation-duration: 0.8s;
    animation-fill-mode: forwards;
    animation-play-state: paused;
}

/* The Trigger Class */
.nwd-start-anim {
    animation-play-state: running !important;
}

/* Animation Assignments */
.nwd-fade-up.nwd-start-anim { animation-name: fadeUp; }
.nwd-fade-in.nwd-start-anim { animation-name: fadeIn; }
.nwd-fade-left.nwd-start-anim { animation-name: fadeInLeft; }
.nwd-fade-right.nwd-start-anim { animation-name: fadeInRight; }

/* Utility Delays - Using !important ensures these win over the base state */
.delay-1 { animation-delay: 0.2s !important; }
.delay-2 { animation-delay: 0.4s !important; }
.delay-3 { animation-delay: 0.6s !important; }
.delay-4 { animation-delay: 0.8s !important; }

/* Keyframes */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(50px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes zoomIn { to { opacity: 1; transform: scale(1); } }









/* Ken Burns Zoom Out Effect */
@keyframes kenBurnsZoomOut {
    from {
        transform: scale(1.1); /* Start slightly zoomed in */
        transform-origin: center center; /* Zoom from the center */
    }
    to {
        transform: scale(1); /* Zoom out to original size */
        transform-origin: center center;
    }
}

.ken-burns-bg-zoom { /* apply to wp-block-cover__image-background */
    animation: kenBurnsZoomOut 15s ease-out forwards; /* Apply the animation */
    /* Ensure the image covers its container */
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* Ensure the cover container has a defined height to see the effect */
#section-hero-banner {
    overflow: hidden; /* Important to hide parts of the image that are initially scaled out */
    position: relative; /* For positioning child elements if needed */
    height: 550px; /* Example height, adjust as needed */
}

/* Optional: To make sure the image fills the cover properly while animating */
.ken-burns-bg-zoom   {  /* apply to wp-block-cover__image-background  */
    position: absolute;
    top: 0;
    left: 0;
}







/*------------------------------------------------------------------------------
FOOTER
-------------------------------------------------------------------------------*/
footer {
    margin-top: 0;
    background-color: #024b83;
}

footer .wp-block-image.size-full,footer .wp-block-site-logo {
    display: flex;
    align-items: center;
    justify-content: center;
}
footer p {color:white !important}

footer li a {
    color: white !important;
    font-size: 1.1em !important;
    text-decoration: none;
}
body footer p, body > div.wp-site-blocks > footer > div > div.wp-block-group.alignwide.is-layout-flow.wp-block-group-is-layout-flow > p, footer p a { color:white !important;}

footer .wp-block-site-logo img {
    height: auto;
    max-width: 77%;
}
body footer .wp-block-group h2 {
    color: #5bb5f8 !important;
	    color: #abadaf !important;
    text-transform: uppercase;
    font-size: 1.2em !important;
}

body footer .wp-block-group h3 { color: #5bb5f8 !important;
	    color: #abadaf !important;
    text-transform: uppercase;}
footer .group-copyright {
    padding-top: 2em !important;
    text-align: center;
}
footer .footer-columns-wrapper {    justify-content: center !important;
    max-width: 1400px !important;}


footer .wp-block-group ul li::before {
    padding: 0 12px 0 0;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: #ffffff !important;
    font-size: 14px;
    top: -1px;
    position: relative;
}

/* --- ERPA Global Footer Styles --- */

/* Main Container Background & Text */
footer .nwd-main-footer {
    background-color: #002147 !important;
    color: #F9F9F9 !important;
    padding-top: 4em !important;
    padding-bottom: 2em !important;
}

/* Ensure all nested text/paragraphs inherit white color */
.nwd-main-footer p, 
.nwd-main-footer span,
.nwd-main-footer h2 {
    color: #F9F9F9 !important;
}

/* Heading Styling (Column Titles) */
.nwd-main-footer h2.wp-block-heading {
    border-left: 3px solid #18A6E7; /* Sky Blue Accent */
    padding-left: 12px;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Navigation Links */
.nwd-main-footer .wp-block-navigation .wp-block-navigation-item__content {
    color: #F9F9F9 !important;
    text-decoration: none;
    transition: all 0.3s ease;
    padding: 4px 0;
    display: inline-block;
}

.nwd-main-footer .wp-block-navigation .wp-block-navigation-item__content:hover {
    color: #18A6E7 !important; /* Fade to Sky Blue on Hover */
    transform: translateX(5px);
}

/* Membership/Get Involved Navigation Spacing */
.nwd-main-footer .wp-block-navigation__container {
    gap: 8px !important;
}

/* Signup Button Customization */
.nwd-main-footer .wp-block-button__link {
    background-color: #18A6E7 !important; /* Sky Blue */
    color: #FFFFFF !important;
    border-radius: 6px;
    font-weight: 700;
    transition: background 0.3s ease;
}

.nwd-main-footer .wp-block-button__link:hover {
    background-color: #F7E351 !important; /* Action Yellow */
    color: #002147 !important;
}

/* Bottom Copyright Bar */
.nwd-main-footer .group-copyright {
    border-top: 1px solid rgba(24, 166, 231, 0.3);
    margin-top: 9px;
}

.nwd-main-footer .group-copyright p {
    font-size: 0.85rem;
    opacity: 0.8;
}

.nwd-main-footer .group-copyright a {
    color: #18A6E7;
    text-decoration: none;
}

.nwd-main-footer .group-copyright a:hover {
    text-decoration: underline;
}

/* Logo specific filtering (if applied) */
.nwd-logo-white img {
    filter: brightness(0) invert(1);
}

.nwd-footer-about-text {
    border-left: 2px solid #18A6E7;
    padding-left: 20px;
    font-style: italic;
    line-height: 1.6;
    color: #F9F9F9;
}




/*------------------------------------------------------------------------------
MEDIA QUERIES 
-------------------------------------------------------------------------------*/

@media (min-width: 1200px) {

	#section-hero-erpa .wp-block-cover__image-background.has-parallax {
   /* background-position-y: -5em !important;*/
}
	    /* Reduce logo size slightly on smaller desktops to buy more room */
   
        .wp-block-site-logo img {
          /*  width: 80px !important;*/
        /*    height: auto !important;*/
			min-width: 130px;
        }

	.wp-site-blocks .nav-primary-menu {padding-top: 10px !important;
    padding-bottom: 10px !important;}
	
#col-fund-progress h3 {
    font-size: 1.6em;
color: #333333 !important;   font-weight: 600;
}
#col-fund-progress .ultimeter_meter_amount {
    font-size: 1.6em !important;
    font-family: var(--wp--preset--font-family--baloo-2);
}
	/*--------------------------*/ }


@media (min-width: 980px) {
	
	  .wp-block-site-logo img {
          /*  width: 80px !important;*/
        /*    height: auto !important;*/
			min-width: 118px;
        }
	    /* Ensure the header stays in a single row */
    .nav-primary-menu > .wp-block-group {
        flex-wrap: nowrap !important;
        gap: 11px !important; /* Adjust spacing between Logo, Nav, and Button */
    }

    /* Force menu items to stay in a row but allow text to wrap inside the link */
    .wp-block-navigation__container {
        flex-wrap: nowrap !important;
    }

    .wp-block-navigation-item {
      /*  max-width: 100px;*/ /* Limits width to force multi-word titles to wrap */
        line-height: 1.2;
        text-align: center;
    }

body .wp-block-navigation-item__content {
        padding-left: 5px !important;
        padding-right: 5px !important;
        white-space: normal !important; /* Allows "New Court Project" to wrap */
        display: block !important;
		line-height: 25px;
    }
    

	
.hero-subtitle {
    line-break: strict;
    word-break: keep-all;
    overflow-wrap: normal;
   /* margin-top: 1.5em !important;*/
}
	#section-hero .wp-block-cover {   padding: 6em 2em !important;}
	#section-hero .wp-block-cover__inner-container p:first-child {
    font-size: 2.4em !important;
		    line-height: 1.4em;
}
#section-hero .wp-block-cover p {  
    max-width: 834px;
}	
	
	
	
	/*--------------------------*/ }

@media (min-width: 600px) {
	#section-hero-banner { min-height: 501px;}
#section-hero-banner h1, #section-hero-banner p,
	#section-hero-banner .wp-block-buttons{

            max-width: 750px;

}
    .wp-block-gallery.has-nested-images.columns-4 figure.wp-block-image:not(#individual-image) {
        width: calc(25% - var(--wp--style--unstable-gallery-gap, 16px)* .75);
        display: inline-grid;
        max-height: 200px;
        overflow: hidden;
        min-height: 200px;
    }
	
footer .wp-block-columns div.wp-block-column:nth-child(2) {margin-left:25px;}	
	
	/* ------------------------ /min 600px */}

@media (max-width: 1368px) {
	
:root :where(.is-layout-flex) {   gap: 1rem;}
	
	}
		

@media (max-width: 1275px) {
  header .has-global-padding {
    padding-right: 23px;
    padding-left: 24px;
}
.wp-block-navigation__responsive-container-content ul {  gap: 5px;}
                           }



@media (max-width: 981px) {
	

	
	
	
	
	

	#pattern-progress-bar {padding-bottom:3em !important;}
	#section-home-goal .wp-block-column {padding-bottom: 10px !important;}
.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    fill: rgb(254 229 50);
    height: 40px;
    width: 40px;
}
    /* Show the hamburger icon */
    .wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open {
        display: flex !important;
    }

    /* Hide the desktop horizontal menu list */
    .wp-block-navigation__responsive-container:not(.has-modal-open) {
        display: none !important;
    }

    /* Hide the separate Donate button group if you want it inside the mobile menu instead */
    .hide-on-mobile {
        display: none !important;
    }
}





@media (max-width: 768px) {
		
#section-home-cta .wp-block-column figure {    margin: 0 auto;
    text-align: center;
    padding-bottom: 2em;}
	
	#section-home-cta h2 {

    white-space: normal;

}
    #rules {
background-image:none;
		    background: linear-gradient(to left, rgba(0, 40, 85, 1) 100%, rgba(0, 40, 85, 8) 40%, rgba(0, 40, 85, .5) 100%);
    }



  .hero-section {
    background-attachment: scroll;
}
	.home #section-fade-about .wp-block-columns .wp-block-column:first-child {padding: 2em 20px 1em 20px !important;}	
	.home #section-fade-about .wp-block-columns .wp-block-column:first-child h3 {font-size: clamp(0.7rem, 4.7vw, 4rem) !important;}	
	
	.wp-block-cover.has-parallax .wp-block-cover__image-background {
        /* Disables parallax on mobile to prevent extreme zooming */
        background-attachment: scroll !important;
        
        /* Forces the image to center and show as much as possible */
        background-position: center center !important;
        background-size: cover !important;
    }
    
    .wp-block-cover {
        /* Adjusts height for mobile so the loon and water are more visible */
        min-height: 400px !important; 
    }
	
	
	.nwd-full-bleed-image img {
        position: relative;
        width: 100%;
        height: auto;
        mask-image: none; /* Remove mask on mobile for better visibility */
        -webkit-mask-image: none;
    }
	/*------------------- max 768-------*/ }	


	
	
	

	
@media (max-width: 599px) {

	.wp-block-cover .wp-block-cover__inner-container {margin-top:1em !important;}
	
.givewp-fields-gateways__gateway--paypal-commerce .givewp-fields-gateways__gateway__label::after {
    content: "Pay with Credit Card";
    visibility: visible;
    position: absolute;
    left: 0;
    top: 9px;
    white-space: nowrap;
}
	.givewp-fields-gateways__gateway--offline .givewp-fields-gateways__gateway__label::after {
    content: "Pay by Check";
    visibility: visible;
    position: absolute;
    left: 0;
		top:9px;
    white-space: nowrap;
}
	
	.pulse-label {
    font-size: 1.3rem;
}
body .hide-on-mobile {display:none !important;}
.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
    width: auto;
    margin: 1em 0;
}
	a.wp-block-button__link {font-size: .80em !important;
    text-wrap-mode: nowrap;}	
	.donation-info-block { padding: 10px 10px;}	
#section-contact-us {padding: 1.5em;}
	
   /*------------------------------------MAX 599px------------*/ }

/* Fix for ERPA Mobile Buttons stretching the screen */
@media (max-width: 480px) {
	#section-hero-erpa .wp-block-cover__inner-container .wp-block-buttons {        gap: .3rem;}
	div.wppb-progress {
    height: 25px;
		width: auto !important;}
	
	
	#schedule {padding: 14px;}
	#schedule .wp-block-column {    padding: 10px 9px !important;}
	.nwd-cta-final .wp-block-image {margin: 0 auto;
    text-align: center;}
	.nwd-resource-box {
    margin: 1em !important;
}
	
	
    .wp-block-button__link {
        /* Allows the text to wrap to a second line if it's too long */
        white-space: normal !important;
        
        /* Ensures the button never gets wider than the phone screen */
        max-width: 100% !important;
        width: 100% !important;
        
        /* Centers the text and icon if it wraps */
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        
        /* Adjust padding so the text doesn't hit the edges */
        padding-left: 15px !important;
        padding-right: 15px !important;
        
        /* Prevents the text from being huge on small screens */
        font-size: 14px !important; 
    }

    /* Fix for the icon spacing if the text wraps */
    .wp-block-button__link i {
        margin-left: 10px;
        flex-shrink: 0; /* Keeps the icon from getting squashed */
    }
	.wp-block-button__link:last-child {margin-top:15px !important;}
}
@media (max-width: 380px) {
#section-hero-erpa .wp-block-cover__inner-container { padding-right: 15px;
        padding-left: 15px;}
                                     }