/* CSS */      
.font-weight-nachor{
	font-weight: 600;
}
.highlight-on-load.highlighted {
	background-color: #fff3cd;
	border-left: 4px solid #ffc107;
	padding: 6px 10px;
	display: inline-block;
	font-weight: bold;
	opacity: 0;  /* Start invisible */
	animation: highlightFadeIn 1s forwards;  /* Apply the fade-in animation */
}

/* Remove any animations that cause fading */
@keyframes highlightFadeIn {
	0% {
		background-color: #ffeeba;
		opacity: 0;
		transform: translateY(-5px);
	}
	100% {
		background-color: #fff3cd;
		opacity: 1;
		transform: translateY(0);
	}
}
.center{
	text-align: center;
	margin: 0 auto;
}

/* CSS */
.button-85 {
	padding: 0.6em 2em;
	border: none;
	outline: none;
	color: rgb(255, 255, 255);
	background: #333f50;
	cursor: pointer;
	position: relative;
	z-index: 0;
	border-radius: 10px;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
	will-change: transform;
	transition: all 300ms cubic-bezier(.23, 1, 0.32, 1);
}
.button-85:before {
content: "";
/*background: linear-gradient(
	45deg,
	#ff0000,
	#ff7300,
	#fffb00,
	#48ff00,
	#00ffd5,
	#002bff,
	#7a00ff,
	#ff00c8,
	#ff0000
);*/
position: absolute;
top: -2px;
left: -2px;
background-size: 400%;
z-index: -1;
filter: blur(5px);
-webkit-filter: blur(5px);
width: calc(100% + 4px);
height: calc(100% + 4px);
animation: glowing-button-85 20s linear infinite;
transition: opacity 0.3s ease-in-out;
border-radius: 10px;
}

@keyframes glowing-button-85 {
0% {
	background-position: 0 0;
}
50% {
	background-position: 400% 0;
}
100% {
	background-position: 0 0;
}
}

.button-85:after {
z-index: -1;
content: "";
position: absolute;
width: 100%;
height: 100%;
background: #3a475b;
left: 0;
top: 0;
border-radius: 10px;
}
.button-85:hover{
	transform: translateY(-2px);
}
.button-85:active{
	transform: translateY(0);
}

.astrodivider {
	/* margin: 64px auto; */
	margin: 54px auto 22px auto;
	width: 100%;
	max-width: 100%;
	position: relative;
}

.astrodividermask {
	overflow: hidden;
	height: 20px;
}

.astrodividermask:after {
	content: '';
	display: block;
	margin: -25px auto 0;
	width: 100%;
	height: 25px;
	border-radius: 125px / 12px;
	box-shadow: 0 0 8px #061c60;
}

/* === HEADING STYLE #3 === */
.three h1 {
	font-size:38px;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.5em;
	padding-bottom: 15px;
	position: relative;
	color: #48525B;
}
.three h1:before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 5px;
	width: 55px;
	background-color: #ffbf00;
}
.three h1:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 2px;
	height: 1px;
	width: 95%;
	max-width: 350px;
	background-color: #f1ba17;
}

/*ACCORDION CSS*/
.accordion {
max-width: 900px;
margin: 0 auto;
}

.accordion-item {
background: #fff;
border-radius: 12px;
margin-bottom: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
overflow: hidden;
transition: all 0.3s ease;
}

.accordion-header {
width: 100%;
padding: 18px 24px;
background: rgb(51 63 80);
border: none;
outline: none;
text-align: left;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
font-size: 18px;
font-weight: 600;
color: rgb(255 191 0);
}

.accordion-header:hover {
background: #2a3b59;
color: #fff;
}

.accordion-content {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease, padding 0.3s ease;
padding: 0 24px;
}

/* When active, show content and allow scroll if too long */
.accordion-item.active .accordion-content {
max-height: 700px; /* adjust as needed */
padding: 16px 24px 24px;
overflow-y: auto;
scrollbar-width: thin;       /* Firefox */
scrollbar-color: #bbb #f1f1f1;
}

