/* ============================================================
   Location page styles (single-aioseo-location.php)
   Loaded via its own enqueue in Divi-child/functions.php.
   NOTE: Divi-child/style.css is NOT enqueued by this theme, so
   location styles must live here, not there.
   ============================================================ */

/* --- Hero CTAs: Get Directions / Order Now ---
   Inverted pair, both solid so they stay legible over any photo. */
.flexible-section.flexible-banner-section .flexible-banner-btns{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
	margin-top:22px;
}
.flexible-section.flexible-banner-section a.flexible-banner-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:52px;
	padding:14px 34px;
	font-family:'Francois One',Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1.2;
	letter-spacing:.5px;
	text-transform:uppercase;
	text-decoration:none !important;
	border:2px solid #ffffff;
	border-radius:4px;
	transition:background-color .2s ease,color .2s ease;
	box-shadow:0 3px 14px rgba(0,0,0,.28);
}
.flexible-section.flexible-banner-section a.flexible-banner-btn--light{
	background-color:#ffffff;
	color:#046444 !important;
}
.flexible-section.flexible-banner-section a.flexible-banner-btn--light:hover{
	background-color:#046444;
	color:#ffffff !important;
}
.flexible-section.flexible-banner-section a.flexible-banner-btn--brand{
	background-color:#046444;
	color:#ffffff !important;
}
.flexible-section.flexible-banner-section a.flexible-banner-btn--brand:hover{
	background-color:#ffffff;
	color:#046444 !important;
}
.flexible-section.flexible-banner-section .btn-label-short{display:none;}

/* --- "Also Visit Our Other Locations" sibling cross-links --- */
.flexible-section.flexible-other-locations-section{
	padding:20px 0 60px;
	text-align:center;
}
.flexible-section.flexible-other-locations-section .section-title{
	color:#046444 !important;
	text-transform:uppercase;
	text-align:center;
	font-size:40px !important;
	line-height:1.2;
	margin:0 0 25px;
}
.flexible-other-locations-list{
	display:flex;
	flex-wrap:wrap;
	gap:16px;
	justify-content:center;
	align-items:stretch;
}
.flexible-section.flexible-other-locations-section a.flexible-other-location-link{
	margin:0;
	color:#ffffff !important;
	font-size:18px;
	background-color:#046444;
	padding:14px 28px !important;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	line-height:1.3;
	transition:background-color .2s ease;
}
.flexible-section.flexible-other-locations-section a.flexible-other-location-link:hover{
	background-color:#035237;
}

/* --- Responsive --- */
@media (max-width:1024px){
	.flexible-section.flexible-other-locations-section .section-title{font-size:30px !important;}
}
@media (max-width:767px){
	/* keep hero CTAs comfortably above the fold on phones */
	.flexible-section.flexible-banner-section .flexible-banner-content-info{
		padding:30px 0;
		gap:6px;
	}
	.flexible-section.flexible-banner-section .flexible-banner-btns{
		gap:10px;
		margin-top:16px;
	}
	.flexible-section.flexible-banner-section a.flexible-banner-btn{
		min-height:46px;
		padding:12px 20px;
		font-size:16px;
		letter-spacing:.3px;
		flex:1 1 auto;
	}
	.flexible-section.flexible-banner-section .btn-label-full{display:none;}
	.flexible-section.flexible-banner-section .btn-label-short{display:inline;}

	.flexible-section.flexible-other-locations-section{padding:10px 0 40px;}
	.flexible-section.flexible-other-locations-section .section-title{font-size:28px !important;}
	.flexible-other-locations-list{gap:12px;}
	.flexible-section.flexible-other-locations-section a.flexible-other-location-link{
		font-size:16px;
		padding:12px 20px !important;
	}
}
@media (max-width:360px){
	.flexible-section.flexible-banner-section a.flexible-banner-btn{
		font-size:15px;
		padding:11px 14px;
	}
}

/* --- Dog-friendly page: FAQ section (accordion, updated 2026-08-03) --- */
.flexible-section.flexible-faq-section{
	padding:20px 0 80px;
}
.flexible-section.flexible-faq-section .section-title{
	color:#046444 !important;
	text-transform:uppercase;
	text-align:center;
	font-size:40px !important;
	margin:0 0 28px;
}
.flexible-faq-list{
	display:flex;
	flex-direction:column;
	gap:18px;
	max-width:900px;
	margin:0 auto;
}
details.flexible-faq-item{
	background:#f4f9f7;
	border-left:6px solid #046444;
	border-radius:14px;
	padding:0;
	overflow:hidden;
}
details.flexible-faq-item summary.flexible-faq-question{
	list-style:none;
	cursor:pointer;
	margin:0;
	padding:24px 56px 24px 32px;
	font-size:21px;
	line-height:1.35;
	color:#046444;
	position:relative;
	user-select:none;
}
details.flexible-faq-item summary.flexible-faq-question::-webkit-details-marker{
	display:none;
}
details.flexible-faq-item summary.flexible-faq-question::after{
	content:"";
	position:absolute;
	top:50%;
	right:28px;
	width:12px;
	height:12px;
	border-right:2px solid #046444;
	border-bottom:2px solid #046444;
	transform:translateY(-70%) rotate(45deg);
	transition:transform .2s ease;
}
details.flexible-faq-item[open] summary.flexible-faq-question::after{
	transform:translateY(-30%) rotate(-135deg);
}
details.flexible-faq-item summary.flexible-faq-question:hover{
	background:rgba(4,100,68,.06);
}
.flexible-faq-answer,
.flexible-faq-answer p{
	margin:0;
	font-size:17px;
	line-height:1.7;
}
.flexible-faq-answer{
	padding:0 32px 24px 32px;
}
@media (max-width:1024px){
	.flexible-section.flexible-faq-section .section-title{font-size:30px !important;}
}
@media (max-width:767px){
	.flexible-section.flexible-faq-section{padding:10px 0 50px;}
	.flexible-section.flexible-faq-section .section-title{font-size:28px !important;}
	details.flexible-faq-item summary.flexible-faq-question{
		padding:18px 44px 18px 20px;
		font-size:19px;
	}
	details.flexible-faq-item summary.flexible-faq-question::after{
		right:20px;
		width:10px;
		height:10px;
	}
	.flexible-faq-answer{padding:0 20px 18px 20px;}
	.flexible-faq-answer,.flexible-faq-answer p{font-size:16px;}
}

/* Explicit collapse rule — something on this page overrides the native
   details/summary collapse behavior, so force it rather than rely on it. */
details.flexible-faq-item:not([open]) > .flexible-faq-answer{
	display:none !important;
}