:root {
	--bs-primary:   #19334d;      /* Deep navy blue */
	--bs-secondary: #ffffff;      /* White for menu elements */
	--bs-dark:      #282828;
	--bs-light:     #f3f7fa;
	--bs-info:      #adcbe3;
	--bs-success:   #458856;
	--bs-danger:    #b70700;
	--bs-warning:   #f7c873;
	--bs-grayorange:#e5e2db;
	--bs-blue:      #2357a2;
	--bs-white:     #ffffff;
	--bs-black:     #000000;
	
	--bs-parchment: #f4ecd8;
	--bs-dark-gold: #b5852c;

	--bs-gradient-primary:      linear-gradient(90deg, var(--bs-primary) 60%, var(--bs-blue) 100%);
	--bs-gradient-inverse:      linear-gradient(90deg, var(--bs-blue) 30%, var(--bs-primary) 100%);
	--bs-gradient-warning:      linear-gradient(90deg, var(--bs-warning) 40%, var(--bs-blue) 100%);
	--bs-gradient-cta:          linear-gradient(90deg, var(--bs-primary) 60%, var(--bs-secondary) 100%);
	--bs-gradient-hero-bg:      linear-gradient(120deg, var(--bs-secondary) 0%, var(--bs-parchment) 100%); /* Tweak this color for hero */
	--bs-gradient-heading:      linear-gradient(90deg, var(--bs-primary) 13%, var(--bs-danger) 99%);
	--bs-gradient-banner:       linear-gradient(90deg, var(--bs-dark) 40%, var(--bs-primary) 100%);
	--bs-gradient-section:      linear-gradient(120deg, #a7d5f7 45%, var(--bs-light) 100%);
	--bs-gradient-navbar-apply:       linear-gradient(90deg, var(--bs-primary) 60%, var(--bs-secondary) 100%);
	--bs-gradient-navbar-apply-hover: linear-gradient(90deg, var(--bs-secondary) 30%, var(--bs-primary) 100%);
	
	--bs-gradient-navbar-apply:       linear-gradient(90deg, var(--bs-primary) 60%, var(--bs-secondary) 100%);
	--bs-gradient-navbar-apply-hover: linear-gradient(90deg, var(--bs-secondary) 30%, var(--bs-primary) 100%);

	/* Shadows (no change needed, they auto-adapt to color variables) */
	--bs-shadow-soft:        0 3px 15px 0px color-mix(in srgb, var(--bs-primary), transparent 45%);
	--bs-shadow-card:        0 2px 24px -9px color-mix(in srgb, var(--bs-secondary), transparent 60%);
	--bs-shadow-card-hover:  0 5px 32px -7px color-mix(in srgb, var(--bs-danger), transparent 45%);
	--bs-shadow-hero:        0 12px 40px -18px var(--bs-primary);
	--bs-shadow-footer-icon: 0 2px 8px color-mix(in srgb, var(--bs-dark), transparent 55%);
	--bs-shadow-card-purple: 0 3px 18px -6px color-mix(in srgb, var(--bs-primary), transparent 60%);
	--bs-shadow-banner:      0 8px 24px -10px color-mix(in srgb, var(--bs-dark), transparent 65%);
	--bs-shadow-card-img:    0 4px 16px -6px color-mix(in srgb, var(--bs-primary), transparent 40%);
	--bs-shadow-btn-cta:     0 3px 15px 0px color-mix(in srgb, var(--bs-blue), transparent 45%);
	--bs-shadow-btn-cta-hover: 0 5px 28px -5px color-mix(in srgb, var(--bs-danger), transparent 40%);
	--bs-shadow-footer-icon-hover: 0 10px 32px -6px color-mix(in srgb, var(--bs-secondary), transparent 25%);

	/* Backgrounds & mixes (these will auto-match color palette) */
	--bs-primary-bg-subtle:     color-mix(in srgb, var(--bs-primary) 12%, var(--bs-white));
	--bs-primary-border-subtle: color-mix(in srgb, var(--bs-primary) 40%, var(--bs-white));
	--bs-primary-text-emphasis: color-mix(in srgb, var(--bs-primary) 80%, var(--bs-dark));
	--bs-secondary-bg-subtle:   color-mix(in srgb, var(--bs-secondary) 20%, var(--bs-white));
	--bs-success-bg-subtle:     color-mix(in srgb, var(--bs-success) 20%, var(--bs-white));
	--bs-danger-bg-subtle:      color-mix(in srgb, var(--bs-danger) 20%, var(--bs-white));
	--bs-warning-bg-subtle:     color-mix(in srgb, var(--bs-warning) 20%, var(--bs-white));
	--bs-info-bg-subtle:        color-mix(in srgb, var(--bs-info) 20%, var(--bs-white));
	--bs-light-bg-subtle:       var(--bs-light);
	--bs-dark-bg-subtle:        color-mix(in srgb, var(--bs-dark) 15%, var(--bs-light));
}


/* BACKGROUND COLORS */
.bg-primary    { background-color: var(--bs-primary) !important; }
.bg-secondary  { background-color: var(--bs-secondary) !important; }
.bg-dark       { background-color: var(--bs-dark) !important; }
.bg-light      { background-color: var(--bs-light) !important; }
.bg-info       { background-color: var(--bs-info) !important; }
.bg-success    { background-color: var(--bs-success) !important; }
.bg-danger     { background-color: var(--bs-danger) !important; }
.bg-warning    { background-color: var(--bs-warning) !important; }
.bg-grayorange { background-color: var(--bs-grayorange) !important; }
.bg-parchment { background-color: var(--bs-parchment) !important; }

/* Optional: Gradient or theme special backgrounds */
.bg-gradient-primary   { background: var(--bs-gradient-primary) !important; }
.bg-gradient-inverse   { background: var(--bs-gradient-inverse) !important; }
.bg-gradient-warning   { background: var(--bs-gradient-warning) !important; }
.bg-gradient-cta       { background: var(--bs-gradient-cta) !important; }
.bg-gradient-hero      { background: var(--bs-gradient-hero-bg) !important; }
.bg-gradient-heading   { background: var(--bs-gradient-heading) !important; }
.bg-gradient-banner    { background: var(--bs-gradient-banner) !important; }
.bg-gradient-section   { background: var(--bs-gradient-section) !important; }

/* ICONS */
.icon-apply { color: var(--bs-primary); }
.icon-selection { color: var(--bs-success); }
.icon-production { color: var(--bs-warning); }
.icon-promotion { color: var(--bs-danger); }
.icon-revenue { color: var(--bs-success); }
.icon-collaboration { color: var(--bs-primary); }
.icon-selective { color: var(--bs-primary); }
.icon-services { color: var(--bs-success); }
.icon-nocost { color: var(--bs-warning); }


/* ========= THEME TEXT UTILITIES ========= */
.text-primary { color: var(--bs-primary) !important; }
.text-primary-emphasis { color: color-mix(in srgb, var(--bs-primary) 80%, black) !important; }
.text-secondary { color: var(--bs-secondary) !important; }
.text-secondary-emphasis { color: color-mix(in srgb, var(--bs-secondary) 80%, black) !important; }
.text-success { color: var(--bs-success) !important; }
.text-success-emphasis { color: color-mix(in srgb, var(--bs-success) 80%, black) !important; }
.text-danger { color: var(--bs-danger) !important; }
.text-danger-emphasis { color: color-mix(in srgb, var(--bs-danger) 80%, black) !important; }
.text-warning { color: var(--bs-warning) !important; }
.text-warning-emphasis { color: color-mix(in srgb, var(--bs-warning) 80%, black) !important; }
.text-info { color: var(--bs-info) !important; }
.text-info-emphasis { color: color-mix(in srgb, var(--bs-info) 80%, black) !important; }
.text-light { color: var(--bs-light) !important; }
.text-light-emphasis { color: color-mix(in srgb, var(--bs-light) 80%, black) !important; }
.text-dark { color: var(--bs-dark) !important; }
.text-dark-emphasis { color: color-mix(in srgb, var(--bs-dark) 80%, black) !important; }
.text-body { color: var(--bs-dark) !important; }
.text-muted { color: color-mix(in srgb, var(--bs-dark) 50%, var(--bs-light)) !important; }
.text-grayorange { color: var(--bs-grayorange) !important; }
.text-grayorange-emphasis { color: color-mix(in srgb, var(--bs-grayorange) 80%, black) !important; }
.text-white { color: var(--bs-light) !important; }
.text-black { color: #000 !important; }


.logo-bg-red {
	background-color: #8B2323;
	width: 350px;
	height: 350px;
	display: inline-block;
	border-radius: 50%;
	padding: 20px;
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(25, 51, 77, 0.22);
}

.logo-bg-red img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

.logo-bg-red {
	background-color: #8B2323;
	background-color: #b70600;
	width: 350px;
	height: 350px;
	display: inline-block;
	border-radius: 50%;
	padding: 20px;
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(25, 51, 77, 0.22);
	animation: logo-pulse-glow 1.2s ease-in-out;
}

@keyframes logo-pulse-glow {
	0%, 100% {
		transform: scale(1);
		box-shadow: 0 4px 24px rgba(25, 51, 77, 0.22);
	}
	40% {
		transform: scale(1.08);
		box-shadow: 0 0 32px 8px #d32f2f44, 0 4px 24px rgba(25, 51, 77, 0.22);
	}
	60% {
		transform: scale(1.04);
		box-shadow: 0 0 32px 8px #d32f2f44, 0 4px 24px rgba(25, 51, 77, 0.22);
	}
}

.logo-bg-red:hover {
	box-shadow: 0 0 32px 8px #d32f2f44, 0 4px 24px rgba(25, 51, 77, 0.22);
	transition: box-shadow 0.2s;
}


.accent-underline {
    border-bottom: 4px solid #8B2323;  /* Accent color */
    padding-bottom: 0.12em;
    display: inline-block;
}



/* === FONT FAMILIES === */
body {
	font-family: 'Merriweather', serif;
	background-color: var(--bs-light);
	color: var(--bs-dark);
	padding-top: 80px;
	background-image: var(--bs-gradient-hero-bg);
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Playfair Display', serif;
	color: var(--bs-primary);
	letter-spacing: 0.01em;
	font-weight: 900;
}

.hero-content h1,
.hero-content .hero-brand {
  font-size: 3.0rem;
  color: var(--bs-primary);
  text-shadow: 0 3px 20px var(--bs-secondary);
  letter-spacing: 0.02em;
}

.section-title {
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 2.5rem;
  color: var(--bs-primary);
  letter-spacing: 0.04em;
}

.section-subtitle {
  font-family: 'Merriweather', serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--bs-dark);
}

.card-text {
  color: var(--bs-primary) !important;
}
.card-title { color: var(--bs-primary); font-weight: 600; }

.visually-hidden {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0, 0, 0, 0) !important;
  border: 0 !important; white-space: nowrap !important;
}