/* Optional: Custom scrollbars (Chrome, Edge, Safari) */
.accordion-content::-webkit-scrollbar {
width: 6px;
}
.accordion-content::-webkit-scrollbar-thumb {
background-color: #ccc;
border-radius: 3px;
}
.accordion-content::-webkit-scrollbar-track {
background: #f1f1f1;
}

.accordion-header .arrow {
transition: transform 0.3s ease;
}

.accordion-item.active .arrow {
transform: rotate(90deg);
}

/* List Styling */
.resource-list {
list-style: none;
padding: 0;
margin: 0;
display: grid;
gap: 12px;
}

.resource-list li {
display: flow;
flex-direction: column;
background: #f1f6fd;
border: 1px solid #dce6f5;
border-radius: 10px;
padding: 12px 16px;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
transition: background 0.3s ease;
}

.resource-list li > svg {
margin-bottom: 6px;
fill: #6b8bbd;
width: 24px;
height: 24px;
}

.resource-list li > a,
.resource-list li > span {
font-weight: 600;
color: #2a3b59;
margin-left: 32px;
}

.sub-resource-list {
list-style-type: disc;
padding-left: 40px;
margin-top: 8px;
}

.sub-resource-list li {
font-size: 14px;
margin: 4px 0;
}

.sub-resource-list li a {
color: #4663a9;
text-decoration: none;
}

.sub-resource-list li a:hover {
text-decoration: underline;
}

@media (max-width: 600px) {
	.resource-list {
		grid-template-columns: 1fr;
	}
}

.resource-list li > a:hover {
	font-weight: 600;
	color: rgb(73 89 117);
	margin-left: 32px;
}
/*END OF ACCORDION CSS*/

/*CCL CARDS CSS*/
.row-height {
display: flex;
flex-wrap: wrap;
}

.row-height > [class*="col-"] {
display: flex;
flex-direction: column;
}

.card {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
height: 300px; /* Fixed height for better visibility */
padding: 20px;
border-radius: 10px;
/*background-color: #E6E6FA !important;*/ /* Soft baby blue background */
box-shadow: 0 6px 12px rgb(51 63 80 / 40%);
border: 1px solid rgb(51 63 80) !important;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover animation */
.card:hover {
transform: translateY(-10px);
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}

.card h3 {
color: #333f50; /* Soft coral/peach color for font */
font-size: 18px;
margin-bottom: 10px;
}

.card p {
flex-grow: 1;
color: #333;
font-size: 14px;
line-height: 1.5;
}

.card .button {
display: inline-block;
padding: 10px 15px;
background-color: #333f50; /* Soft coral/peach button color */
color: #fff;
border-radius: 6px;
text-decoration: none;
margin-top: 15px;
font-size: 1.2rem;
text-align: center;
}

.card .button:hover {
background-color: rgb(64 76 93); /* Darker coral/peach shade on hover */
}
/*END OF CCL CARDS CSS*/

#blurb {
	padding: 40px 20px;
	background-color: rgb(51 63 80 / 20%);
}
.blurb-container {
	justify-content: space-between;
	gap: 30px;
	max-width: 1200px;
	margin: 0 auto;
	flex-wrap: wrap;
}
.blurb-section {
	background-color: #ffffff;
	padding: 30px;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	min-width: 300px;
}
.section-content {
	font-size: 1em;
	color: #555;
	line-height: 1.6;
	text-align: left;
}

.section-content ul li a{
	font-weight: 600;
}

/*CARD IMG CSS*/
.card-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
}

.card-img {
	background-color: #fff;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-img:hover {
	transform: translateY(-8px);
	box-shadow: 0 16px 32px rgba(0, 0, 0, 0.15);
}

.card-img img {
	width: 100%;
	height: 200px;
	object-fit: cover;
}

.card-content-img {
	padding: 20px;
}

.card-content-img h3 {
	margin: 0 0 10px;
	font-size: 1.25rem;
	color: #333;
}

.card-content-img p {
	margin: 0;
	font-size: 1rem;
	color: #666;
	line-height: 1.5;
}
/*END OF CARD IMG CSS*/