/* ===================================================================
 * Custom styles for Bryan Counseling website
 * ------------------------------------------------------------------- */

/* Section spacing and backgrounds - white and gray alternating */
#about {
	background: #FFFFFF;
	padding-top: 8rem;
	padding-bottom: 12rem;
}

#credentials {
	background: #EAEAED;
	padding-top: 12rem;
	padding-bottom: 12rem;
}

#method {
	
 	background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../images/the-thinker.jpg) no-repeat center;
	padding-top: 12rem;
	padding-bottom: 12rem;  
	/* background: #FFFFFF; */
 	/* -webkit-background-size: cover;
    	-moz-background-size: cover;
    	background-size: cover;
   	 width: 100%;
    	height: 100%;
   	 min-height: 500px;
   	 display: table;
   	 position: relative;*/
	
}

#specializations {
	background: #EAEAED;
	padding-top: 12rem;
	padding-bottom: 12rem;
}

#protocols {
	background: #FFFFFF;
	padding-top: 12rem;
	padding-bottom: 12rem;
}

#speaking {
	background: #EAEAED;
	padding-top: 12rem;
	padding-bottom: 12rem;
}

#testimonials {
	background: #FFFFFF;
	padding-top: 12rem;
	padding-bottom: 15rem;
}

#contact {
	background: #c07858;
	padding-top: 12rem;
	padding-bottom: 12rem;
}

/* Bio section with image on left */
#about .row {
	display: flex;
	align-items: flex-start;
	gap: 4rem;
	flex-wrap: wrap;
}

#about .row.section-intro {
	display: block;
}

.bio-image-left {
	flex: 0 0 500px;
	max-width: 500px;
}

.bio-image-left img {
	width: 500px;
	height: 500px;
	object-fit: cover;
	border-radius: 8px;
	filter: contrast(1.1) saturate(0.9);
}

.bio-text-right {
	flex: 1;
	min-width: 300px;
}

/* Speaking engagements - reduce spacing between items */
.speaking-list p {
	margin-bottom: 0.5rem;
	line-height: 1.6;
}

.speaking-list p:first-of-type {
	margin-bottom: 2rem;
}

/* Protocols section - stacked title */
#protocols h1 br {
	display: block;
}

/* Responsive spacing and layout adjustments */
@media only screen and (max-width:1200px) {
	.bio-image-left {
		flex: 0 0 400px;
		max-width: 400px;
	}
	
	.bio-image-left img {
		width: 400px;
		height: 400px;
	}
}

@media only screen and (max-width:1024px) {
	.bio-image-left {
		flex: 0 0 350px;
		max-width: 350px;
	}
	
	.bio-image-left img {
		width: 350px;
		height: 350px;
	}
}

@media only screen and (max-width:768px) {
	#about, #credentials, #method, #specializations, #protocols, #speaking, #testimonials, #contact {
		padding-top: 9rem;
		padding-bottom: 9rem;
	}
	
	#about .row {
		flex-direction: column;
		align-items: center;
		gap: 3rem;
	}
	
	.bio-image-left {
		flex: 0 0 300px;
		max-width: 300px;
	}
	
	.bio-image-left img {
		width: 300px;
		height: 300px;
	}
}

@media only screen and (max-width:600px) {
	#about, #credentials, #method, #specializations, #protocols, #speaking, #testimonials, #contact {
		padding-top: 7rem;
		padding-bottom: 7rem;
	}
	
	.bio-image-left {
		flex: 0 0 250px;
		max-width: 250px;
	}
	
	.bio-image-left img {
		width: 250px;
		height: 250px;
	}
}