@media (max-width: 991.98px) {
  body { padding-top: 80px; }
}


.page-header {
    background: var(--bs-gradient-hero-bg);
    color: var(--bs-primary); /* or another theme color */
    padding: 2.2em 0 1.2em 0;
    text-align: center;
}

.header-divider {
	max-width: 120px;
	border-color: var(--bs-dark-gold);
	border-width: 2px;
}


/* HERO SECTION & IMAGE */
.hero-section {
  position: relative;
  height: 100vh;
  overflow: hidden;
  background: var(--bs-gradient-hero-bg);
}
.hero-bg {
    background: url('/images/hero-bg-image-2.jpg') center center/cover no-repeat;
    /* 2, 4, 7, 5, 6, 1, */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.hero-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.75); /* White overlay with 48% opacity */
    z-index: 1;
}
.hero-bg > .container {
    position: relative;
    z-index: 2;
}
.hero-image {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
  filter: brightness(0.85) saturate(1.2) blur(2px);
}

.hero-desktop { background-image: url('/assets/images/hero4-a.jpg'); display: block; }
.hero-mobile { background-image: url('/assets/images/hero4-a.jpg'); display: none; }
.hero-content {
  position: relative; z-index: 2; color: var(--bs-light); text-align: left;
  top: 50%; left: 10%; transform: translateY(-50%);
  padding: 1rem;
  background: rgba(255, 241, 248, 0.53);
  border-radius: 2rem;
  box-shadow: var(--bs-shadow-hero);
}
.hero-content .lead {
  font-size: 2.2em;
  color: var(--bs-primary);
  text-shadow: 0 3px 8px var(--bs-secondary);
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .hero-content {
    position: relative; top: unset; left: unset; transform: none; text-align: center;
    padding: 12rem 1.2rem 2rem 1.2rem; width: 100%; max-width: 100vw; margin: 0 auto; box-sizing: border-box;
    background: rgba(255,255,255,0.63); border-radius: 1.2rem;
  }
  .hero-desktop { display: none; }
  .hero-mobile { display: block; }
}
@media (max-width: 768px) and (orientation: landscape) {
  .hero-content { padding: 4rem 1rem 1.5rem 1rem; }
}
@media (min-width: 481px) and (max-width: 991.98px) and (orientation: landscape) {
  .hero-content { padding: 6rem 2rem 2rem 2rem; }
}


.hero-btn-animate {
    animation: heroBtnAppear 0.85s cubic-bezier(.6,1.4,.4,1) 0.2s both;
}
@keyframes heroBtnAppear {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.95);
    }
    70% {
        opacity: 1;
        transform: translateY(-6px) scale(1.06);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}



.hero-gradient-headline {
  background: linear-gradient(90deg,
    var(--bs-primary) 2%,
    var(--bs-info) 41%,
    var(--bs-warning) 99%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent; /* Chrome/Safari */
  font-weight: 900;
  letter-spacing: 0.02em;
  
}
.hero-gradient-headline .headline-accent {
  background: none !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: var(--bs-warning) !important; /* for Chrome/Safari */
  color: var(--bs-warning) !important;
}

@media (max-width: 575.98px) { /* Bootstrap XS mobile */
  .hero-gradient-headline,
  .hero-gradient-headline br,
  .lead {
    text-align: center;
  }
  .apply-now-hero {
    display: block;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.35rem;
    padding-top: 0.92rem;
    padding-bottom: 0.92rem;
    max-width: 340px;
    width: 100%;
    margin-top: 1.1rem;
    text-align: center;
  }
}





.hero-section {
	position: relative;
	overflow: hidden;
}

.hero-bg-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	z-index: 1;
	opacity: 0.9;
	pointer-events: none;
}

.hero-section .container,
.hero-section .row,
.hero-section .hero-content {
	position: relative;
	z-index: 2;
}








/* BUTTONS */
.btn-danger { --bs-btn-bg: var(--bs-danger); }
.btn-warning { --bs-btn-bg: var(--bs-warning); }


.btn-custom,
.btn-navbar-apply {
  color: var(--bs-light) !important;
  border: none;
  border-radius: 2em;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  letter-spacing: 0.5px;
  /* box-shadow: var(--bs-shadow-btn-cta); */
  padding: 0.65em 1.8em;
  font-size: 1.06rem;
  transition: background 0.18s, color 0.18s;
  display: inline-block;

  top: 2px;
  position: static; /* Remove top offset for alignment */
}

.btn-custom {
  background: var(--bs-gradient-primary);
}
.btn-custom:hover,
.btn-custom:focus {
  background: var(--bs-gradient-inverse);
  color: var(--bs-secondary);
}


.btn-primary-gradient {
	background: var(--bs-gradient-primary);
	color: var(--bs-secondary);
	border: none;
	font-family: 'Montserrat', Arial, sans-serif;
	font-weight: bold;
	border-radius: 40px;
	padding: 0.75em 2.2em;
	font-size: 1.2em;
	transition: box-shadow 0.16s;
	box-shadow: 0 2px 8px rgba(25,51,77,0.10);
}
.btn-primary-gradient:hover,
.btn-primary-gradient:focus {
	background: var(--bs-gradient-inverse);
    color: var(--bs-warning);
	box-shadow: 0 4px 18px rgba(25,51,77,0.24);
}

.btn-secondary-outline {
	background: transparent;
	color: var(--bs-primary);
	border: 2px solid var(--bs-primary);
	font-family: 'Montserrat', Arial, sans-serif;
	font-weight: bold;
	border-radius: 40px;
	padding: 0.75em 2.2em;
	font-size: 1.2em;
	transition: background 0.16s, color 0.16s, box-shadow 0.16s;
}
.btn-secondary-outline:hover,
.btn-secondary-outline:focus {
	background: var(--bs-light);
	color: var(--bs-blue);
	box-shadow: 0 2px 8px rgba(25,51,77,0.10);
}

.btn-tertiary-link {
	background: none;
	color: var(--bs-blue);
	border: none;
	font-family: 'Montserrat', Arial, sans-serif;
	font-weight: normal;
	padding: 0.75em 2em;
	font-size: 1em;
	text-decoration: underline;
	cursor: pointer;
}
.btn-tertiary-link:hover,
.btn-tertiary-link:focus {
	color: var(--bs-primary);
	text-decoration: none;
}


/* Sticky Footer CTA Button – Clean, Flat, Themed */
.btn-sticky-cta {
	display: inline-block;
	padding: 0.5em 1.3em;
	font-size: 1em;
	border-radius: 2em;
	font-family: 'Montserrat', Arial, sans-serif;
	font-weight: 700;
	background: var(--bs-warning);      
	color: var(--bs-primary);             
	border: none;
	box-shadow: var(--bs-shadow-btn-cta); /* your theme shadow */
	transition: background 0.15s, color 0.15s, box-shadow 0.13s;
	text-decoration: none;
	white-space: nowrap;
}
.btn-sticky-cta:hover,
.btn-sticky-cta:focus {
	background: var(--bs-light);        
	color: var(--bs-primary);             
	box-shadow: var(--bs-shadow-btn-cta-hover);
	text-decoration: none;
	outline: none;
}


/* CTA button grouping */
.cta-btn-group {
	display: flex;
	justify-content: center;
	gap: 1.5rem;
	flex-wrap: wrap;
	margin-top: 2rem;
}

.cta-btn-group .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.75em 0;
	line-height: 1.1;
	font-size: 1.2em;
	font-weight: bold;
	border-radius: 40px;
	width: 250px;
	min-width: 250px;
	height: 60px;
	box-sizing: border-box;
}

@media (max-width: 600px) {
	.cta-btn-group {
		flex-direction: column;
		align-items: center;
		gap: 1.2rem;
	}
	.cta-btn-group .btn {
		width: 92vw;
		min-width: 0;
		max-width: 350px;
	}
}

.btn-donate-gradient {
	background: var(--bs-warning); /* Gold yellow */
	color: var(--bs-primary);      /* Navy text */
	font-family: 'Montserrat', Arial, sans-serif;
	font-weight: 700;
	border-radius: 40px;
	padding: 0.65em 1.8em;
	font-size: 1.06rem;
	letter-spacing: 0.5px;
	box-shadow: var(--bs-shadow-btn-cta); 
	text-transform: uppercase;
	transition: background 0.16s, color 0.16s, box-shadow 0.16s;
	display: inline-flex;
	align-items: center;
}
.btn-donate-gradient:hover,
.btn-donate-gradient:focus {
	background: var(--bs-danger);  /* Use your brand red */
	color: var(--bs-light);         /* White text for max contrast */
	box-shadow: 0 7px 28px color-mix(in srgb, var(--bs-danger) 60%, #000);
}
.btn-donate-gradient i {
	font-size: 1.22em;
	margin-right: 0.7em;
}



/* Style ONLY plain links (no class or special attributes): */
a:not([class]) {
    color: var(--bs-blue);
    text-decoration: underline;
    font-weight: 500;
    transition: color 0.18s, text-decoration 0.18s;
}

a:not([class]):hover,
a:not([class]):focus {
    color: var(--bs-primary);
    text-decoration: underline solid var(--bs-primary); /* "wavy" or solid for accented underline */
}




.btn-navbar-apply {
  background: var(--bs-gradient-navbar-apply);
}
.btn-navbar-apply:hover,
.btn-navbar-apply:focus {
  background: var(--bs-gradient-navbar-apply-hover);
  color: var(--bs-secondary) !important;
  box-shadow: var(--bs-shadow-btn-cta-hover);
  text-decoration: none;
}

@media (max-width: 991.98px) {
  .navbar .btn-navbar-apply {
    display: block !important;
    width: 100% !important;
  }
}







/* CARDS */
.news-card-img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: 1.2rem 1.2rem 0 0;
    display: block;
}

.card-event { 
    background-color: var(--bs-grayorange);
    border-radius: 1rem;
}

.card {
    border-radius: 1.2rem !important;
    box-shadow: var(--bs-shadow-card);
    transition: transform 0.3s cubic-bezier(.7,1.7,.72,.92);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.card:hover {
    transform: translateY(-7px) scale(1.045);
    box-shadow: var(--bs-shadow-card-hover);
}

.card-img-top {
    border-radius: 1.2rem 1.2rem 0 0;
    box-shadow: var(--bs-shadow-card-img);
}

.card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
    color: var(--bs-card-color);
}

.card-body .btn {
    margin-top: auto;
}






/* ========= NAVBAR ========= */
.navbar {
	background-color: var(--bs-primary) !important;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	box-shadow: var(--bs-shadow-card);
}

.navbar-brand {
	padding-top: 0;
	padding-bottom: 0;
}
.navbar-brand img {
	height: 80px;
	width: 80px;
	background-color: var(--bs-danger);
	border-radius: 50%;
	padding: 3px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.navbar .nav-link {
	text-transform: uppercase;
	padding-top: 0.65em;
	padding-bottom: 0.65em;
	font-family: 'Montserrat', Arial, sans-serif;
	font-size: 1.06rem;
	font-weight: 700;
	letter-spacing: 0.5px;
	line-height: 1.5;
}
.navbar .nav-link,
.navbar .navbar-brand,
.navbar .navbar-brand:focus,
.navbar .navbar-brand:hover {
	color: var(--bs-secondary) !important;
}
.navbar .nav-link:hover {
	color: var(--bs-warning) !important;
}

.navbar-nav {
	align-items: center;
}

.navbar-toggler {
	border: none;
	background: transparent !important;
	box-shadow: none;
	outline: none;
}
.navbar-toggler:focus {
	box-shadow: none;
	outline: none;
}

/* Desktop social icons */
.navbar-social-icons a {
	color: var(--bs-secondary);
	margin-left: 1.5rem;
	transition: color 0.2s;
}
.navbar-social-icons a:hover {
	color: var(--bs-warning) !important;
}

/* Mobile social icons */
.navbar-social-icons-mobile a {
	color: var(--bs-secondary);
	font-size: 1.5rem;
	margin: 0 0.25rem;
}
.navbar-social-icons-mobile a:hover {
	color: var(--bs-light);
}

/* Dropdown active state */
.dropdown-item.active,
.dropdown-item:active {
	background-color: var(--bs-primary) !important;
	color: var(--bs-secondary) !important;
}

/* Mobile overrides */
@media (max-width: 991.98px) {
	.navbar-collapse {
		text-align: center;
	}
	.navbar-nav {
		width: 100%;
		flex-direction: column;
		align-items: center;
	}
	.navbar-nav .nav-link {
		font-size: 1.5rem;
		padding-top: 0.75rem;
		padding-bottom: 0.75rem;
		width: 100%;
		display: inline-block;
	}
}





/* Board Members */
.member-photo {
	width: 400px;
	height: 400px;
	object-fit: cover;
	border-radius: 12px;
	box-shadow: 0 2px 16px rgba(0,0,0,0.12);
	background: #f5f5f5;
}
@media (max-width: 767px) {
	.member-photo {
		width: 170px;
		height: 170px;
	}
}





/* Additional styles for events */
.event-featured-img {
	width: 100%;
	max-width: 350px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 8px;
	box-shadow: 0 4px 18px rgba(0,0,0,0.10);
	display: block;
}
.logo-bg-red.logo-event {
	width: 92px;
	height: 92px;
	padding: 0;
	background-color: #b70600;
	border-radius: 50%;
	box-shadow: 0 4px 24px rgba(25, 51, 77, 0.22);
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 16px;
}
.logo-bg-red.logo-event img {
	width: 82px;
	height: 82px;
	object-fit: contain;
	display: block;
}
@media (max-width: 991px) {
	.logo-event {
		display: none !important;
	}
	.event-featured-img {
		max-width: none;
		margin-bottom: 24px;
	}
}





/* Swiper styles */
.swiper-button-next, .swiper-button-prev { color: var(--bs-secondary); }
.swiper-slide { height: auto; display: flex; }
.swiper-slide .card { flex: 1; height: 100%; display: flex; flex-direction: column; }

footer {
  background: var(--bs-gradient-banner);
  color: var(--bs-secondary);
  padding: 1.4rem 0;
  text-align: center;
}
footer i {
  font-size: 2.2rem;
  color: var(--bs-light);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: always;
  text-rendering: optimizeLegibility;
  filter: drop-shadow(var(--bs-shadow-footer-icon));
}
footer i:hover { color: var(--bs-warning); }

.banner-section {
  background-image: url('assets/images/banner-background.jpg');
  background-color: var(--bs-light);
  background-size: cover;
  background-position: center;
  border-radius: 1rem;
  box-shadow: var(--bs-shadow-banner);
}
.banner-section h1 {
  font-size: 2.5rem;
  color: var(--bs-primary);
  text-shadow: 0 2px 20px var(--bs-secondary);
}
.banner-section p {
  font-size: 1.2rem;
  color: var(--bs-dark);
}

/* Feature icons and section highlights */
.svg-icon-section {
  background: var(--bs-gradient-section);
  border-radius: 2rem;
  box-shadow: var(--bs-shadow-card);
}
.svg-icon-section svg {
  filter: drop-shadow(var(--bs-shadow-footer-icon));
}


/* Event Modal Styles */
.event-modal {
	position: fixed;
	z-index: 1100;
	top: 0; left: 0; width: 100vw; height: 100vh;
	display: flex; align-items: center; justify-content: center;
}
.event-modal-overlay {
	position: absolute; width: 100vw; height: 100vh;
	background: rgba(0,0,0,0.48);
	top:0; left:0; z-index:0;
}
.event-modal-content {
	z-index: 1;
	max-width: 400px;
	background: var(--bs-gradient-hero-bg);
	border: 2px solid var(--bs-dark-gold);
	border-radius: 1rem;
	box-shadow: var(--bs-shadow-soft);
	padding: 2rem 1.5rem 1.5rem;
	text-align: center;
	position: relative;
	animation: fade-in 0.6s;
}
.event-modal-content:focus {
	outline: none;
	border: 2px solid var(--bs-dark-gold); /* Ensures consistent border color */
}
@keyframes fade-in {
	from { opacity:0; transform:translateY(40px);}
	to   { opacity:1; transform:none;}
}
.event-modal-img {
	width: 120px; height:120px; object-fit:cover; border-radius:8px;
	box-shadow: var(--bs-shadow-card-img);
}
.event-modal-close {
	position: absolute; right:18px; top:12px; background:none; border:none;
	font-size:1.7rem; color: var(--bs-primary); cursor:pointer;
}
.event-modal-date {
	display: inline-block;
	font-weight: 600;
	padding: 2px 12px;
	font-size: 1.08rem;
	margin: 1em 0 0.7em;
	margin-left: 1.4em; /* Adjust this value as needed */
}
.event-modal-title {
	margin:0.5em 0 0.3em; font-size:1.23rem;
	color: var(--bs-primary); font-family: 'Playfair Display', serif;
}
.event-modal-location {
	color: var(--bs-dark-gold);
	font-size:1em; margin-bottom:.6em;
}
.event-modal-desc {
	color: var(--bs-dark);
	font-size:1em; margin-bottom:.7em;
}
.event-modal-register-btn {
	/* uses .btn, .btn-custom -- already styled by theme */
	margin-top:1.2em;
}

/* Sticky Footer Styles (Mobile) */
.event-sticky-footer {
	display: flex; align-items: center; justify-content: space-between;
	z-index:1001;
	position: fixed; left:0; right:0; bottom:0;
	background: var(--bs-gradient-banner);
	box-shadow: var(--bs-shadow-banner);
	border-top: 1.5px solid var(--bs-dark-gold);
	max-width: 480px; margin: 0 auto; width: 100%;
	padding: .6rem 1rem .6rem .85rem;
	transition: transform 0.25s;
}
.event-sticky-info {
	display:flex; align-items:center; gap:.65em;
}
.event-sticky-img {
	width:38px; height:38px; border-radius:8px; object-fit:cover; margin-right:.6em;
	box-shadow: var(--bs-shadow-footer-icon);
}
.event-sticky-title {
	font-weight:700; font-size:1.01em; color: var(--bs-warning);
	line-height:1.13; letter-spacing:0.01em;
	font-family:'Playfair Display',serif;
}
.event-sticky-date {
	font-size:0.94em;
	color: var(--bs-info);
	font-weight:500; letter-spacing: 0.01em;
}
.event-sticky-register-btn {
	margin-left:.85em;
	white-space:nowrap;
	min-width: 86px;
}
@media (max-width: 767.98px) {
	.event-modal { display:none !important; }
	.event-sticky-footer { max-width:100vw; }
}
@media (min-width: 768px) {
	.event-sticky-footer { display:none !important; }
}


/* ========= WORKSTREAM / FEATURE CARDS ========= */
.feature-card {
	border: none;
	border-radius: 0.75rem;
	box-shadow: var(--bs-shadow-card-purple);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	height: 100%;
}
.feature-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--bs-shadow-card-hover);
}
.feature-card-icon {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1rem;
	font-size: 1.5rem;
	color: var(--bs-white);
}
.feature-card-icon.icon-gold    { background-color: var(--bs-dark-gold); }
.feature-card-icon.icon-navy    { background-color: var(--bs-primary); }
.feature-card-icon.icon-green   { background-color: var(--bs-success); }

.feature-card .card-title {
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: 0.5px;
}
.feature-card .card-subtitle {
	font-size: 0.9rem;
	color: var(--bs-dark);
	opacity: 0.55;
	margin-bottom: 1.25rem;
}

/* Checkmark bullet list used inside workstream cards */
.checkmark-list {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
	text-align: left;
}
.checkmark-list li {
	padding: 0.4rem 0;
	padding-left: 1.5rem;
	position: relative;
	font-size: 0.95rem;
	line-height: 1.5;
}
.checkmark-list li::before {
	content: "\f00c";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	position: absolute;
	left: 0;
	font-size: 0.75rem;
	top: 0.55rem;
}
.checkmark-list.list-gold li::before  { color: var(--bs-dark-gold); }
.checkmark-list.list-navy li::before  { color: var(--bs-primary); }
.checkmark-list.list-green li::before { color: var(--bs-success); }

/* Volunteer checkbox tiles */
.volunteer-check-tile {
	display: flex;
	align-items: center;
	padding: 0.75rem 1rem;
	background-color: var(--bs-white);
	border: 1px solid var(--bs-grayorange);
	border-radius: 0.375rem;
	cursor: pointer;
}
.volunteer-check-tile:has(input:checked) {
	border-color: var(--bs-dark-gold);
	background-color: var(--bs-parchment);
}
.volunteer-check-tile .form-check-input:checked {
	background-color: var(--bs-dark-gold);
	border-color: var(--bs-dark-gold);
}
.volunteer-check-tile input[type="checkbox"] {
	width: 1.15em;
	height: 1.15em;
	flex-shrink: 0;
}


/* News pagination - themed */
.pagination .page-link {
  color: var(--bs-primary);
  background-color: var(--bs-white);
  border-color: var(--bs-primary-border-subtle);
}

/* Hover/Focus */
.pagination .page-link:hover,
.pagination .page-link:focus {
  color: var(--bs-secondary);
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--bs-primary) 25%, transparent);
  text-decoration: none;
}

/* Active page */
.pagination .page-item.active .page-link {
  color: var(--bs-secondary);
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* Disabled prev/next */
.pagination .page-item.disabled .page-link {
  color: color-mix(in srgb, var(--bs-dark) 45%, var(--bs-light));
  background-color: var(--bs-light-bg-subtle);
  border-color: var(--bs-primary-border-subtle);
}

/* Optional: slightly rounder, more "button-like" feel */
.pagination .page-link {
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}


[data-aos].card, .card[data-aos] {
  will-change: transform, box-shadow;
  transition: transform 0.7s cubic-bezier(.22,1.17,.54,.55), box-shadow 0.7s;
}
[data-aos].card.aos-animate, .card[data-aos].aos-animate {
  transform: translateY(-12px) scale(1.045);
  box-shadow: var(--bs-shadow-footer-icon-hover);
}

